Jump to content
Sign in to follow this  
buzzkillb

Create a Website using IPFS Daemon

Recommended Posts

334

500 posts
1223 BF$

As a way to see if any features would be great to add to Jupiter Denarius IPFS uploader I figured why not create a website that can autoupdate on file changes and to the unsuspecting eye a typical user can't tell they are using an IPFS website.

Example of what we are making as a test of full IPFS powah.

image.png.c9de5d441de6a051f9fa581794f03cd3.png

First install IPFS, using ubuntu command line for this.
https://docs.ipfs.io/guides/guides/install/
Download latest binary here https://dist.ipfs.io/#go-ipfs

Open 2 terminals into your VPS or VM as eventually for this exercise we will run a daemon in 1 terminal and commands in the 2 terminal.

Init IPFS and if in a datacenter (VPS) use the profile server flag.

ipfs init --profile server

This will give some information. I saved it to a text file because I had no idea if this is required for anything or not. Its not.

in 1 terminal lets run the daemon

ipfs daemon

Make a folder like /home/user/test

cd ~
mkdir test
cd test

put a file in there, anything, I am gonna get a block height that updates every so often

wget https://pos.watch/height.txt

create an index.html gonna use a quick sample so we use some javascript to read the height.txt file

<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>Cool Test Site | Oh Yeah $D</title>
    <meta name="twitter:card" content="summary">
    <meta name="twitter:url" content="http://api.pos.watch">
    <meta name="twitter:title" content="Testing IPFS">
    <meta name="twitter:description" content="Is Anyone Seeing Me?">
    <meta name="twitter:image" content="https://i.imgur.com/lCvgFft.png?1">
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-129064662-1"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <meta name="google-site-verification" content="Rzkn_bajLR1WONHcP8ob-oP1TWDTZisaYGzeze3Rfnw" />
    <link rel="manifest" href="/site.webmanifest">
</head>

<body>
    <div>
        FULL IPFS TEST: 
          |  
        Block Height: <span id="height"></span>
          |  
        PEER ID: REPLACEMEAFTERTRYINGTHISOUT
    </div>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js'></script>
    <script type="text/javascript" src="./script.js?version=0.01337"></script>
</body>
</html>

Create script.js so we have a javascript to read the file

fetch('height.txt')
  .then(function(response) {
    return response.json();
  })
  .then(function(data) {
    if (data)
        $('#height').html("");
        $("#height").append(data);
        window.blockheight = (data);
  })
  .catch(function(err) {
    console.log(err);
  });

Now the magic sauce to automate this, change the folder path to your folder path

TMP=`ipfs add -r /home/user/test/ | awk 'END{printf $2}'` && ipfs name publish $TMP

What this does is it recursively adds the test directory and then reads the last hash line and publishes to your PEERID, example output below

Published to QmdKLWPao7d5NZQC92s6TRMVBuBrHfCyNZhVXTKAU42kuN: /ipfs/QmXzYAPHsNLucHFUS1tg1FW9P1PiDyq16ar1tGAhmfW13H

peerid is QmdKLWPao7d5NZQC92s6TRMVBuBrHfCyNZhVXTKAU42kuN

Now how do we view this like a normal website? I am going to use namecheap for this sample.

image.thumb.png.b94809788f7baa8ef65dbcff29b0ad03.png

In my example the peerid resolves to ipns and is using dnslink. api is my subdomain for practicing purposes. Which once this all propogates we can now go to http://api.pos.watch

I suspect Denarius can do some really cool things if the wallet had DNS and a few more options like peerid.

  • Like 2

If you enjoy my content please consider donating to the Denarius creator - https://www.patreon.com/carsenk
Join Denarius Discord - https://discord.gg/JQEmXwb

Share this post


Link to post
Share on other sites
334

500 posts
1223 BF$

To take this a step further lets add TLS which requires nginx and letsencrypt certbot.

remove the TXT and CNAME records from above and create A, AAAA, and TXT records for the example subdomain.

image.thumb.png.8526248e9e09cb37dc69c95c861759d0.png

Install nginx

apt-get update
apt-get install nginx

Change the default config

nano /etc/nginx/sites-available/default

to this

server {
    server_name ipfs.example.com;
    server_tokens off;

    listen 80;
    listen [::]:80;
    listen 443 ssl;
    listen [::]:443 ssl;

    location / {
        proxy_pass http://localhost:8080;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

test the config

nginx -t

Install certbot

add-apt-repository ppa:certbot/certbot
apt-get update
apt-get install python-certbot-nginx

run certbot

certbot --nginx -d ipfs.example.com

Say yes to always use 443 or https, whatever it says, you want YES.

reload nginx

systemctl reload nginx

Lets setup some automation, first to automate the certbot renewal.

crontab -e
15 3 * * * /usr/bin/certbot renew --quiet

Create a service to restart IPFS on reboot

sudo nano  /etc/systemd/system/ipfs.service

edit to this

[Unit]
Description=IPFS daemon
After=network.target

[Service]
### Uncomment the following line for custom ipfs datastore location
# Environment=IPFS_PATH=/path/to/your/ipfs/datastore
ExecStart=/usr/local/bin/ipfs daemon --enable-namesys-pubsub
Restart=on-failure

[Install]
WantedBy=default.target

star the service and enable on reboot

systemctl start ipfs
systemctl enable ipfs

Now the website has TLS and fully served through IPFS.

image.thumb.png.84aeca4751d293276e28923ca0b78e59.png

Come up with a way to automate this command and the ipns will automatically update.

TMP=`ipfs add -r /home/user/chaindata/ | awk 'END{printf $2}'` && ipfs name publish $TMP

 

  • Like 1

If you enjoy my content please consider donating to the Denarius creator - https://www.patreon.com/carsenk
Join Denarius Discord - https://discord.gg/JQEmXwb

Share this post


Link to post
Share on other sites
334

500 posts
1223 BF$

an experimental feature to try getting ipns working faster is, try adding to your service file above too

ipfs daemon --enable-namesys-pubsub

source: https://blog.ipfs.io/34-go-ipfs-0.4.14#ipns-improvements

to see if it worked run this command

ipfs pubsub ls

 

  • Like 2

If you enjoy my content please consider donating to the Denarius creator - https://www.patreon.com/carsenk
Join Denarius Discord - https://discord.gg/JQEmXwb

Share this post


Link to post
Share on other sites
334

500 posts
1223 BF$

Instead of using letsencrypt, its even easier to just use cloudflare. Full Guide over here for that https://blockforums.org/topic/425-how-to-setup-cloudflare-full-strict-and-ipns-ipfs/


If you enjoy my content please consider donating to the Denarius creator - https://www.patreon.com/carsenk
Join Denarius Discord - https://discord.gg/JQEmXwb

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×
×
  • Create New...