会话数据

本指南解释了如何向用户会话添加自定义数据。在许多情况下，您可能希望调整身份验证流程返回的信息。这可能取决于您的提供商或您为丰富会话数据而进行的任何其他 API 调用。

修改 JWT 令牌

为了在会话请求之间持久化数据，我们需要将某些信息注入到 JWT 令牌中，然后我们可以在后续会话请求期间访问这些信息。但是，请避免在 JWT 令牌中注入过多数据，因为它的大小有限。我们建议仅注入访问令牌或会话令牌，然后可以使用它们在会话回调中请求更多用户信息。

JWT 回调提供

token: 原始 JWT 令牌
account, profile, isNewUser: OAuth 提供商返回的数据。此数据因提供商而异，我们建议记录每个值以检查包含哪些数据。这些值仅在创建 JWT 令牌时可用，在后续请求中，只有 token 可以访问。

import { NuxtAuthHandler } from '#auth'

export default NuxtAuthHandler({
  // your authentication configuration here!
  callbacks: {
    jwt({ token, account, profile }) {
      if (account) {
        token.sessionToken = account.session_token
      }
      return token
    },
  }
})

信息

任何注入到 JWT 令牌中的数据都无法直接从前端访问，但可以使用 getToken 函数在服务器端访问。

将数据注入会话

在使用附加数据丰富 JWT 令牌后，您现在可以在 session 回调中访问此数据。每次请求会话数据时，都会调用 session 回调。这可能在使用 useAuth、getServerSideSession 或会话刷新时发生。

import { NuxtAuthHandler } from '#auth'

export default NuxtAuthHandler({
  // your authentication configuration here!
  callbacks: {
    async session({ session, token }) {
      // Token we injected into the JWT callback above.
      const token = token.sessionToken

      // Fetch data OR add previous data from the JWT callback.
      const additionalUserData = await $fetch(`/api/session/${token}`)

      // Return the modified session
      return {
        ...session,
        user: {
          name: additionalUserData.name,
          avatar: additionalUserData.avatar,
          role: additionalUserData.role
        }
      }
    },
  }
})

信息

session 回调中抛出的任何错误都将导致会话终止，并且用户将被注销。

就是这样！您现在可以在您的应用程序中访问您的新会话数据。

vue

<script setup lang="ts">
const { data } = useAuth()
</script>

<template>
  <div v-if="data">
    <!-- You can access the session data you injected above! -->
    Hello, {{ data.user.name }}. You have the role: {{ data.user.role }}!
  </div>
</template>

Typescript

修改会话或 JWT 对象时，您可能需要相应地调整类型，以确保您获得适当的智能提示和类型支持。模块扩充可用于将其他类型声明注入到已安装的模块中，以覆盖或添加其他数据。

首先，在您的项目根目录中创建一个名为：next-auth.d.ts 的新 typescript 文件。Typescript 将自动识别此文件正在扩充 next-auth 的模块类型（在后台运行）。

// file: ~/next-auth.d.ts
import type { DefaultSession } from 'next-auth'

declare module 'next-auth' {
  /* Returned by `useAuth`, `getSession` and `getServerSession` */
  interface Session extends DefaultSession {
    user: {
      name: string
      avatar: string
      role: 'admin' | 'manager' | 'user'
    }
  }
}

除了修改会话数据类型外，您还可以扩展 JWT 令牌的类型。这使您可以在 NuxtAuthHandler 中访问 JWT 令牌或在服务器端调用 getToken 时获得适当的类型支持。

// file: ~/next-auth.d.ts
declare module 'next-auth/jwt' {
  /** Returned by the `jwt` callback and `getToken` */
  interface JWT {
    sessionToken?: string
  }
}

会话数据 ​

修改 JWT 令牌 ​

将数据注入会话 ​

Typescript ​

会话数据

修改 JWT 令牌

将数据注入会话

Typescript