csrf 相关问题

我有一个最小的设置，如“next-auth”文档中所解释的：“^5.0.0-beta.18”。当从主页http://localhost:3000/调用signIn()时， ./app/page.tsx 我有一个最小的设置，如 "next-auth": "^5.0.0-beta.18" 的 docs 中所述。从主页 signIn() 调用 http://localhost:3000/ 时， ./app/page.tsx <form action={async () => { "use server"; await signIn(); }} > <button type="submit">Sign in</button> </form> 它将我重定向到 http://localhost:3000/api/auth/signin?callbackUrl=http%3A%2F%2Flocalhost%3A3000%2F 并正确呈现我的 login页面 ./app/login/page.tsx <form action={async (formData) => { "use server"; await signIn("credentials", formData); }} > <label> Email <input name="email" type="email" /> </label> <label> Password <input name="password" type="password" /> </label> <button>Sign In</button> </form> 但是单击按钮时出现以下错误： ✓ Compiled /api/auth/[...nextauth] in 86ms (489 modules) ✓ Compiled /login in 196ms (732 modules) POST / 303 in 3328ms [auth][error] MissingCSRF: CSRF token was missing during an action signin. Read more at https://errors.authjs.dev#missingcsrf at validateCSRF (webpack-internal:///(rsc)/./node_modules/@auth/core/lib/actions/callback/oauth/csrf-token.js:45:11) at AuthInternal (webpack-internal:///(rsc)/./node_modules/@auth/core/lib/index.js:71:100) at async Auth (webpack-internal:///(rsc)/./node_modules/@auth/core/index.js:126:34) at async /Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:53446 at async e_.execute (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:44747) at async e_.handle (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:54700) at async doRender (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/base-server.js:1377:42) at async cacheEntry.responseCache.get.routeKind (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/base-server.js:1587:40) at async DevServer.renderToResponseWithComponentsImpl (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/base-server.js:1507:28) at async DevServer.renderPageComponent (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/base-server.js:1924:24) at async DevServer.renderToResponseImpl (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/base-server.js:1962:32) at async DevServer.pipeImpl (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/base-server.js:920:25) at async NextNodeServer.handleCatchallRenderRequest (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/next-server.js:272:17) at async DevServer.handleRequestImpl (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/base-server.js:816:17) at async /Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/dev/next-dev-server.js:339:20 at async Span.traceAsyncFn (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/trace/trace.js:154:20) at async DevServer.handleRequest (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/dev/next-dev-server.js:336:24) at async invokeRender (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/lib/router-server.js:174:21) at async handleRequest (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/lib/router-server.js:353:24) at async requestHandlerImpl (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/lib/router-server.js:377:13) at async Server.requestListener (/Users/nickelpaulsen/programmieren/nextjs/auth-last-try/node_modules/next/dist/server/lib/start-server.js:141:13) POST /api/auth/signin?callbackUrl=http%3A%2F%2Flocalhost%3A3000%2F 302 in 10ms GET /login?error=MissingCSRF 200 in 108ms 直接加载登录页面时http://localhost:3000/login我一切似乎都按预期工作。我已经检查了我能找到的与此错误有关的所有内容，但补救措施并没有修复我的错误。我已将示例上传到 Github：https://github.com/Nighel123/next-auth-error-MissingCSRF。我的auth.ts看起来像这样： ./auth.ts import NextAuth from "next-auth"; import Credentials from "next-auth/providers/credentials"; // Your own logic for dealing with plaintext password strings; be careful! //import { saltAndHashPassword } from "@/utils/password"; export const { handlers, signIn, signOut, auth } = NextAuth({ pages: { signIn: "/login", }, providers: [ Credentials({ // You can specify which fields should be submitted, by adding keys to the `credentials` object. // e.g. domain, username, password, 2FA token, etc. credentials: { email: {}, password: {}, }, authorize: async (credentials) => { let user = { username: "lolli", email: "brolli" }; // logic to salt and hash password //const pwHash = saltAndHashPassword(credentials.password); // logic to verify if user exists //user = await getUserFromDb(credentials.email, pwHash); if (!user) { // No user found, so this is their first attempt to login // meaning this is also the place you could do registration throw new Error("User not found."); } // return user object with the their profile data return user; }, }), ], }); 我实现此工作的方式是在您的服务器组件内部，即 login/page.tsx 使用以下代码从 cookie 中获取 csrf 令牌 import { cookies } from "next/headers"; const csrfToken = cookies().get("authjs.csrf-token")?.value ?? ""; 使用此令牌并将其设置为表单的一部分 <input type="hidden" name="csrfToken" value={csrfToken} /> 现在，每次调用表单操作时，令牌都会随请求一起发送。 Auth.JS 内部很高兴，可以验证令牌。在此处查看默认登录页面的源代码 - 链接我可以看到他们做了类似的事情。

csrf credentials next-auth

回答 1 投票 0

Oauth2.0 授权码授予类型 State param 的用例是什么

我想知道从资源所有者那里获取授权代码所传递的状态的用例，消息来源说它用于防止 CSRF 攻击谁能解释一下如何传递随机字符串...

oauth-2.0 csrf

回答 1 投票 0

csrf 相关问题

最新问题