Introduction: Nginx + DANE Hosting on Google VM for Handshake

Do you want to host your own Handshake site for FREE over SSL? Then follow this tutorial for setting up an nginx hosting service and securing your domains with DANE. This tutorial uses a Google Cloud VM and varo.domains for a Nameserver

Note. This tutorial uses Google Cloud which requires a credit/debit card to activate. If you follow this tutorial you won't be charged anything unless you create more than 1 VM.

Thanks to Rithvik Vibhu's awesome guide https://blog.htools.work/posts/hns-pdns-nginx/


To add a new site to this setup just repeat: Step 1. (excluding creating an account) and Steps 4-6

Supplies

  • Computer with a SSL resolver. We recommend fingertip
  • Handshake Domain (see here if you don't have one)

Step 1: Set Up Name Server

  1. Create an account at https://varo.domains/ or https://varo
  2. Add your Top level domain (TLD) using the Add Domain section
  3. Find the DS value for your domain at the bottom of the page
  4. Add the 3 records into the Namebase Blockchain DNS Records for your TLD

Step 2: Create Google Cloud VM

  1. Create a Google Cloud Account at https://console.cloud.google.com/
  2. Visit VM Instances and Accept all the terms
  3. Click Create Instance
  4. Choose any Name, but you need to keep it in "us-west1" Region and any of the us-west1 zones. If you select a different region you may be charged for the VM
  5. Set the size to E2-micro
  6. In the Boot Disk section, click Change
  7. Choose Ubuntu 20.04 LTS
  8. In the Firewall Section, Tick the Allow HTTP and the Allow HTTPS
  9. Click Create

Step 3: Setup Nginx

  1. Copy the External IP of the VM and write it down for later use
  2. Connect to the VM using Google cloud or your preferred SSH app

Thanks to Rithvik for the next steps

Run the below commands to install nginx (Note the # are comments you don't need to run them)


# Login as Admin
sudo -i
# Install nginx
apt install nginx -y
# Create a directory to store you website files
mkdir -p /var/www/
# Go to the nginx config location
nano /etc/nginx/sites-available/domains


Add the following content to the file

map $ssl_server_name $cert_folder {
      default $ssl_server_name;
      ~^(?<sld>.+)\.(?<tld>.+) $tld;
 }
server {
  listen 80;
  listen [::]:80;
  server_name ~^(?<sld>.+)\.(?<tld>.+)$;
  root /var/www/$tld;
  index index.html;


    location ~ /\.git {
        deny all;
    }
    location / {
        try_files /$sld/$uri /$sld/$uri/ $uri $uri/ @htmlext;
    }


    location ~ \.html$ {
        try_files /$sld/$uri $uri =404;
    }


    location @htmlext {
        rewrite ^(.*)$ $1.html last;
    }
    error_page 404 /404.html;
    location = /404.html {
        try_files /$sld/404.html /404.html
            internal;
    }
    location /.well-known/wallets/ {
            add_header Cache-Control 'must-revalidate';
            add_header Content-Type text/plain;
    }


    listen 443 ssl;
    ssl_certificate /etc/ssl/$cert_folder.crt;
    ssl_certificate_key /etc/ssl/$cert_folder.key;


}
server {
  listen 80;
  listen [::]:80;
  index index.html;
  server_name ~^(?<tld>.+)$;
  root /var/www/$tld;


    location ~ /\.git {
        deny all;
    }


    location / {
        try_files $uri $uri/ @htmlext;
    }


    location ~ \.html$ {
        try_files $uri =404;
    }


    location @htmlext {
        rewrite ^(.*)$ $1.html last;
    }
    error_page 404 /404.html;
    location = /404.html {
            internal;
    }
    location /.well-known/wallets/ {
            add_header Cache-Control 'must-revalidate';
            add_header Content-Type text/plain;
    }


    listen 443 ssl;
    ssl_certificate /etc/ssl/$ssl_server_name.crt;
    ssl_certificate_key /etc/ssl/$ssl_server_name.key;
}


Exit by using CTRL+X then Y (to save) then Enter

Add the file to the enabled sites by running

ln -s /etc/nginx/sites-available/domains /etc/nginx/sites-enabled/domains
# Restart nginx to make sure everything is working
sudo nginx -t && sudo systemctl restart nginx

Step 4: Add SSL Support (Easy Way)

Enable SSL support to allow your site to be visited by going to https://yourname

Create an SSL certificate by using certy/

  1. Go to https://certy/
  2. Enter your Handshake tld (in this example smartface)
  3. Enter the validity time of the certificate (usually 1 year or 365 days)
  4. Make sure Wildcard is selected and click Submit
  5. Download the 2 .crt and .key files.
  6. Save the TLSA Record for Step 6
  7. Open the .crt file in a text editor and copy the text
  8. In your VM enter (replacing smartface with your domain name)
cd /etc/ssl
nano smartface.crt

Paste the contents of the crt file you downloaded and use CTRL+x, y ENTER to exit & save

Repeat with

cd /etc/ssl
nano smartface.key

paste the .key file you downloaded and save using CTRL+x, y ENTER

To make sure nginx has access to these files run

sudo chmod -R 655 /etc/ssl

Step 5: Add SSL Support (Hard Way)

Enable SSL support to allow your site to be visited by going to https://yourname


Create an SSL certificate by running the below command. Make sure you change smartface to your TLD in 3 spots


openssl req -x509 -newkey rsa:4096 -sha256 -days 365 -nodes \
-keyout cert.key -out cert.crt -extensions ext -config \
<(echo "[req]";
echo distinguished_name=req;
echo "[ext]";
echo "keyUsage=critical,digitalSignature,keyEncipherment";
echo "extendedKeyUsage=serverAuth";
echo "basicConstraints=critical,CA:FALSE";
echo "subjectAltName=DNS:smartface,DNS:*.smartface";
) -subj "/CN=*.smartface"


TLSA Command:


Run the below command to generate your TLSA record. Save the output as you will need it later

echo -n "3 1 1 " && openssl x509 -in cert.crt -pubkey -noout | openssl pkey -pubin -outform der | openssl dgst -sha256 -binary | xxd  -p -u -c 32


Then move your certificates to the location required by nginx. Make sure to change smartface for your domain

sudo mv cert.key /etc/ssl/smartface.key
sudo mv cert.crt /etc/ssl/smartface.crt
# Allow nginx to access the SSL cert
sudo chmod -R 655 /etc/ssl

Step 6: Add DNS Records

Go to your domain manager on varo and add the following records. Replace 0.0.0.0 with the External IP of the VM and 3 1 1 111... with the output from the TLSA command above


Type: A       Name: @       Content: 0.0.0.0
Type: A Name: * Content: 0.0.0.0
Type: TLSA Name: * Content: 3 1 1 1111111111111111111111111111

Step 7: Add Your Website Content

Add your website content to the /var/www/<domain> directory


Method 1. Use github

  1. Create a public repo on github
  2. Add your website files to github
  3. Run the following commands replacing <git repo> with your repo location (eg. https://github.com/Nathanwoodburn/pqlr.git)
# Go to the directory
cd /var/www
# Clone the github repo
git clone <git repo>
# List files in directory
ls

You should see the repo name printed

Now run the below command replacing <repo-name> with the output from the above command. Replace smartface with your domain

mv <repo-name> smartface


This will now server your website content. If you wish to update the content ever just connect to your VM and run

cd /var/www/smartface
sudo git pull


Method 2. Manually adding website content


You can manually add your website content by pasting the HTML into the ssh terminal

First run

#Create a directory for your files
mkdir -p /var/www/smartface
cd /var/www/smartface
# Add an index
nano index.html


Add your HTML content and save. Run nano to create other files like 404.html