在 Next.js 中实现 Git 身份验证时遇到“未找到”错误

Question

即使在 api 文件夹中构建 api 路由（如 next-auth 文档中所述），我也收到 404 错误

文件夹结构：-

• 来源< app < api < auth < [...nextauth].js
• 来源< app < api < auth < [...nextauth]< route.js

我尝试了两种定义路由的方法 1. [...nextauth]/route.js 和另一种 [...nextauth].js 我在两者中都遇到错误

//route.js || [...nextauth].js
import NextAuth from "next-auth/next";
import GithubProvider from "next-auth/providers/github";

const handler = NextAuth({
  providers: [
    GithubProvider({
      clientId: process.env.GITHUB_CLIENT_ID,
      clientSecret: process.env.GITHUB_CLIENT_SECRET,
    }),
  ],
});

export { handler as GET, handler as POST };

我在主页上遇到的错误

GET http://localhost:3000/api/auth/session 404 (Not Found)
GET http://localhost:3000/api/auth/session 404 (Not Found)&&

{
"error": {
    "message": "Unexpected token '<', \"<!DOCTYPE \"... is not valid JSON",
    "stack": "SyntaxError: Unexpected token '<', \"<!DOCTYPE \"... is not valid JSON",
    "name": "SyntaxError"
},
"url": "/api/auth/session",
"message": "Unexpected token '<', \"<!DOCTYPE \"... is not valid JSON",
"client": true

}

Answer 1

您在尝试访问 Next.js 项目中的 API 路由时似乎遇到了 404 错误。这个问题调试起来可能有点棘手，但让我们尝试逐步解决它。

文件夹结构： 确保您的 API 路由正确放置在 Next.js 项目的 api 文件夹中。根据您提供的结构，它看起来不错：

src/ └── 应用程序/ └── API/ └── 授权/ ├── [...nextauth].js └── 路线.js

路由配置： 检查您的 API 路由的配置。 Next.js 根据文件名自动映射 API 路由。您的 [...nextauth].js 文件确实应该捕获对 /api/auth/* 的所有请求。

导出处理程序： 除非您正在处理不同的 HTTP 方法，否则无需将处理程序导出为 GET 和 POST。通过仅导出处理函数来简化它：

javascript:

导出默认处理程序； 环境变量： 验证您的环境变量（process.env.GITHUB_CLIENT_ID 和 process.env.GITHUB_CLIENT_SECRET）是否已正确设置。仔细检查这些变量是否已在您的 Next.js 项目中定义并可访问。

语法错误： 扫描您的代码是否有任何语法错误。即使是很小的拼写错误也可能导致服务器失败。确保不存在可能阻止您的 API 路由正确注册的错误。

确保这些方面正确后，尝试重新启动 Next.js 服务器并查看问题是否仍然存在。如果是这样，请尝试直接在浏览器中或通过 Postman 等工具访问路线，以获取更多描述性错误消息。这可能有助于进一步查明问题。

如果您仍然遇到问题，请随时提供其他详细信息或代码片段以获得进一步帮助。

最诚挚的问候， 赛义夫伊斯兰教