已完成MERN应用，如何从本地部署至万维网（本地托管非云端）

一、基础准备 #

• 确认本地机器有稳定的宽带网络（优先选带公网IP的光纤）
• 安装和你开发环境匹配的Node.js版本，以及Nginx（用来做反向代理和静态资源托管）
• 可选但推荐安装PM2，用来守护Node后端进程，避免意外崩溃后服务中断

二、后端服务稳定运行配置 #

1. 先在本地验证后端服务正常启动：

   cd 你的后端项目目录
   npm start # 或者你自定义的启动命令，比如node server.js
   

2. 用PM2托管后端，实现进程守护和开机自启：

   pm2 start server.js --name "mern-backend"
   # 保存当前PM2进程配置
   pm2 save
   # 设置开机自动启动PM2
   pm2 startup
   

三、前端静态文件部署 #

有两种常用方式，选一种适合你的：

方式1：后端Express服务托管前端文件 #

• 先打包前端项目：

  cd 你的前端项目目录
  npm run build
  

• 把生成的build文件夹复制到后端项目根目录，然后在Express代码里添加静态文件托管逻辑：

  const express = require('express');
  const path = require('path');
  const app = express();
  
  // 托管前端静态资源
  app.use(express.static(path.join(__dirname, 'build')));
  
  // 处理SPA路由：所有非API请求返回index.html
  app.get('*', (req, res) => {
    res.sendFile(path.join(__dirname, 'build', 'index.html'));
  });
  
  // 你的API路由
  app.use('/api', 你的API路由文件);
  
  app.listen(5000, () => console.log('后端服务运行在5000端口'));
  

方式2：Nginx直接托管前端，反向代理后端API #

• 同样先打包前端得到build文件夹，把它放到Nginx的静态资源目录（比如/var/www/mern-frontend）
• 编辑Nginx配置文件（路径示例：/etc/nginx/sites-available/mern-app）：

  server {
      listen 80;
      server_name 你的公网IP或域名;
  
      # 托管前端静态文件，处理SPA路由
      location / {
          root /var/www/mern-frontend;
          try_files $uri $uri/ /index.html;
      }
  
      # 把/api开头的请求反向代理到本地后端服务
      location /api {
          proxy_pass http://localhost:5000;
          proxy_http_version 1.1;
          proxy_set_header Upgrade $http_upgrade;
          proxy_set_header Connection 'upgrade';
          proxy_set_header Host $host;
          proxy_cache_bypass $http_upgrade;
      }
  }
  

• 启用配置并重启Nginx：

  ln -s /etc/nginx/sites-available/mern-app /etc/nginx/sites-enabled/
  nginx -t # 检查配置语法是否正确
  systemctl restart nginx
  

四、公网访问配置 #

1. 路由器端口转发：

   • 登录路由器管理后台，找到「端口转发」或「虚拟服务器」选项
   • 把公网的80端口转发到本地机器的80端口（用Nginx的情况），如果是直接用后端服务，就转发5000端口
   • 要是想搞HTTPS，还要额外转发443端口

2. 动态DNS（DDNS）：

   • 如果你没有固定公网IP，注册一个DDNS服务，绑定你的公网IP，这样就能用固定域名访问应用
   • 去路由器后台设置DDNS自动更新，避免IP变化后无法访问

3. 防火墙放行端口：

   • 确保本地机器防火墙允许相关端口的入站连接，比如Ubuntu下：

     sudo ufw allow 80/tcp
     sudo ufw allow 443/tcp
     sudo ufw allow 5000/tcp
     sudo ufw enable
     

五、HTTPS配置（可选但强烈推荐） #

• 用Let's Encrypt的免费证书配置HTTPS，用Certbot工具一键搞定：

  sudo apt install certbot python3-certbot-nginx
  sudo certbot --nginx -d 你的域名
  

• Certbot会自动修改Nginx配置，开启HTTPS，还会设置证书自动续签

内容的提问来源于stack exchange，提问作者ThatGuyNick