前端react用到的next-auth/react库处理用户认证

next-auth/react 库：

useSession 是一个非常强大且常用的 Hook，它来自于 next-auth/react 库，专门用于在 Next.js 应用中处理用户认证状态。

简单来说，它的核心功能是：让你在任何客户端组件中，轻松地知道用户当前是否登录，并获取登录用户的信息。

🎯 核心功能

useSession 主要做三件事：

1. 获取登录状态：返回一个布尔值，告诉你用户是否已登录。
2. 获取用户数据：如果用户已登录，返回用户的详细信息（如姓名、邮箱、头像等）。
3. 提供加载状态：返回一个布尔值，告诉你 Next.js 是否还在验证用户的会话（比如正在刷新 token）。

---

🛠️ 如何使用 useSession

useSession 返回一个包含三个属性的对象：data, status, update。

import { useSession } from 'next-auth/react';

function MyComponent() {
  const { data: session, status } = useSession();

  // ... 组件逻辑
}

1. data (或 session)

• 如果用户已登录 ：data 是一个包含用户信息的对象。它的具体结构取决于你在 NextAuth 配置中使用的 callbacks.session 回调函数，但通常至少包含 user 对象。

    {
      user: {
        name: "John Doe",
        email: "john@example.com",
        image: "https://.../avatar.jpg"
      },
      expires: "2024-01-01T00:00:00.000Z"
    }

• 如果用户未登录 ：data 的值为 null。

2. status

这是一个字符串，表示当前会话的状态，有三种可能的值：

• 'loading'：会话正在被加载或验证中。此时你不知道用户是否登录，适合显示一个加载指示器。
• 'authenticated'：用户已成功登录，data 对象可用。
• 'unauthenticated'：用户未登录，data 为 null。

3. update (可选)

这是一个函数，用于手动刷新会话数据，比如在用户更改了个人资料后，可以调用它来获取最新的用户信息。