IPFS IPFS Camp 2022 - Browsers & Platforms, 1 Nov 2022

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: IPFS in Web Protocol Handlers with Agregore Browser - Mauve Signweaver

Description

We'll be showcasing how IPFS can have deep integration with web protocol handlers, and will be answering the question "What does it mean to POST to ipfs://
?"

A

Thanks for coming out, uh my name is smooth, my pronouns. Are they them, and today I'm going to be talking about how the aggregor browser deeply integrates ipfs via custom protocol handlers?

A

So before we get into the agricor bit and ipfs, let's quickly review what HTTP protocol handlers look like so typically, you'll have a URL with a scheme usually either HTTP or https and origin, which is usually the domain or an IP address, and a port and some path to our resource.

A

With an optional query parameters, we've also got some sort of headers that can describe either more information about your request or more information about what you want from the response response like the format and then you send all that to the server optionally with some sort of content, and then the server will give you back a status code, some more headers talking about what it sent and then another body so everywhere, where you might see a URL in the browser, this sort of dance is going on.

A

So specifically, this is done whenever you try to load web pages images, media like audio and video or website content like style sheets and scripts. The JavaScript in your browser can also programmatically trigger things with these URLs, using either the fetch API to programmatically, make requests or things like Event, Source or other higher level apis that just kind of automatically do something or other behind the scenes.

A

So, as was talked about before what, if we take the same approach from HTTP URLs, but then apply them to peer-to-peer URLs with a new kind of scheme, so, for example, in the same way that I could load something from https, I should be able to load it from ipns from ipfs from BitTorrent hypercore protocol and anything else.

A

Similarly, I should be able to do other things than just a get request. I should be able to post data into these protocols. The same way I would upload a file to a server. So that's pretty much what agrigore does core?

A

It mixes a bunch of peer-to-peer protocols for browsing peer-to-peer websites, while keeping support for HTTP and https to browse the Legacy web like regular web browser um I've mostly been focused on keeping the core of agrigore as minimal as possible and leaving as many features as possible to web extensions, which can be dynamically authored by users.

A

um Similarly, earlier this year we had a Dev Grant from filecoin, which let us put together a mobile version of agrigore by forking chromium and messing with the c plus to add custom protocol handlers. At the moment, mobile is not quite as feature-rich as desktop since we ran into some snags, but it supports ipfs loading and uploading. So it's already a good Baseline for peer-to-peer web apps.

A

So on desktop, we've got support for a bunch of protocol handlers, we've got ipfs and it's related Brethren like ipns, ipld and Pub sub and as well. We've got support for stuff like the hypercore protocol, which is another peer-to-peer protocol with a slightly different take on how their data Works we've got first class support for loading bittorrents, so you can browse a torrent just like you could any website. We've also got the ability to load SSB URLs, to use the browser as a viewer and just for fun.

A

We've got Gemini in there, which is kind of like an indie web gopher type thing. It's not even peer-to-peer, but it's radish heck so for ipfs in particular. We're able to load data from ipfs, ipns or ipld, which is similar to what browsers like Brave and cappyloon, do with being able to get some data from a Gateway or otherwise. But the thing that aggregore does, which other browsers don't yet is the ability to then upload data via the same protocol handlers and as well as just uploading data to ipfs.

A

You can also update ipns keys in your browser so that you can have mutable websites all without needing an extra DNS link or whatever else. um We've also got methods for managing keys. So you can have a bunch of websites that you can use as data storage backends to share between applications a little bit experimental.

A

We've actually got support for the lib P2P Pub sub API wrapped in a protocol Handler, and this is important for having ephemeral messaging on applications since, even though it's useful to be able to upload and download some content with ipfs for a lot of cases. You also want to have some sort of real-time communication around a topic, and so this is a really key feature for enabling things like chat, apps or collaborative editing.

A

Finally, I think that I've been experimenting with more is support for ipld URLs ipld being the lower level data model of ipfs, and this lets you kind of load any content on ipfs that may or may not be files and explore it in your browser, as well as having a straightforward path to authoring things.

A

You should come to my ipld talks later. If you want to learn more there cool so now, I'm going to attempt fate and do a live demo and we'll we'll see what this even looks like okay. So what we're gonna do is quickly make a website in agragore by uploading some stuff to ipfs, so I'm just going to copy paste this one bit and then I'll walk you through some live coding.

A

