前言
上一节《Next.js 实战 | 实现一个 AI 导航网站》简单概述 AI 导航网站是如何实现的，本节简要概述该网站是如何部署并实现 HTTPS 的。
使用 Docker 部署
参考 《在 Next.js 中使用 Docker 部署项目》 这篇文章即可，快速实现在 Ubuntu 系统上安装 Git、Docker、Node 环境和项目部署。
配置 HTTPS
由于本项目的域名和服务器都是在腾讯云购买的，因此就直接在腾讯云免费申请了几个月的 SSL 证书，证书申请通过后，参照相关文档进行 HTTPS 的部署。
由于要实现 HTTPS ，所以本项目使用 Nginx 与 Docker 相结合的方式实现 HTTPS 的部署，当然您也可以根据自己的需求选择其他方式部署。
安装 Nginx
- 更新包索引
sudo apt update
- 安装 Nginx
sudo apt install nginx -y
- 检查 Nginx 是否运行
sudo systemctl status nginx
- 在终端命令行如果显示 active (running) 则表明 Nginx 已经成功启动。
上传证书文件
进行完上述步骤之后，Nginx 的相关文件都会存放在 /etc/nginx 目录中。
因此我们需要将下载在本地的 xtainav.cn_bundle 和 xtainav.cn.key 证书文件上传到 /etc/nginx 目录中。
如果您是在腾讯云购买的服务器，腾讯云的 OrcaTerm 自带 SFTP，可轻松实现文件的管理。
因此，我们只需要找到 /etc/nginx 目录，然后点击上传文件即可。
这样，xtainav.cn_bundle 和 xtainav.cn.key 证书文件就会成功上传至服务器中。
配置 Nginx
在服务器 /etc/nginx/conf.d 文件夹中新建 xtainav.conf 文件，输入如下内容。
快捷方式：
- 在终端命令行输入：
nano /etc/nginx/conf.d/xtainav.conf。- 输入如下内容。
- 依次按下
Ctrl + O、回车键Enter、Ctrl + X。
server {
listen 80;
server_name xtainav.cn www.xtainav.cn;
return 301 https://$host$request_uri;
}
server {
listen 443 ssl;
server_name xtainav.cn www.xtainav.cn;
ssl_certificate /etc/nginx/certs/xtainav.cn_bundle.crt;
ssl_certificate_key /etc/nginx/certs/xtainav.cn.key;
location / {
proxy_pass http://xtai-nav-docker:3000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
}
配置 Docker
在项目根目录新建 docker-compose.yml 文件。
该文件的作用是通过一个声明式的配置文件，简化多容器应用的部署、管理和运行。
因为本项目不仅使用 Docker 部署项目，而且使用到 Nginx 实现代理。
因此需要 docker-compose.yml 文件将它们组织在一起。
version: '3.8' # 可以去掉，否则部署的时候会有警告
services:
xtai-nav-docker:
build:
context: .
dockerfile: Dockerfile
container_name: xtai-nav-docker
restart: unless-stopped
expose:
- '3000' # 仅暴露给 Nginx，不映射到主机
nginx:
image: nginx:alpine
container_name: nginx
ports:
- '80:80'
- '443:443'
volumes:
- /etc/nginx/conf.d/xtainav.conf:/etc/nginx/conf.d/default.conf
- /etc/nginx/xtainav.cn_bundle.crt:/etc/nginx/certs/xtainav.cn_bundle.crt
- /etc/nginx/xtainav.cn.key:/etc/nginx/certs/xtainav.cn.key
depends_on:
- xtai-nav-docker
restart: unless-stopped
运行部署
完成上述步骤之后，在终端命令行输入 docker compose up -d --build，进行构建。
项目在构建过程中，可能会遇到占用 80 端口的错误，这可能是因为服务器中的 Nginx 启动着。
在命令行输入 sudo netstat -tulnp | grep :80 查看哪些进程占用着 80 端口。
如果是 Nginx 占用，输入 sudo systemctl stop nginx 解除本地 Nginx。
这是因为我们使用的是 Docker 容器中的 Nginx（nginx:alpine），而不是主机上的本地 Nginx。
如下图，是构建完成的效果：
测试 HTTPS 效果，如出现下图中的效果，则表示 HTTPS 部署成功。
在浏览器中访问：xtainav.cn
