文章目录

• 背景
• 0. 前置假设
• 1. 更新系统和安装必要软件
• 2. 打包并上传项目到服务器
• • 2.1 识别需要上传的文件
  • 2.2 文件归档和压缩
  • 2.3 压缩文件上传到服务器
  • 2.4 解压文件
• 3. 配置Node.js应用
• • 3.1 启动 PM2
  • 3.2 确认 PM2 进程
• 4. 配置Apache反向代理
• 5. 启用必要的Apache模块
• 6. 检查 Apache 和 Node.js 的监听地址
• • 6.1 Apache 配置检查
  • 6.2 Node.js 监听地址
  • 6.3 使用 netstat 检查端口
• 7. 更新防火墙规则（如果需要）
• 8. 启用站点配置并重启Apache
• 9. 验证部署
• • 9.1 直接通过 IP 地址访问
  • 9.2 debug
  • • 9.2.1 查看日志
    • 9.2.2 测试 Node.js 服务器
    • 9.2.3 IPv4 解析问题
• 10 DNS 设置
• • 10.1 DNS指向设置
  • 10.2 Apache 虚拟主机重定向
  • • 10.2.1 配置文件的修改
    • 10.2.2 启用站点配置并重启 Apache
  • 10.3 验证访问

背景

• 笔者在 Windows 使用 Node 的本地服务器（http://localhost:${PORT}）进行网页开发并测试完成后，想要将其部署到 vps 上。

• 要解决的问题有：

  • vps 上的常规端口，80/443 端口已经被其他网页占用，必须通过非常规窗口访问我们的网站
  • 网站部署中 Apache 的配置，Node 服务器的管理
  • 笔者的二级域名已经设置指向该服务器的常规端口 80/443，如何使用三级域名直接访问新部署的网页而不需要输入端口号

• 补充（域名分级结构）：

1. 根域名（.）：

   • 这是最顶层的域名，通常不显示。

2. 顶级域名（TLD）：

   • 例如 cn.（中国的顶级域名）。它是域名系统中最顶层的部分。

3. 一级域名（一级）：

   • cn. 可以视为顶级域名，同时也是一级域名。

4. 二级域名（如 xxx.cn.）：

   • 这部分通常是由用户注册的域名，例如 example.cn。

5. 三级域名（如 xxx.xxx.cn.）：

   • 进一步细分的域名结构，例如 sub.example.cn。

接下来开始网站的部署！

0. 前置假设

假设：

• 网站要使用端口 11111
• Node.js 服务器使用端口 9000
• 要使用的域名为 xxx.xx.x

1. 更新系统和安装必要软件

确保你的系统是最新的，并安装pm2来管理你的Node.js应用：

sudo apt update sudo apt upgrade -y sudo npm install -g pm2 

2. 打包并上传项目到服务器

2.1 识别需要上传的文件

将项目从本地机器上传到服务器的相应目录，我的项目结构为（使用缩进表示结构层次）：

/frontend     index.html     register.html     script.js     style.css  /backend     package-lock.json     package.json     server.js     user.db     /node_modules 

/node_modules 文件夹是不用上传到服务器的，因为 /node_modules 文件夹是在 Windows 上开发时生成的，要部署到 ubuntu 上最好重新安装这些包。

2.2 文件归档和压缩

• 这里我使用 7z 将这些文件归档为 tar，然后再压缩为 bz2（7z中需要先归档为 tar 才会出现压缩为 bz2 的压缩选项）
• 最终文件后缀名为 .tar.bz2
• 如下：
  

2.3 压缩文件上传到服务器

• 这里我使用 MobaXterm，以 SSH 协议连接到服务器，并使用内置的SFTP 服务进行文件上传
• 上传位置一般为 /var/www/下面的文件夹，可以新建一个和项目名称有关的

2.4 解压文件

使用如下命令解压上传的文件

tar -xvjf filename.tar.bz2 

• 完成后，服务器中项目内容如下

/var/www/xxx/frontend /var/www/xxx/backend 

3. 配置Node.js应用

3.1 启动 PM2

进入你的服务器，导航到你的backend目录并安装依赖项，然后使用pm2启动应用：

cd /var/www/xxx/backend npm install pm2 start server.js --name YourServerName 

• server.js 处填入 Node 代码文件名
• YourServerName 处可以自己为服务起一个别名

3.2 确认 PM2 进程

要确保你的应用正在运行，可查看 PM2 中的进程列表：

pm2 list 

你应该会看到类似如下的输出，显示 YourServerName 正在运行：

┌─────┬─────────────────────┬──────┬─────────┬─────┬────────┬───────────┬──────────┬───────┬──────────┐ │ id  │ name                │ mode │ status  │ cpu │ memory │  uptime   │ restarted│ user  │ watching │ ├─────┼─────────────────────┼──────┼─────────┼─────┼────────┼───────────┼──────────┼───────┼──────────┤ │ 0   │ YourServerName      │ fork │ online  │ 0%  │ 32.0mb │ 0s        │ 0        │ root  │ disabled │ └─────┴─────────────────────┴──────┴─────────┴─────┴────────┴───────────┴──────────┴───────┴──────────┘ 

status 处的 online 就表示服务正在运行。

4. 配置Apache反向代理

