js错误:[next-auth][error][CLIENT_FETCH_ERROR]意外的标记'< '“< !DOCTYPE“不是有效的JSON”

70gysomp  于 2023-10-18  发布在  其他
关注(0)|答案(2)|浏览(135)

下面是我得到的错误
[next-auth][error][CLIENT_FETCH_ERROR] https://next-auth.js.org/errors#client_fetch_error意外标记“<$”,“<!DOCTYPE“不是有效的JSON {error:{...},url:'/API/auth/session',message:Unexpected token '<', "<!DOCTYPE "... is not valid JSON
我已经检查了我的配置,它似乎是正确的,想知道为什么我会遇到这个问题。
下面是我的设置:

Google客户端ID和密码:我已经在环境变量中设置了Google客户端ID和secret。NextAuth配置:我正在使用NextAuth的GoogleProvider,并使用正确的clientId和clientSecret。SessionProvider:我有一个SessionProvider Package 我的组件来提供会话数据。

尽管仔细检查了所有内容,但此错误仍然存在。

NextAuth配置如下:
API/auth/[...nextauth].js

import NextAuth from "next-auth";
import GoogleProvider from "next-auth/providers/google";

const handler = NextAuth({
  providers: [
    GoogleProvider({
      clientId: process.env.GOOGLE_CLIENT_ID,
      clientSecret: process.env.GOOGLE_CLIENT_SECRET,
    }),
  ],
});

export { handler as GET, handler as POST };

// AuthProvider.js

import { SessionProvider } from "next-auth/react";

const AuthProvider = ({ children }) => {
  return <SessionProvider>{children}</SessionProvider>;
};

export default AuthProvider;

**// RootLayout.js**
import { Inter } from "next/font/google";
import { ThemeProvider } from "../context/ThemeContext";
import AuthProvider from "../app/components/AuthProvider/AuthProvider";

const inter = Inter({ subsets: ["latin"] });

export const metadata: Metadata = {
  title: "Testing",
  description: "This is the description",
};

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <body className={inter.className}>
        <ThemeProvider>
          <AuthProvider>
            <div className="container">
              {children}
            </div>
          </AuthProvider>
        </ThemeProvider>
      </body>
    </html>
  );
}

我尝试在我的Next.js应用程序中使用Google提供商的NextAuth实现身份验证。我配置了Google Client ID和Secret,使用GoogleProvider设置了NextAuth配置,并将我的组件 Package 在SessionProvider中进行会话管理。your text

apeeds0o

apeeds0o1#

我也有这些错误,我能够用几件事来修复它们首先,关于这个错误:意外标记'|',“<!DOCTYPE“不是有效的JSO
不幸的是,我把Auth文件夹放在了API之外,然后把它改为:

api/auth/[...nextauth]/route.ts

然后我将以下值添加到.env或.env.local中:

NEXTAUTH_URL=http://localhost:3000

NEXTAUTH_SECRET=mytestApp


这件事已经解决了

kqhtkvqz

kqhtkvqz2#

将代码放在//API/auth/[... nextauth]/route.ts中

import NextAuth from "next-auth"
import GoogleProvider from "next-auth/providers/google";

const handler = NextAuth({
    providers: [
        // GithubProvider({
        //     clientId: process.env.GITHUB_ID,
        //     clientSecret: process.env.GITHUB_SECRET,
        // }),
        GoogleProvider({
            clientId: process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID,
            clientSecret: process.env.NEXT_PUBLIC_GOOGLE_CLIENT_SECRET
        })
    ],
})

export { handler as GET, handler as POST }

希望它能在nextjs V13.5+上工作

相关问题