5

我有一个退出的 Django 项目，我正试图从模板转移到 NextJs 前端。我遇到了 Next-Auth-js，它在 Next Auth 中似乎很不错。

但是，该文档似乎更关注与 JS 相关的后端身份验证。按照此示例，我已将 NEXTAUTH_URL 环境变量发送到我的 DRF 端点 localhost:8002。虽然前端在 localhost:3000 上运行。虽然我的 _app.js 看起来像这样：

<Provider options={{site: process.env.NEXTAUTH_URL,}} session={pageProps.session}  >
  <Component {...pageProps} />
</Provider>

使用Nav.js进行测试，我更改了登录/输出 href 以指向我的 Django 端点，但似乎 next-auth-js 忽略了这一点，并将会话提取放置到我的前端http://localhost:3000/api/auth/session而不是http://localhost:8002/api/auth/session.

我将不胜感激有关如何使用 Django Rest Framework (DRF) 正确/安全地实现此身份验证的任何帮助

4

2 回答 2

4

我认为这就是它应该工作的方式，您的 nextjs 站点将是您的 django API 的一种代理/中间件client -> nextjs -> DRF，您应该让它处理会话以及您需要在 API 中为任何身份验证步骤执行的任何操作，放在回调或事件配置中命中这些端点的代码，我认为本教程更适合您的用例

从文档

pages/api/auth/[...nextauth].js

import Providers from `next-auth/providers`
...
providers: [
  Providers.Credentials({
    // The name to display on the sign in form (e.g. 'Sign in with...')
    name: 'Credentials',
    // The credentials is used to generate a suitable form on the sign in page.
    // You can specify whatever fields you are expecting to be submitted.
    // e.g. domain, username, password, 2FA token, etc.
    credentials: {
      username: { label: "Username", type: "text", placeholder: "jsmith" },
      password: {  label: "Password", type: "password" }
    },
    authorize: async (credentials) => {
      // Add logic here to look up the user from the credentials supplied
      const user = { id: 1, name: 'J Smith', email: 'jsmith@example.com' }

      if (user) {
        // call your DRF sign in endpoint here
        // Any object returned will be saved in `user` property of the JWT
        return Promise.resolve(user)
      } else {
        // If you return null or false then the credentials will be rejected
        return Promise.resolve(null)
        // You can also Reject this callback with an Error or with a URL:
        // return Promise.reject(new Error('error message')) // Redirect to error page
        // return Promise.reject('/path/to/redirect')        // Redirect to a URL
      }
    }
  })
]

...

  events: {
    signOut: async (message) => { /* call your DRF sign out endpoint here */ },
  }
于 2020-11-01T01:25:06.040 回答
1

你可以callbacks在这里使用。https://next-auth.js.org/configuration/callbacks

callbacks: {
  async signIn(user, account, profile) {
    return true
  },
  async redirect(url, baseUrl) {
    return baseUrl
  },
  async session(session, user) {
    return session
  },
  async jwt(token, user, account, profile, isNewUser) {
    return token
  }
}

在signIn回调中，您可以获取 accessToken 和tokenId从提供者登录。access_token在这里，调用您的 DRF API 并将这些令牌传递给您的 DRF以及当您从 DRF 取回时refresh_token。将它们添加到您的用户实例。然后在JWT回调中，获取accessand refreshfromuser并将它们添加到token

从某个博客得到这个

在此处输入图像描述

不过，您还需要处理刷新令牌。

于 2021-05-27T19:17:29.083 回答