NextAuth.js 与谷歌的身份验证面临 [client_fetch_error] 与 next.js

如何解决NextAuth.js 与谷歌的身份验证面临 [client_fetch_error] 与 next.js

我在 next.js 中使用 next-auth.js 库进行 Google 身份验证。它在本地主机中工作正常，但我在生产环境中遇到了这个问题。我浏览了 next-auth 文档，发现这是环境变量的一个已知问题。

我面临的错误是：[error][client_fetch_error] https://next-auth.js.org/errors#client_fetch_error。因此，我通过添加一个环境变量来更改代码，该变量是文档中提到的 NEXTAUTH_URL = "https://domainname/"。尽管如此，我还是面临着同样的错误，它抛出了一个错误的网关请求 GET https://domaniname/api/auth/session 502 。
另外，我确保clientId、clientSecret具有正确的值和授权的重定向URI：https://domainname/api/auth/callback/google

谁能帮我纠正一下？

解决方法

您遇到此问题是因为您正在尝试向静态网站添加动态 API 路由。

The documentation 对此有很好的解释。

为什么会出现此警告
exportPathMap 路径与 API 路由匹配。通过 next export 静态导出 Next.js 应用程序会禁用 API 路由。

现在，您可能没有直接设置 exportPathMap（尽管您可以在 next.config.js 中设置）。更有可能的是，您在 export 的 build 脚本中使用额外的 package.json 命令构建应用程序 - 这就是触发警告的原因。

Static HTML Export 部分对此有更多解释：

此方法不支持 API 路由，因为它们无法预渲染为 HTML。

... 和 API Routes 部分。

API 路由不能与 next export

一起使用

好的，但我该如何解决这个问题？

解决此问题的方法是使您的应用程序非静态（SSR 或 SSG）。最简单的方法是删除 export 命令，并添加一个 start。

Package.json：

"scripts": {
  "build": "next build","start": "next start"
}

您需要确保 start 命令已运行 - 这可能因您的主机而异。