在next-auth中如何获取provider返回的access token

可以实现全局访问，核心思路是通过next-auth内置的jwt和session回调，将signIn阶段拿到的access_token持久化存入会话体系，后续在客户端、服务端都可以直接从会话中读取该值，具体操作步骤如下：

步骤1：修改next-auth配置，新增回调逻辑 #

在你的auth.ts（或[...nextauth]/route.ts）配置文件中，补充jwt和session回调的逻辑，将access_token存入会话：

import NextAuth from "next-auth"
import GoogleProvider from "next-auth/providers/google"

export const authOptions = {
  providers: [
    GoogleProvider({
      clientId: process.env.GOOGLE_CLIENT_ID!,
      clientSecret: process.env.GOOGLE_CLIENT_SECRET!,
      authorization: {
        params: {
          // 这里可以添加你需要的Google权限scope
          scope: "openid email profile https://www.googleapis.com/auth/calendar",
        },
      },
    }),
  ],
  callbacks: {
    async jwt({ token, account }) {
      // 仅在用户首次登录/授权时account对象存在
      if (account) {
        // 将Google返回的access_token存入jwt payload
        token.accessToken = account.access_token
        // 可选：如果需要刷新token也可以一并存入
        token.refreshToken = account.refresh_token
        token.accessTokenExpires = account.expires_at * 1000
      }
      return token
    },
    async session({ session, token }) {
      // 将jwt中存储的access_token传入session对象，方便后续读取
      session.accessToken = token.accessToken as string
      session.refreshToken = token.refreshToken as string
      session.accessTokenExpires = token.accessTokenExpires as number
      return session
    },
  },
}

export default NextAuth(authOptions)

步骤2：不同场景下读取access_token #

客户端组件/页面 #

直接使用next-auth提供的useSession钩子读取：

'use client'
import { useSession } from "next-auth/react"

export default function ClientPage() {
  const { data: session } = useSession()
  
  // 直接从session中读取Google的access_token
  const googleAccessToken = session?.accessToken

  return <div>Access Token: {googleAccessToken}</div>
}

服务端组件/API路由/Server Action #

使用getServerSession方法读取：

import { getServerSession } from "next-auth/next"
import { authOptions } from "@/app/api/auth/[...nextauth]/route"

// 服务端组件示例
export default async function ServerPage() {
  const session = await getServerSession(authOptions)
  const googleAccessToken = session?.accessToken

  // 可以在这里直接调用Google的开放接口，不用把token暴露给前端
  return <div>服务端已拿到token，可直接调用Google API</div>
}

注意：如果你的Google access_token包含高风险权限，不需要在前端使用的话，可以不用在session回调中将token返回给前端，仅存在jwt payload中，服务端读取session时仍可获取到该值，降低泄露风险。

内容的提问来源于stack exchange，提问作者Mahdi-Jafaree