作为Next.js的初学者,我遇到了NextAuthJS。我想使用自定义电子邮件和密码身份验证,因此我选择了凭据提供程序,并配置如下
import NextAuth from "next-auth";
import CredentialsProvider from `next-auth/providers/credentials`
import ConnectToDB from "../../../lib/db";
import auth from "../../../lib/auth";
export default NextAuth({
session: {
jwt: true,
maxAge: 30 * 24 * 60 * 60,
},
providers: [
CredentialsProvider({
async authorize(credentials) {
const client = await ConnectToDB();
const db = client.db();
const user = await db.collection("users").findOne({ email: credentials.email });
if (!user) {
client.close();
throw new Error("User not found");
}
const isValid = await auth.verifyPassword(credentials.password, user.password);
if (!isValid) {
client.close();
throw new Error("Invalid password");
}
client.close();
return { _id: user._id };
},
}),
],
});
并使用next-auth/client
中的signIn
方法登录,如下所示
import { signIn } from "next-auth/client";
const submitHandler = async (e) => {
e.preventDefault();
const email = emailRef.current.value;
const password = passwordRef.current.value;
const result = await signIn("credentials", { redirect: false, email, password });
}
我试着调试这个问题,但没有找到解决方案,后来我意识到一些错误正在登录到浏览器控制台
这是我收到的错误
[下一个验证][错误][客户端提取错误]
2条答案
按热度按时间m1m5dgzv1#
我想你已经解决了你的问题,因为它已经有一段时间你问的问题。如果没有,我打算我的答案也为那些谁有同样的问题。
你的代码在我的一个项目中看起来几乎完全一样,但我的工作得很好。
嗯,你需要像官方文档示例https://next-auth.js.org/configuration/providers/credentials那样在
CredentialsProvider({ ... })
中定义credemtials: {}
对象。client_fetch_error
错误。我假设您在生产中会遇到这个问题,我也遇到过这个问题。您需要添加一个环境变量:并重新部署。
您应该在
authorize
中使用return null
或return user
,而不是throw error
yebdmbv42#
在我的例子中,我需要将NEXTAUTH_SECRET变量添加到Vercel中,错误已修复。您可以使用
openssl rand -base64 32
生成它更多信息请点击此处:https://next-auth.js.org/configuration/options#secret