本地主机上的 Next-auth Google 身份验证问题：3001 -“访问被阻止”错误

Question

我在本地主机开发设置上遇到 Next-auth Google 身份验证问题。我的电子商务网站的管理端 (localhost:3000) 和客户端 (localhost:3001) 有单独的实例。

当我尝试在客户端（localhost：3001）进行Google身份验证时，会特别出现该问题。我收到一条错误消息，指出“访问被阻止。”

回调网址： 管理端：

http://localhost:3000/api/auth/callback/google

客户端：

 http://localhost:3001/api/auth/callback/google

下一个身份验证配置： 管理端本地主机：3000：

// Admin Side Configuration
import NextAuth from 'next-auth'
import GoogleProvider from 'next-auth/providers/google'

export default NextAuth({
  providers: [
    GoogleProvider({
      clientId: process.env.GOOGLE_ID,
      clientSecret: process.env.GOOGLE_SECRET
    }),
  ],
  // Other configurations...
})

客户端（本地主机：3001）

// Client Side Configuration
import NextAuth from 'next-auth'
import GoogleProvider from 'next-auth/providers/google'

export default NextAuth({
  providers: [
    GoogleProvider({
      clientId: process.env.GOOGLE_ID,
      clientSecret: process.env.GOOGLE_SECRET
    }),
  ],
  // Other configurations...
})

我已验证这两个环境的 GOOGLE_ID 和 GOOGLE_SECRET 环境变量均已正确设置。 Google 开发者控制台为 localhost:3000 和 localhost:3001 配置了正确的回调 URL。 在此输入图片描述

Answer 1

授权服务器使用重定向 uri 来标识允许将授权代码返回到的位置。

它们是在您的 Web 应用程序凭据下的 Google Cloud Console 项目中配置的。

如果您单击所显示图像中的“错误详细信息”链接，它将准确告诉您应用程序发送的重定向 uri 以及您需要在应用程序的控制台配置中添加的内容。

• Google OAuth2：如何修复redirect_uri_mismatch错误。第 2 部分服务器端 Web 应用程序。

• Google Oauth：错误redirect_uri_与 javascript 来源不匹配快速修复。