部署Next.js网站时MongoDB API报错求助

核心排查步骤 #

• 配置跨域规则
  部署后浏览器可能触发跨域限制，即使同域名下API默认无跨域问题，若部署环境有反向代理或外部请求场景，需在next.config.js中添加跨域头部配置：

  module.exports = {
    async headers() {
      return [
        {
          source: '/api/:path*',
          headers: [
            { key: 'Access-Control-Allow-Origin', value: 'https://tekmucreations.tech' }, // 生产环境指定域名更安全
            { key: 'Access-Control-Allow-Methods', value: 'GET,POST,PUT,DELETE,OPTIONS' },
            { key: 'Access-Control-Allow-Headers', value: 'Content-Type,Authorization' },
          ],
        },
      ];
    },
  };
  

• 校验MongoDB连接配置
  本地和生产环境的MongoDB地址不同，确认route.js中使用的是生产环境的MongoDB URI（比如Atlas远程地址），而非本地数据库地址，避免硬编码本地连接信息。
• 改用相对路径调用API
  前端调用API时直接用相对路径/api/posts，不要写绝对路径，部署后会自动适配当前域名，无需手动修改为https://tekmucreations.tech/api/posts。
• 查看部署平台函数日志
  登录部署平台（如Vercel、Netlify）查看/api/posts的执行日志，定位具体报错原因——是MongoDB连接失败、环境变量未配置，还是路由逻辑出错。
• 同步生产环境变量
  生产环境的MONGODB_URI等关键环境变量，必须在部署平台控制台手动配置，不能依赖本地的.env文件，这是部署后API失效的常见原因。

额外检查项 #

• 若使用Next.js App Router，确保API路由文件路径为app/api/posts/route.js，结构不符合规范会导致路由无法识别。
• 直接在浏览器访问https://tekmucreations.tech/api/posts，验证API本身是否能正常返回响应，排除前端调用的问题。

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