Next.js动态页面部署Ubuntu服务器后出现404错误求助

核心问题分析 #

本地运行正常但服务器404，大概率是构建阶段未生成对应静态路径、服务器部署配置不支持增量静态再生（ISR），或API访问异常导致的。结合你的代码和场景，按以下步骤排查：

1. 检查domain变量的服务器配置 #

本地开发时domain可能指向localhost或本地API，但服务器上必须使用可访问的API地址（如服务器内网IP、公网域名），确保build阶段能正常请求CMS接口。

• 执行npm run build时，查看控制台日志，确认是否成功获取到api/vb1/page-menu/的数据。如果日志里有fetch报错，说明build阶段没拿到路径，自然不会生成对应静态页面。

2. 修正build阶段的API请求错误处理 #

你的getStaticPaths没有错误捕获，一旦API请求失败，会直接抛出错误导致paths为空，所有动态路由都404。给代码加错误处理：

export async function getStaticPaths() {
  try {
    const res = await fetch(domain + "api/vb1/page-menu/")
    // 校验HTTP响应状态
    if (!res.ok) throw new Error(`API请求失败：${res.status}`)
    
    const data = await res.json();
    const content = data["data"]
    if (!content || content.length === 0) {
      return { paths: [], fallback: true };
    }

    const paths = content.map(pageName => ({
      params: { pageId: pageName.id.toString() }
    }))
    return { paths, fallback: true };
  } catch (err) {
    console.error("获取路由路径失败：", err)
    return { paths: [], fallback: true };
  }
}

3. 确认服务器部署方式是否支持ISR #

你的代码用了revalidate和fallback: true，这依赖Next.js的**增量静态再生（ISR）**功能，只有用next start运行服务器才支持，静态导出（next export）不支持ISR：

• 如果是用next export部署静态文件：
  • fallback只能设为false，且所有路由必须在build阶段全部生成，CMS新增内容后必须重新build并上传静态文件。
• 如果是用next start运行：
  • 确保服务器有文件写入权限，Next.js需要生成缓存文件来存储动态生成的页面。
  • 检查服务器防火墙/安全组，允许Next.js服务端口（默认3000）的访问。

4. 检查Nginx反向代理配置（如果使用） #

如果用Nginx做反向代理，必须配置正确的路由转发，避免动态路由被当成静态文件返回404。示例配置：

server {
  listen 80;
  server_name your-domain.com;

  location / {
    proxy_pass http://localhost:3000;
    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：sudo systemctl restart nginx

5. 解决CMS更新后新路由404的问题 #

如果希望CMS发布新内容后无需手动build即可访问：

• 保持fallback: true和revalidate: 10，Next.js会在首次访问新路由时动态生成静态页面并缓存，后续访问直接返回缓存文件。
• 进阶方案：使用On-Demand ISR，在CMS发布内容时调用Next.js的API触发页面重新生成，无需等待revalidate时间。

6. 其他排查点 #

• 检查Next.js版本：升级到最新稳定版（如13.x Pages Router），旧版本可能存在ISR相关bug。
• 查看服务器日志：运行next start后，查看控制台输出的错误信息，定位具体请求失败的原因。

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