NextAuth TypeError [ERR_INVALID_URL]: Invalid URL

每当我试图使用nextAuth.js呈现我的登录页面时，都会发生此错误

sign .js

import { getProviders, signIn as SignIntoProvider} from 'next-auth/react'
// Browser... 
function signIn({providers}) {
  return (
    <>
      {Object.values(providers).map((provider) => (
        <div key={provider.name}>
          <button onClick={() => SignIntoProvider(provider.id)}>
            Sign in with {provider.name}
          </button>
        </div>
      ))}
    </>
  );
}
// Server side render
export async function getServerSideProps(){
    const providers = await getProviders();
    return{
        props: {
            providers,
        },
    };
}
export default signIn;

[…nextauth] . js

import NextAuth from "next-auth"
import GoogleProvider from "next-auth/providers/google"
export default NextAuth({
  // Configure one or more authentication providers
  providers: [
    GoogleProvider({
      clientId: process.env.GOOGLE_CLIENT_ID,
      clientSecret: process.env.GOOGLE_CLIENT_SECRET,
    }),
    // ...add more providers here
  ],
  pages: {
    signIn: '/auth/signin',
  }
})

我已经将nextAuth url声明为

"NEXTAUTH_URL = http://localhost: 3000">

我也面临同样的问题。这似乎是"next-auth"; "^4.3.2"的问题。

我降级到4.3.1版本，错误消失了。如果你只执行npm install，它就会安装最新版本的next-auth

在我将本地主机添加到google的控制台凭据页面上允许的主机之前，我一直有这个问题。请注意，它不允许使用子域(我试过"http://subdomain.localhost:3000"-不允许)。有一次我搬到"http://localhost:3000"(并将NEXTAUTH_URL设置为该值)-错误消失

我建议检查NEXTAUTH_URL是否有效，或者其他环境变量。

还要注意

a 不存在环境变量可以是ok,但
和空字符串可能被认为是无效的

像这样在你的.env文件是无效:

NEXTAUTH_URL=

还尝试删除临时/.next文件夹并重新启动服务器。(确保在删除/.next文件夹时下一个服务器不运行，否则它可能在服务器仍在运行时再次创建)

你还应该检查完整的堆栈跟踪(你的截图遗漏了最重要的部分)。

详细信息错误[ERR_INVALID_URL]: Invalid URL可能来自node.js，当它试图在next-auth, parse-url中执行new URL( url )时。

您可以确认如果您只是import 'next-auth/react'(没有任何特定的属性或方法)，如果错误已经出现。这应该已经抛出了，因为next-auth/react内部使用process.env变量。

如果我是对的，一个"无效值"是传递给new URL(URL)时会抛出的值，例如一个空字符串。但null或undefined也应该回到parseUrl内的有效默认url。

我发现parseUrl失败的其他情况包括无效的环境变量VERCEL_URL和NEXTAUTH_URL_INTERNAL，以及Request对象中的origin, pathname或url。

我通过清除浏览器的会话和cookie修复，

当我在[…next-auth]中更改某些内容时，尝试创建错误页面时会发生问题。ts，我不能再登录了，它总是重定向我到认证/错误页面，当它试图获得/auth/会话并显示错误TypeError [ERR_INVALID_URL]: Invalid URL时，它响应我500。

即使我重置了我的代码，它仍然以相同的结果响应，尽管我以前从未遇到过这个错误。

相关内容

最新更新

热门标签：