Pleas Help me To solve this problem. http://localhost:3000/api/auth/error?error=AccessDenied in my NextJs application using google signin. Why?

Here is my [...nextauth] file ...

请帮助我解决这个问题。在我的NextJs应用程序中使用谷歌登录的http://localhost:3000/api/auth/error?error=AccessDenied。为什么？这是我的[...下一个]卷宗..。

Here is my Nav component where I want to pass the signin function...

这是我的导航组件，我想在其中传递登录函数...

When I click on it, it returns a 404 response yet I am supposed to see this below:

当我点击它时，它返回一个404响应，但我应该看到下面的内容：

How I Sove It?

我是怎么做到的？

优秀答案推荐

This comment from the gist solved mine:
https://gist.github.com/adrianhajdin/6df61c6cd5ed052dce814a765bff9032?permalink_comment_id=4572572#gistcomment-4572572

这条主旨的评论解决了我的问题：https://gist.github.com/adrianhajdin/6df61c6cd5ed052dce814a765bff9032?permalink_comment_id=4572572#gistcomment-4572572

if you're having trouble signing in because your username has multiple white space
change the

如果您的用户名有多个空格，因此登录时遇到问题，请更改

await User.create({
    email: profile.email,
    username: profile.name.replace(" ", "").toLowerCase(),
    image: profile.picture
})

to

至

await User.create({
    email: profile.email,
    username: profile.name.replace(/\s/g, "").toLowerCase(),
    image: profile.picture
})

I am following the same tutorial by js Mastery, It may be funny but I solve my problem by checking the terminal message was just consoling an undeclared variable. In short, I want to say you that double-check your terminal or your editor's terminal and an error will be showing there it can be different than mine.
At the start of learning Next.js we don't have that much habit to check the terminal but all errors are written there so just check it and it will help you to solve this problem

我正在按照js Master的相同教程，这可能很有趣，但我通过检查终端消息只是安慰一个未声明的变量来解决我的问题。简而言之，我想告诉你，仔细检查你的终端或你的编辑终端，错误将在那里显示它可以与我的不同。在开始学习Next.js时，我们没有太多习惯检查终端，但所有错误都写在那里，所以只需检查它，它将帮助您解决这个问题

The problem will be mention in Your Terminal.

这个问题将在您的终端中被提及。

Check if the coonectToDB function doesn't cause an error

检查coonectToDB函数是否未导致错误

await connectToDB();

if you didn't see the MongoDB connected then the problem is in the function

如果您没有看到MongoDB已连接，则问题出在函数中

Check if the User object doesn't cause any error (if it's defined,...).

检查User对象是否未导致任何错误(如果已定义，则...)。

const userExists = await User.findOne({ 
    email: profile.email, 
});

Check the name of your google account does follow the rules that you have set in the models/user.js file :

检查您的Google帐户名称是否遵循您在Models/user.js文件中设置的规则：

// models/user.js file 
username: {
    type: String,
    required: [true, 'Username is required!'],
    match: [
            /^(?=.{8,20}$)(?![_.])(?!.*[_.]{2})[a-zA-Z0-9._]+(?<![_.])$/,
            "Username invalid, it should contain 8-20 alphanumeric letters and be unique!"
    ] 
}

if it's not then you will find in the console the following error :

如果不是，您将在控制台中发现以下错误：

Error: User validation failed: username: Username invalid, it should contain 8-20 alphanumberic letters
and be unique!

the name should be :

名称应为：

1. contains only :
   
   
   
   • English alphabet A-Za-z (any characters different then that isn't
     
     allowed )
   
   
   • numbers 0-9
   
   
   • underscore _
   
   
   • point .
   
   
   
   


2. number of characters is between 8 to 20


3. all the combination of underscore and point aren't allowed to be inside the name

like :

喜欢：

example_.example

示例_.Example

example_.example

示例_.Example

example__example

示例__示例

example..example

联系我们例如

In this specific case, for this particular tutorial, you should check how your username is configured in your Google account.

