九、NextAuth 的 Client API

简介

• Session 对象：

{
  user: {
    name: string
    email: string
    image: string
  },
  expires: Date 
}

• Session 数据对象并不包含敏感信息，比如Session-Token或者OAuth-Token，它只加载页面显示所需要的最小数据，比如Name、Email、Image，如果需要自定义sessiion对象，需要使用 session callback
• 需要确保 添加到 pages/_app.js 中，并作为顶级元素。
• 使用举例：

import { useSession } from "next-auth/react"

export default function Component() {
  const { data: session, status } = useSession()

  if (status === "authenticated") {
    return 
Signed in as {session.user.email}
  }

  return Sign in
}

useSession()

• 注意，这个函数客户端可用，但是服务端是不可用的。

• useSession() returns an object containing two values: data and status:

• data 的取值可能是 undefined 或 null.

  • 当session不存在时 data 返回 undefined
  • 当session检索失败时, data 返回 null
  • 在成功的情况下 data 返回 Session.

• status: 是一个枚举，取值包括 "loading" | "authenticated" | "unauthenticated"

onUnauthenticated() 回调

• 通常情况下，可以再 useSession 中加入 onUnauthenticated() 回调来处理没有授权的情况，举例：

import { useSession } from "next-auth/react"

export default function Admin() {
  const { status } = useSession({
    required: true,
    onUnauthenticated() {
      // The user is not authenticated, handle it here.
    },
  })

  if (status === "loading") {
    return "Loading or not authenticated..."
  }

  return "User is logged in"
}

结束