Deploying Hugo to a cloud server with Nginx

1. Install Nginx#

Uninstall the existing Nginx installation

sudo apt-get purge nginx nginx-common # Uninstall nginx, including configuration files.
apt install nginx

Common Nginx commands

nginx -s stop       Quickly stop Nginx, may not save related information, and terminate web service immediately.
nginx -s quit       Gracefully stop Nginx, save related information, and end web service as scheduled.
nginx -s reload     Reload configuration due to changes in Nginx related configurations.
nginx -s reopen     Reopen log files.
nginx -c filename   Specify a configuration file for Nginx to replace the default one.
nginx -t            Test the configuration file without running. Nginx will check the syntax correctness of the configuration file and try to open the files referenced in the configuration file.
nginx -v            Show the version of nginx.
nginx -V            Show the version of nginx, compiler version, and configuration parameters.

If you don't want to type commands every time, you can create a startup batch file named startup.bat in the Nginx installation directory, which can be run by double-clicking. The content is as follows:

@echo off
rem If Nginx is already running and the pid file is recorded, it will kill the specified process
nginx.exe -s stop

rem Test the syntax correctness of the configuration file
nginx.exe -t -c conf/nginx.conf

rem Show version information
nginx.exe -v

rem Start nginx according to the specified configuration
nginx.exe -c conf/nginx.conf

If it is Linux, I guess it is written like this, but I haven't verified it

#!/bin/sh

# If Nginx is already running and the pid file is recorded, it will kill the specified process
nginx -s stop

# Test the syntax correctness of the configuration file
nginx -t -c conf/nginx.conf

# Show version information
nginx -v

# Start nginx according to the specified configuration
nginx -c conf/nginx.conf

2. Upload the `public` folder to the server using rsync#

rsync -avuz --progress --delete public/ root@ip_address:/home/public/

Make sure rsync is also installed on the VPS; it is known that Mac comes with the tool, and on Windows, use the Fz client to sync files

apt install rsync

3. Apply for an SSL certificate#

Get the CertBot client

install certbot

Obtain the certificate

certbot certonly --webroot -w /var/www/example -d example.com -d www.example.com

This command will generate a certificate for example.com and www.example.com. Using the --webroot mode will create a .well-known folder in /var/www/example, which contains some verification files. Certbot will verify your domain by accessing example.com/.well-known/acme-challenge. This command can meet the needs in most cases,

However, sometimes some of our services do not have a root directory, such as some microservices, and in this case, using --webroot will not work. Certbot also has another mode --standalone, which does not require specifying the website root directory; it will automatically enable the server's 443 port to verify domain ownership. If we have other services (such as nginx) occupying port 443, we must stop these services first, and then enable them again after the certificate is generated.

certbot certonly --standalone -d example.com -d www.example.com

After the certificate is generated, we can see the corresponding domain folder in the /etc/letsencrypt/live/ directory, which contains shortcuts pointing to the certificate.

At this point, our first certificate generation is complete, and the next step is to configure our web server to enable HTTPS.

4. Configure the nginx.conf file for nginx#

In the /etc/nginx directory

# The first place to configure, the user here should be changed to root, otherwise there may be no permission
user root;

worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;

include /usr/share/nginx/modules/*.conf;

events {
    worker_connections 1024;
}

http {
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile            on;
    tcp_nopush          on;
    tcp_nodelay         on;
    keepalive_timeout   65;
    types_hash_max_size 2048;

    include             /etc/nginx/mime.types;
    default_type        application/octet-stream;

    include /etc/nginx/conf.d/*.conf;
    
    # Configure http
    server {
        # The second place to configure, port 80 access
        listen       80 default_server; 
        listen       [::]:80 default_server;
        
        # The third place to configure, the domain name
        server_name blog.ryujinx.top;
        rewrite ^(.*) https://$server_name$1 permanent; # Automatically redirect from http to https
        # The fourth place to configure, this points to the public folder
        root /home/public;

        include /etc/nginx/default.d/*.conf;
        
        # The fifth place to configure
        location / {
            root /home/public;
            index  index.html index.htm;
        }
        
        # The sixth place to configure
        error_page 404 /404.html;
        location = /40x.html {
            root   /home/public;
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
    }
    
    # Configure https
     server {
         listen 443 ssl;
         # The seventh place to configure
         server_name blog.ryujinx.top;
         root /home/public;
         
         # The eighth place to configure
         ssl_certificate /etc/letsencrypt/live/blog.ryujinx.top/fullchain.pem;
         ssl_certificate_key /etc/letsencrypt/live/blog.ryujinx.top/privkey.pem;
         
         # The ninth place to configure, you can follow my writing
         ssl_session_timeout 10m;
         ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
         ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
         ssl_prefer_server_ciphers on;
         
         # The tenth place to configure
         error_page 404 /404.html;
         location = /404.html {
              root /home/public;
         }

         include /etc/nginx/default.d/*.conf;
     }

}

Port 80 is used to configure the http service, and port 443 is used to configure the https service, thus completing the nginx configuration.

After modification, reload the configuration file

sudo nginx -s reload

Check the running status of the nginx service

sudo systemctl status nginx

Restart the nginx service

sudo systemctl restart nginx

Subsequent Article Publishing#

Simply sync the public folder using rsync.

Notes#

1. Automatic SSL Certificate Renewal#

SSL has a lifespan of 90 days; use the following command to refresh before expiration

certbot renew --dry-run

If the certificate was generated using the --standalone mode, when verifying the domain, you need to enable the 443 port. This error means that the port to be enabled is already occupied. At this point, I must stop nginx first to succeed. Indeed, when I ran service nginx stop, this command did not report an error, and all certificates were successfully refreshed.

# Create a cron script
touch certbot-auto-renew-cron 
# Add the following content to the file
15 2 * */2 * certbot renew --pre-hook "service nginx stop" --post-hook "service nginx start"

The --pre-hook parameter indicates what to do before executing the update operation. Since I have a certificate in --standalone mode, I need to stop the nginx service to free up the port. The --post-hook parameter indicates what to do after completing the update operation, which is to restore the nginx service.

Finally, we use crontab to start this scheduled task

crontab certbot-auto-renew-cron

Effort-saving Solution: Use npm Visual Interface Configuration#

Docker-Compose Installation of npm#

Create a docker-compose.yml file similar to this:

version: '3.8'
services:
  app:
    image: 'jc21/nginx-proxy-manager:latest'
    restart: unless-stopped
    ports:
      - '80:80'
      - '81:81'
      - '443:443'
    volumes:
      - ./data:/data
      - ./letsencrypt:/etc/letsencrypt

Bring up your stack by running

docker-compose up -d
# If using docker-compose-plugin
docker compose up -d

Configuration#

Fill in the correct IP on the detail page, set the proxy blog port to 80, and enter your already resolved domain name.
Apply for a certificate in the SSL tab.
Fill in the path in advanced
```
 location / {
   root /data/xxxx.github.io;
 }
```
/data/xxxx.github.io is calculated from the root directory where npm is installed, upload the html folder in the corresponding folder.
For specific usage, refer to nginx location [PATTERN]

Reference#

Deploying Hugo on Tencent Cloud Lightweight Server

Let's Encrypt Tutorial, Free SSL Certificates to Embrace HTTPS for Your Website

Nginx Simplified Tutorial