使用nextjs和next-auth保存自定义cookie

w46czmvw  于 2023-06-29  发布在  其他
关注(0)|答案(1)|浏览(229)

我正在尝试了解如何使用next-auth(4.22.1)和nextjs(13.4.5)保存自定义cookie。我的auth-flow的概要:
1.用户在next-auth上使用社交提供程序进行身份验证。
1.在成功认证后,使用signIn回调调用自定义后端API(让我们称之为login)。

  1. login将在Authorization头中返回access_token,在set_cookie中返回refresh_token。
    1.当UI收到来自login API的成功响应时,它允许用户前进。
    在这个流程中,我可以将access_token保存在会话中,然后在客户端或服务器端使用它,但是刷新令牌没有保存为cookie,这是可以理解的,因为下一个认证代码正在服务器端执行。**我的问题是,当我需要一个新的access_token时,我如何保存refresh_token,然后将其传递到我的后端?这里的首选方法是在会话中也保存刷新令牌,还是因为没有设置cookie而明显丢失了某些内容?**我的理解是,理想情况下,刷新令牌保存为http_only cookie,以便默认情况下包含在API调用中。
    这是我的下一个验证码。我没有改变任何配置它使用的默认值。
import NextAuth from "next-auth/next";
import GithubProvider from "next-auth/providers/github";
import {User, Account, Profile } from "next-auth";
import type { NextApiRequest, NextApiResponse } from "next"

async function auth(req: NextApiRequest, res: NextApiResponse) {
  return await NextAuth(req, res, {
    providers: [
      GithubProvider({
        clientId: process.env.GITHUB_CLIENT_ID || '',
        clientSecret: process.env.GITHUB_CLIENT_SECRET  || '',
      }),
    ],
    callbacks: {
      async signIn(params: { user: User | undefined; account: Account | null; profile?: Profile | undefined; email?: { verificationRequest?: boolean } | undefined; credentials?: Record<string, any> | undefined }) {
        //console.log('signIn', user, account, profile);
        const { user, account, profile } = params;
        console.log(account?.access_token)
        try {
            const res = await fetch('http://127.0.0.1:8080/login/', {
            method: 'POST',
            headers: {
              'Content-Type': 'application/json',
              credentials: 'include',
            },
            body: JSON.stringify({ token: account?.access_token }),
          });
          
          if (res.ok && res.headers && res.headers.get('authorization') && account) {
            const test_access_token = res.headers.get('authorization')?.split(' ')[1];
            const test_refresh_token = res.headers.get('Set-Cookie');
            account.test_access_token = test_access_token;
            //account.test_refresh_token = test_refresh_token;
            return true;
          }
        } catch (error) {
          console.log(error);
        }
        return false;
      },
      async jwt({ token, account, profile }) {
        // Persist the OAuth access_token and the user id to the token right after signin
        if (account) {
          token.test_access_token = account.test_access_token
          //token.test_refresh_token = account.test_refresh_token
          token.id = profile?.name
        }
        return token
      },
      async session({ session, token, user }) {
        // Send properties to the client, like an access_token and user id from a provider.
        if (token) {
          session.test_access_token = token.test_access_token
          //session.test_refresh_token = token.test_refresh_token
          session.user.id = token.id
        }
        
        return session
      },
    }
  });
}

export { auth as GET, auth as POST };
3vpjnl9f

3vpjnl9f1#

NextAuth代码在服务器端运行。所以cookies不能设置,因为它不是浏览器。我是通过在登录时从重定向路由的客户端重新登录到自定义后端(使用useEffect)来实现的。

相关问题