在Ubuntu 20.04.2+Apache 2.4.53的VPS部署Nuxt SSR遇问题求助

1. 修复npm run dev的域名解析错误 #

dev脚本中指定--hostname my.domain.com，但服务器本地DNS无法解析该域名，导致getaddrinfo ENOTFOUND错误。修改package.json的dev命令：

"dev": "nuxt --port 3020"

也可直接去掉hostname参数，因为package.json的config字段已设置host: 0.0.0.0，Nuxt会自动沿用该配置。

2. 解决npm run start启动后访问无内容的问题 #

2.1 执行完整构建流程 #

SSR应用启动前必须先完成构建，否则缺少服务端渲染所需文件：

npm run build
npm run start

2.2 检查端口与防火墙 #

• 验证3020端口是否被Nuxt进程占用：

  netstat -tulpn | grep :3020
  

• 开放3020端口（Ubuntu环境用ufw）：

  sudo ufw allow 3020
  

• 本地测试服务状态：在服务器执行curl http://localhost:3020，若返回HTML内容说明服务正常；若无返回，查看运行日志排查：

  pm2 logs cup  # pm2启动的情况
  # 或直接执行npm run start查看终端输出
  

2.3 确认Nuxt核心配置 #

确保nuxt.config.js中SSR模式开启（默认开启，若被修改需恢复）：

export default {
  ssr: true,
  server: {
    host: '0.0.0.0', // 允许外部访问
    port: 3020
  }
}

3. 配置Apache反向代理隐藏端口 #

利用Apache将域名请求转发到Nuxt的3020端口，实现无端口访问：

3.1 启用Apache代理模块 #

sudo a2enmod proxy proxy_http

3.2 创建虚拟主机配置文件 #

新建/etc/apache2/sites-available/my.domain.com.conf，内容如下：

<VirtualHost *:80>
    ServerName my.domain.com

    ProxyPreserveHost On
    ProxyPass / http://localhost:3020/
    ProxyPassReverse / http://localhost:3020/

    ErrorLog ${APACHE_LOG_DIR}/my.domain.com-error.log
    CustomLog ${APACHE_LOG_DIR}/my.domain.com-access.log combined
</VirtualHost>

若需HTTPS访问，需配置SSL证书（如Let's Encrypt），将<VirtualHost *:80>改为<VirtualHost *:443>，并添加SSLCertificateFile和SSLCertificateKeyFile配置。

3.3 启用站点并重启Apache #

sudo a2ensite my.domain.com.conf
sudo systemctl restart apache2

4. 优化pm2部署配置 #

修改ecosystem.config.js的post-deploy脚本，加入构建步骤：

module.exports = {
  apps: [{
    name: 'cup',  
    exec_mode: 'fork',  
    instances: '1',  
    script: './node_modules/nuxt/bin/nuxt.js',  
    args: "start"
  }],

  deploy: {
    production: {
      user: 'SSH_USERNAME',
      host: 'SSH_HOSTMACHINE',
      ref: 'origin/master',
      repo: 'GIT_REPOSITORY',
      path: 'DESTINATION_PATH',
      'pre-deploy-local': '',
      'post-deploy': 'npm install && npm run build && pm2 reload ecosystem.config.js --env production',
      'pre-setup': ''
    }
  }
};

部署后用pm2 status确认进程状态，pm2 logs cup查看运行日志排查潜在问题。

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