在这个特定的案例中，对于这个特定的教程，您应该检查您的用户名在您的Google帐户中是如何配置的。

In https://myaccount.google.com/u/2/profile/name, in the third field, you must choose the first method to display your name to other users (because the "match" method in the user.js does not accept "(", ")", or '"' characters in the regex). Additionally, make sure your name is configured.

在https://myaccount.google.com/u/2/profile/name，的第三个字段中，您必须选择第一种方法向其他用户显示您的姓名(因为user.js中的“Match”方法不接受正则表达式中的“(”、“)”或“字符)。此外，请确保您的姓名已配置。

(For those who haven't followed the tutorial, the user.js file is as follows:)

(For对于那些没有遵循教程的人，user.js文件如下：）

import { Schema, model, models } from "mongoose";

const userSchema = new Schema({
    email: {
        type: String,
        unique: [true, "Email already exists"],
        required: [true, "Email is required"],
    },

    username: {
        type: String,
        unique: [true, "Username already exists"],
        required: [true, "Username is required"],
        match: [/^(?=.{8,20}$)(?![_.])(?!.*[_.]{2})[a-zA-Z0-9._]+(?<![_.])$/, "Username is invalid, it should contain 8-20 alphanumeric characters and be unique!"],
    },

    image: {
        type: String,
    },
});

const User = models.User || model("User", userSchema);

export default User;

That was the issue I encountered (one of my accounts works, but not the others).

这就是我遇到的问题(我的一个账户可以用，但其他账户不行)。

In my case, correction in user.ts helped:

在我的例子中，对user.ts的更正有帮助：

  name: {
    type: String,
    required: [ true, 'Username is required' ],
    match: [
      /^(?=.{8,150}$)(?![_.])(?!.*[_.]{2})[а-яА-Яa-zA-Z0-9._]+(?<![_.])$/,
      'Username invalid, it should contain 8-20 alphanumeric letters and be unique!'
    ]
  },

Thing is that my user's name is in Cyrillic and more than 20 characters. Problem about this regular expression:

问题是，我的用户名是西里尔文和超过20个字符。此正则表达式的问题：

/^(?=.{8,20}$)(?![.])(?!.*[.]{2})[a-zA-Z0-9.]+(?<![.])$/,

replaced by

替换为

/^(?=.{8,150}$)(?![.])(?!.*[.]{2})[а-яА-Яa-zA-Z0-9.]+(?<![.])$/,

Most likely you have the same problem if you get the following error in the terminal:

如果终端中出现以下错误，您很可能也会遇到同样的问题：

User validation failed: name: Username invalid, it should contain
8-20 alphanumeric letters and be unique!

discussions and possible other solutions

讨论和其他可能的解决办法

I hope this will help in your case too :)

我希望这对您的情况也有帮助：)

I had the same problem, and in my case, the answer was as simple as removing the angle brackets "<"and ">" around . I had been trying: my_login_id:<my_password>, when it should have been my_login_id:my_password.

我遇到了同样的问题，在我的例子中，答案很简单，只需去掉前后的尖括号“<”和“>”即可。我一直在尝试：my_login_id： ，而它应该是my_login_id：my_password。

Just remove/comment the match key

只需删除/注释匹配关键字

username: {
    type: String,
    required: [true, 'Username is required']
    // match:[/^(?=.{8,150}$)(?![_.])(?!.*[_.]{2})[а-яА-Яa-zA-Z0-9._]+(?<![_.])$/,
    // 'Username invalid, it should contain 8-20 alphanumeric letters and be unique!']
},
},

I had the same problem. The solution was to remove the angle brackets around the password. I was trying to use my_login_id:<my_password>, but it should have been my_login_id:my_password.

我也有同样的问题。解决方案是删除密码周围的尖括号。我正在尝试使用my_login_id： ，但它应该是my_login_id：my_password。

Hope this helped :)

希望这能有所帮助：)

remove this line in your database.js

在您的数据库.js中删除此行

mongoose('strictQuery', true);

Mongoose(‘strictQuery’，true)；

this should solve this issue!

这应该可以解决这个问题！