编辑或创建一个新的Apache虚拟主机配置文件，例如/etc/apache2/sites-available/YourServerName.conf：

     ServerName 服务名称      DocumentRoot /前端文件所在目录               Options Indexes FollowSymLinks         AllowOverride All         Require all granted           ProxyRequests Off     ProxyPass / http://localhost:node代码中使用的本地服务器端口/     ProxyPassReverse / http://localhost:node代码中使用的本地服务器端口/      ErrorLog ${APACHE_LOG_DIR}/ 服务名称_error.log     CustomLog ${APACHE_LOG_DIR}/ 服务名称_access.log combined  

• 一个具体的配置文件例子：

     ServerName xxx.xx.top      DocumentRoot /var/www/xxx/frontend               Options Indexes FollowSymLinks         AllowOverride All         Require all granted           ProxyRequests Off     ProxyPass / http://localhost:9000/     ProxyPassReverse / http://localhost:9000/      ErrorLog ${APACHE_LOG_DIR}/YourServerName_error.log     CustomLog ${APACHE_LOG_DIR}/YourServerName_access.log combined  

5. 启用必要的Apache模块

sudo a2enmod proxy sudo a2enmod proxy_http sudo a2enmod rewrite 

启用你的站点配置文件并重启 Apache：

sudo a2ensite sharedbill.conf sudo systemctl restart apache2 

6. 检查 Apache 和 Node.js 的监听地址

确保 Apache 和 Node.js 都监听在正确的地址和端口。

6.1 Apache 配置检查

sudo nano /etc/apache2/ports.conf 

确保包含：

Listen 11111 

6.2 Node.js 监听地址

确保 server.js 中监听的是 localhost 和使用的 Node 服务器端口。

6.3 使用 netstat 检查端口

• 假如使用的 Node 服务器端口 为 9000，网页要使用的端口为 11111
• 使用 netstat 或 ss 工具检查端口监听情况：

sudo netstat -tuln | grep :9000 sudo netstat -tuln | grep :11111 

• 应该看到 Node.js 监听在 9000 端口，Apache 监听在 11111 端口。

7. 更新防火墙规则（如果需要）

确保服务器防火墙允许端口11111的流量：

sudo ufw allow 11111/tcp sudo ufw reload 

8. 启用站点配置并重启Apache

启用站点配置并重启Apache服务器：

sudo a2ensite sharedbill.conf sudo systemctl restart apache2 

9. 验证部署

9.1 直接通过 IP 地址访问

尝试直接通过服务器的 IP 地址访问：

http://:11111 

假设可以访问，并且可以正常使用其上的服务，那么则说明网页部署成功了。

9.2 debug

如果不能访问，比如显示 502 错误，则可以依靠以下手段进行 debug：

9.2.1 查看日志

Apache 错误日志：

sudo tail -f /var/log/apache2/YourServerName_error.log  

Node.js 日志（使用 PM2）：

pm2 logs YourServerName 

9.2.2 测试 Node.js 服务器

使用 curl 测试你的 Node.js 服务器是否在本地正常运行：

curl http://localhost:9000 

你应该能够看到来自你的 Node.js 服务器的响应。如果没有响应，则需要检查你的 server.js 文件是否正确启动并监听端口 9000。

9.2.3 IPv4 解析问题

有的服务器上，localhost 可能会被解析为 IPv6，有的应用不支持监听 IPv6 地址，所以可以尝试在代码中显式使用 IPv4 地址来解决这个问题：

app.listen(PORT, '127.0.0.1', () => {     console.log(`Server running on http://localhost:${PORT}`); }); 

下面是配置域名 DNS 指向网站的过程，没有这个需求就不用看了。

10 DNS 设置

10.1 DNS指向设置

• 我选择使用 Cloudflare 的 DNS 服务，并且使用三级域名指向服务器地址

1. 登录到 Cloudflare。
2. 选择你的域名。
3. 进入 DNS 选项卡。
4. 添加 A 记录：
   • Type: A
   • Name: 要使用的三级域名
   • IPv4 Address: 服务器地址
   • TTL: Auto
   • Proxy status: 设置为 DNS only 。

确保你的 A 记录看起来像这样：

10.2 Apache 虚拟主机重定向

10.2.1 配置文件的修改

• 由于我要使用非 80/443 这些常规端口访问网站（比如 11111），所以要在监听 80 端口的虚拟主机上添加重定向规则。
• 在你现有的虚拟主机配置文件中添加特定的重定向规则，如果没有监听 80 端口的虚拟主机，则在刚才的 Apache 虚拟主机配置中添加虚拟主机，确保监听80端口的虚拟主机配置中有如下内容：

     # 启用 Rewrite 引擎     RewriteEngine On      # 仅对 xxx.xx.x 执行重定向     RewriteCond %{HTTP_HOST} ^xxx\.xx\.x$ [NC]     RewriteRule ^(.*)$ http://xxx.xx.x:11111$1 [R=301,L]  

• ^xxx\.xx\.x$ [NC]：填写三级域名地址，\ 用于转义

通过这种方式，你可以确保其他在 80 端口上运行的网站不受影响，同时实现特定域名的重定向。

10.2.2 启用站点配置并重启 Apache

启用你的站点配置文件并重启 Apache：

sudo a2ensite YourServerName.conf sudo systemctl restart apache2 

10.3 验证访问

打开浏览器，访问 http://xxx.xx.x:11111，确保页面加载正常。