docker部署nginx并配置https

type

status

date

slug

summary

📝 项目准备&部署

环境：

ubuntu22.4系统

已安装docker,配置虚拟网络iwhth

有一个域名

Step 1– 【申请SSL证书】

这里我是用免费的ssl证书 Let's Encrypt


# 安装Certbot工具,用于自动化申请Let's Encrypt证书
sudo apt install certbot

# 执行前先检查443端口是否被占用
sudo lsof -i :443

# --standalone模式申请
# 这种模式不需要指定网站根目录，他会自动启用服务器的443端口，来验证域名的归属。
certbot certonly --standalone -d example.com

证书生成完毕后，我们可以在/etc/letsencrypt/live/目录下看到对应域名的文件夹，fullchain.pem为证书,privkey.pem为私钥

Step 2– 【nginx文件配置】

nginx我部署在root/nginx目录下,在该目录下创建html文件夹,用于存放静态页面

在nginx目录下创建一个nginx.conf文件并编辑

不需要ssl的情况示例:



#user  nobody;
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;

    keepalive_timeout  65;
	
	map $http_upgrade $connection_upgrade{
		default upgrade;
		'' close;
	}

	upstream webservers{
	  server sky-take-out:8080 weight=90 ;
	  #server 10.20.95.7:8080 weight=90 ;
	}

    server {
        listen       80;
        server_name  localhost;

        location / {
            root   /usr/share/nginx/html/dist;
            index  index.html index.htm;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # 反向代理,处理管理端发送的请求
        location /api/ {
			       #proxy_pass   http://sky-take-out:8080/admin/;
            proxy_pass   http://webservers/admin/;
        }
		
		    # 反向代理,处理用户端发送的请求
        location /user/ {
            proxy_pass   http://webservers/user/;
        }
		
				# WebSocket
				location /ws/ {
		       proxy_pass   http://webservers/ws/;
						proxy_http_version 1.1;
						proxy_read_timeout 3600s;
						proxy_set_header Upgrade $http_upgrade;
						proxy_set_header Connection "$connection_upgrade";
        }
    }

}

需要ssl情况示例:



#user  nobody;
worker_processes  1;

events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;

    keepalive_timeout  65;
	
	map $http_upgrade $connection_upgrade{
		default upgrade;
		'' close;
	}

	upstream webservers{
	  server sky-take-out:8080 weight=90 ;
	}

    server {
        listen       80;
        listen       443 ssl;# 侦听443端口，用于SSL
        server_name  example.com;
        
        # 注意文件位置，是从/etc/nginx/下开始算起的
        ssl_certificate /etc/nginx/cert/fullchain.pem;
        ssl_certificate_key /etc/nginx/cert/privkey.pem;
        ssl_session_timeout 5m;
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
        ssl_prefer_server_ciphers on;

        client_max_body_size 1024m;

        location / {
            root   /usr/share/nginx/html/sky-https;
            index  index.html index.htm;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # 反向代理,处理管理端发送的请求
        location /api/ {
						#proxy_pass   http://sky-take-out:8080/admin/;
            
            proxy_set_header HOST $host;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            
            proxy_pass   http://webservers/admin/;
        }
		
		# 反向代理,处理用户端发送的请求
        location /user/ {

            proxy_set_header HOST $host;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            
            proxy_pass   http://webservers/user/;
        }
		
		# WebSocket
		location /ws/ {

            proxy_set_header HOST $host;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            
            proxy_pass   http://webservers/ws/;
            proxy_http_version 1.1;
            proxy_read_timeout 3600s;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "$connection_upgrade";
        }
}

Step 3– 【启动nginx】

80端口是http,443端口是https

我使用的vps443端口有其他程序在使用,所以改为444端口外部访问,正常情况下访问https默认设置443端口即可

把example.com改为自己申请证书的域名

这里我提前配置了虚拟网络iwhth，不需要的可删除


docker run -d \
--name nginx \
-p 80:80 \
-p 444:443 \
-v /root/nginx/html:/usr/share/nginx/html \
-v /root/nginx/nginx.conf:/etc/nginx/nginx.conf \
-v /etc/letsencrypt/live/example.com/fullchain.pem:/etc/nginx/cert/fullchain.pem \
-v /etc/letsencrypt/live/example.com/privkey.pem:/etc/nginx/cert/privkey.pem \
--network iwhth \
nginx

Step 4– 【踩雷&避坑】

由于我这个项目后端需访问websocket,但是套了https后访问不到websocket,一番折腾后发现需修改前端代码。原本使用http访问时websocket使用的是ws协议,使用https后,websocket必须要使用wss协议。

使用http连接时websocket访问的url:

改为https连接后需要改为wss协议,并重新修改url:

访问端口要与nginx部署的端口一致,这里我用444端口。默认443端口的话改为域名即可

后面的路径要与nginx.conf中配置的路径一致,例如这里用/ws/,nginx里也要配置对应的路径。

这是上面已经配置过的代码:


# WebSocket
		location /ws/ {

            proxy_set_header HOST $host;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            
            proxy_pass   http://webservers/ws/;
            proxy_http_version 1.1;
            proxy_read_timeout 3600s;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "$connection_upgrade";
        }