这些是我的文件，我使用了 nextjs、prisma supabase、服务器操作，我尝试通过观看此视频来验证 b https://www.youtube.com/watch?v=1MTyCvS05V4&t=6741s&ab_channel=CodeWithAntonio。我尝试控制台代码，它显示错误 ikm 哪个加密错误请帮助我解决这个问题或任何其他解决方案服务器
auth.config.ts
import type { NextAuthConfig } from "next-auth"
import { getUserByEmail } from "./data/user";
import { LoginSchema } from "./schemas";
import bcrypt from "bcryptjs";
import Credentials from "next-auth/providers/credentials";
export default {
providers: [
Credentials({
async authorize(credentials) {
const validatedFields = LoginSchema.safeParse(credentials);
if (validatedFields.success) {
const { email, password } = validatedFields.data;
const user = await getUserByEmail(email);
if (!user || !user.password) return null;
const passwordsMatch = await bcrypt.compare(
password,
user.password,
);
if (passwordsMatch) return user;
}
return null;
}
})
],
} satisfies NextAuthConfig
auth.ts
import NextAuth from "next-auth"
import authConfig from "./auth.config";
import { PrismaAdapter } from "@auth/prisma-adapter"
import { db } from "./lib/db";
import { getUserById } from "./data/user";
import { UserRole } from "@prisma/client";
export const {
handlers: { GET, POST },
auth,
signIn,
signOut,
} = NextAuth({
callbacks: {
async session({ token, session }) {
if (token.sub && session.user) {
session.user.id = token.sub;
}
if (token.role && session.user) {
session.user.role = token.role as UserRole;
}
return session
},
async jwt({ token }) {
if (!token.sub) return token;
const existingUser = await getUserById(token.sub);
if (!existingUser) return token;
return token
},
},
adapter: PrismaAdapter(db),
session: { strategy: "jwt"},
...authConfig,
});
登录表格
"use client"
import React, { useState, useTransition } from 'react'
import { CardWrapper } from './card-wrapper'
import * as z from "zod";
import { useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import { LoginSchema } from "@/schemas"
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '../ui/form';
import { Input } from '../ui/input';
import { Button } from '../ui/button';
import { FormError } from '../form-error';
import { FormSuccess } from '../form-success';
import { login } from '@/action/login';
const LoginForm = () => {
const [error, setError] = useState<string | undefined>("")
const [success, setSuccess] = useState<string | undefined>("")
const [isPending, startTransition] = useTransition();
const form = useForm<z.infer<typeof LoginSchema>>({
resolver: zodResolver(LoginSchema),
defaultValues: {
email: "",
password: ""
},
})
const onSubmit = (values: z.infer<typeof LoginSchema>) => {
setError("")
setSuccess("")
startTransition(() => {
login(values)
.then((data) => {
setError(data.error); // "data is possible 'undefined'"
setSuccess(data.success); // "data is possible 'undefined'"
})
})
}
console.log(onSubmit)
return (
<CardWrapper
headerLabel="welcome back"
backButtonLabel="Don't have an account?"
backButtonHref="/auth/register"
showSocial
>
<Form {...form}>
<form
onSubmit={form.handleSubmit(onSubmit)}
className="space-y-6"
>
<div className="space-y-4">
<FormField
control={form.control}
name="email"
render={({ field }) => (
<FormItem>
<FormLabel className="text-lg px-1">Email</FormLabel>
<FormControl>
<Input
{...field}
disabled={isPending}
placeholder="[email protected]"
type="email"
className="text-lg"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="password"
render={({ field }) => (
<FormItem>
<FormLabel className="text-lg px-1">Password</FormLabel>
<FormControl>
<Input
{...field}
disabled={isPending}
placeholder="Pass@123"
type="password"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<FormError message={error} />
<FormSuccess message={success} />
<Button
disabled={isPending}
type="submit"
className="w-full text-xl"
>
Login
</Button>
</form>
</Form>
</CardWrapper>
)
}
export default LoginForm
终端日志
[auth][error] CallbackRouteError: Read more at https://errors.authjs.dev#callbackrouteerror
[auth][cause]: TypeError: "ikm"" must be an instance of Uint8Array or a string
at normalizeUint8Array (webpack-internal:///(action-browser)/./node_modules/@panva/hkdf/dist/node/esm/index.js:21:47)
at normalizeIkm (webpack-internal:///(action-browser)/./node_modules/@panva/hkdf/dist/node/esm/index.js:25:17)
at hkdf (webpack-internal:///(action-browser)/./node_modules/@panva/hkdf/dist/node/esm/index.js:47:98)
at getDerivedEncryptionKey (webpack-internal:///(action-browser)/./node_modules/@auth/core/jwt.js:144:67)
at Object.encode (webpack-internal:///(action-browser)/./node_modules/@auth/core/jwt.js:62:36)
at Module.callback (webpack-internal:///(action-browser)/./node_modules/@auth/core/lib/actions/callback/index.js:300:44)
at async AuthInternal (webpack-internal:///(action-browser)/./node_modules/@auth/core/lib/index.js:67:24)
at async Auth (webpack-internal:///(action-browser)/./node_modules/@auth/core/index.js:126:29)
at async signIn (webpack-internal:///(action-browser)/./node_modules/next-auth/lib/actions.js:57:17)
at async login (webpack-internal:///(action-browser)/./src/action/login.ts:28:9)
at async E:\writeup-main\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:39:406
at async t0 (E:\writeup-main\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:38:5773)
at async rh (E:\writeup-main\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:39:23636)
at async doRender (E:\writeup-main\node_modules\next\dist\server\base-server.js:1391:30)
at async cacheEntry.responseCache.get.routeKind (E:\writeup-main\node_modules\next\dist\server\base-server.js:1552:28)
at async DevServer.renderToResponseWithComponentsImpl (E:\writeup-main\node_modules\next\dist\server\base-server.js:1460:28)
at async DevServer.renderPageComponent (E:\writeup-main\node_modules\next\dist\server\base-server.js:1843:24)
at async DevServer.renderToResponseImpl (E:\writeup-main\node_modules\next\dist\server\base-server.js:1881:32)
at async DevServer.pipeImpl (E:\writeup-main\node_modules\next\dist\server\base-server.js:909:25)
at async NextNodeServer.handleCatchallRenderRequest (E:\writeup-main\node_modules\next\dist\server\next-server.js:266:17)
at async DevServer.handleRequestImpl (E:\writeup-main\node_modules\next\dist\server\base-server.js:805:17)
[auth][details]: {
"provider": "credentials"
}
i console.log in user 我可以获取用户的电子邮件和密码，但它的密码与 bcrypt 匹配我该如何解决这个问题我尝试同时使用 bcrypt 和 bcryptjs 但它在这段代码中的 bcryptjs 中显示此错误以及其他类型的错误在bcrypt
尝试添加 NEXTAUTH_SECRET。
要生成下一个身份验证密钥，请在终端中运行此命令
openssl rand -base64 32
然后将您的秘密添加到 .env 文件中。
NEXTAUTH_SECRET="paste secret here that is generated from the above command"
这解决了您的问题。我希望这有帮助。