通过PM2与Apache ProxyPass部署Nuxt后路由无法访问的解决咨询

核心问题原因 #

你的Nuxt应用不知道自己运行在/ssrapp子路径下，导致生成的路由、静态资源路径都是根路径（/），而Apache的代理配置没有配合Nuxt的路径规则，最终引发路由不存在的错误。

解决步骤 #

1. 修改Nuxt配置，指定子路径基础路径

根据你使用的Nuxt版本，修改项目根目录的配置文件：

Nuxt 2（nuxt.config.js）

export default {
  router: {
    // 指定应用的基础路径为/ssrapp
    base: '/ssrapp/'
  },
  build: {
    // 静态资源的公共路径同步设置
    publicPath: '/ssrapp/'
  }
}

Nuxt 3（nuxt.config.ts）

export default defineNuxtConfig({
  app: {
    baseURL: '/ssrapp/'
  },
  nitro: {
    publicAssets: {
      baseURL: '/ssrapp/'
    }
  }
})

修改后重启Nuxt服务：

pm2 restart <你的应用名称>

2. 调整Apache反向代理配置

编辑你的Apache虚拟主机配置文件（通常位于/etc/apache2/sites-available/你的站点.conf），替换原有ProxyPass相关配置：

<VirtualHost *:80>
  ServerName www.someurl.com

  # 启用必要模块（未启用则先执行：sudo a2enmod proxy proxy_http rewrite headers）
  LoadModule proxy_module modules/mod_proxy.so
  LoadModule proxy_http_module modules/mod_proxy_http.so
  LoadModule rewrite_module modules/mod_rewrite.so
  LoadModule headers_module modules/mod_headers.so

  # 代理/ssrapp下所有请求到Nuxt服务
  ProxyPass /ssrapp http://localhost:3000/ssrapp
  ProxyPassReverse /ssrapp http://localhost:3000/ssrapp

  # 设置反向代理头部，让Nuxt识别真实请求信息
  RequestHeader set X-Forwarded-Proto "http"
  RequestHeader set X-Forwarded-Host "www.someurl.com"
  RequestHeader set X-Forwarded-Prefix "/ssrapp"
</VirtualHost>

重启Apache生效：

sudo systemctl restart apache2

关键配置说明 #

• router.base/app.baseURL：告诉Nuxt生成所有路由、资源路径时自动带上/ssrapp前缀，避免浏览器直接请求根路径资源。
• ProxyPass/ProxyPassReverse：确保Apache将/ssrapp开头的请求正确转发到Nuxt服务，同时修正Nuxt响应中的重定向路径，避免跳转到错误地址。
• X-Forwarded-*头部：让Nuxt获取真实的请求协议、主机和子路径前缀，防止生成URL时出现错误。

排查补充 #

如果问题仍存在，查看以下日志定位细节：

• Apache错误日志：/var/log/apache2/error.log
• Nuxt应用日志：pm2 logs <你的应用名称>

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