So I'm going to do this blind so um first thing we're going to do is open up Chrome, Dev tools, so other browsers that have done similar things in the past have relied on building custom, Dev tools and all of that I just kind of use. What's built into chromium and I'm planning on extending it a little bit just to make things nicer.

A

So what we're going to do uh is we're going to do a fetch request to that special URL.

A

So Buffy abaca yak is the CID for an empty directory and what we're going to say is that we want to add an index.html to it and we're going to oh. This is usually.

A

Okay, okay, so now I can see. So what we're going to say is we want to use the put method to add some data to this URL and we're going to specify some HTML in the body. So a lot of.

A

Oh, a lot of people might have opinions on how much they want in their HTML, but I think the only important bit is having the title and a doctype.

A

So we're gonna say hello, ipfs camp and since I am oh, oh.

A

A

um I gotta add some actual content to my page.

A

So I'm going to use the Marquee tag, since uh you know we're back in the 90s and.

A

We're gonna use some cool emojis because that's one of the things we didn't have in that 90s, which is good to have now so this here is enough to send a request to upload some data. However, at the moment, if I want to get back the URL of the page that gets created I'm going to look at the headers and I'm going to get the location header for the newly created resource, so bam as you can see there it.

A

Oh where's, my as you can see there, we've got an ipfs baffy URL, we're gonna copy the link and load it up. So if someone is quick at typing, they can use that and Bam we've got a website, so one other thing I wanted to show off is that we can actually take this ipfs hash and change the url scheme to ipld, and here you can actually browse through the ipld data set. So if there's any cids in there, you can actually just click through and explore the data set.

A

Similarly, these Buffy URLs are horrible to copy places, so we've got a built-in QR code scanner and QR code generator. So if you have another computer, you can scan this code and then load it from the peer-to-peer Network without having to copy things in all right.

A

A

Let me just on.

A

A

A

Okay, great so.

A

A

Okay, great, so that was the live demo here, I think I could take, and thank you for my love me lovely assistant, Dietrich cool. So what's the point of all of this I've been thinking about this concept. A Lot called local first software, it's software, which works offline fully, which can also automatically operate over local networks like a Wi-Fi hotspot or a mesh, and which can also seamlessly scale to work over the internet.

A

If you need it to it's, software that preserves user agency by keeping data controlled local to the user's device and giving them an obvious path to migrating it between apps. Basically, it's the opposite of what the cloud first apps give you out of the box and uh basing the web on these peer-to-peer protocol handlers and ipfs enables all of this functionality without any extra effort on the developers.

A

Part My Hope here is that we can simplify web development and make it more accessible to people I'd love to see more folks, building smaller scale, apps, which don't need megabytes of build tools and beefy developers. Machines just to get them running, I want to make it easy to publish and distribute that distribute. Apps the same way you would any data on the network.

A

I also want to have a clear path for to take existing software and to tweak it where you can just view the source, make some small changes and have your own version of an app. These approaches also work great with community-run mesh networks, such as those run by the groups in the association for Progressive, communication or APC. It enables communities to reduce the overall amount of bandwidth that needs to go over the Internet, which can reduce costs in areas where the internet could be expensive to run.

A

It's also generally good for speeding up traffic local to the mesh, since you can take advantage of local connections and local caching. Finally, local first web software enables communities to resist problems caused by Internet, outages or energy blackouts.

A

The resilience is important to look at now as a global climate change and political turmoil starts destroying physical and digital infrastructure worldwide. Worldwide. Part of my hope is that the learning we can get from these smaller scale communities can be applied to larger scales around the world and so that we can have resilience and community be the default rather than whatever effects of external forces.

A

So as part of these goals, we're working with folks to improve support on mobile devices to enable more people to use the peer-to-peer web as a daily driver, we're also working on documentation and example apps, along with how to make them so that somebody new to the community can start making their own apps with copy pasting and editing of others code, also working on connecting with other browser vendors and experimenting um with standardizing some of these protocols.

A

So right now, there's a lot of talk about getting from gateways, but I'd like to start the discussion about standardizing on uploading data so that peer-to-peer web apps written for aggregore could work seamlessly in capiloon and vice versa.

A

Finally, we're aiming to get the Baseline a little more solid so that we can have more serious deployments with Community mesh networks and enable them to do things that were hard. Otherwise.

A

So thanks for listening, if you're curious to learn more, come, join us on Matrix or Discord and start making for yourself and your community foreign.