A week or so ago, I decided to combine some personal training with a small Safe Network app project. I wasn’t sure exactly what I wanted to do, but I wanted to play with the following - Angular, Rust and WASM. I’m not new to Angular, but I wanted to create something useful to put on my github account. Rust and WASM, are new to me though and it was fun to have a play!
So, what is the result? Well, as I do a bit of blogging, I thought a blog app which could read articles from Safe Network would be handy. As we don’t have a working browser for the network, I wanted to explore integration with a clear net browser. I didn’t just want something that only worked on clear net though, so I designed it to work on a future safe browser too - one blog for both platforms.
The client app is written in Angular and it is ready for both a WASM integration and a native safe browser. The app itself doesn’t really care where the data comes from, as long as it can ingest it. WASM in current form couldn’t retrieve articles directly, but I did create a noddy service to just fetch JSON documents from a WASM binary, which satiated my desire to learn a bit about it.
Articles are stored to the Safe Network in Markdown format, then added to a JSON index. The client uses the index to show the articles on the blog home page. The articles are converted into HTML on the fly by an Angular plugin. Any Safe URLs are converted to use the gateway endpoint instead, including images in the articles. All these things can happen in a working safe browser too.
I called the app ‘I am IMMUTABLE’, as I like the double meaning. You can find the code here:
As a clear net app can’t directly access the Safe Network, I decided I needed some sort of web service back end. After mulling a few options, I figured that trying out a Rust web framework would be useful. After an unsuccessful play with Rocket (it doesn’t like tokio!), I went with a bleeding edge version of Actix (which does like recent tokio!). After having some fun with broken sn_client dependencies (thanks for help, @bochaco!), I got something working.
I decided sn_httpd was a decent name, although maybe a touch pretentious! It does feel like the basis of some sort of Safe Network HTTP server though. It has two main functions:
- Host static files through standard Actix routines.
- Provide an endpoint to retrieve blobs of data from the Safe Network.
Hosting static files is nothing novel, but I used the example sn_api code as a basis to integrate the sn_client directly into the sn_httpd app. When you hit /blob/, it goes and fetches the data from the Safe Network, defines appropriate caching and returns it to the client. ShortSafeURL is just the bit after ‘safe://’, e.g. ‘myurl’ for ‘safe://myurl’.
This means you can server an Angular app (static HTML/CSS/Javascript) and let it connect to the Safe Network via GETs to /blob/. Moreover, XOR URLs return headers to cache indefinitely, allowing the browser to just get them once.
You can find the code here:
Then I wanted to provide some configuration/build support, so I had a crack at some Docker containers and scripts to help pull it together. I created a container to bundle a compiled sn_httpd along with the i-am-immutable client. I messed about with trying to get a local network container working too, but Docker/sn_node didn’t like each other enough. In fact, even getting sn_httpd to talk to a local network required a host network (Linux only!). So, all work in progress, but you can find it here:
There are many, many things I would like to add, but I wanted to get to a sort of proof of concept point. I think the above do that quite nicely. It proves we can make hybrid clear net/Safe Network apps, which share data with both platforms. Yes, it is a bit slow, raw, basic, but it works. I’m quite pleased with that!
Some screen shots of the action!
There is some information about how to set it up in the README files. You don’t need to host it on AWS or some such - it can be hosted locally just fine (block that! ha!). Running on a hosted environment is possible, but anyone could leach the bandwidth to any blog on Safe Network (I have plans for that too…), so take caution.
I hope you like it! Have fun!