类型“User | ”上不存在属性“role” NextAuth 中的 AdapterUser`

Question

我正在尝试构建一个实现 NextAuth 的 NextJS 应用程序。我在[...nextauth].ts配置回调时遇到以下错误：

Type error: Property 'role' does not exist on type 'User | AdapterUser'.
  Property 'role' does not exist on type 'User'.

  56 |     jwt: async ({ token, user }) => {
  57 |       // First time JWT callback is run, user object is available
> 58 |       if (user && user.id && user.role) {
     |                                   ^
  59 |         token.id = user.id;
  60 |         token.role = user.role;
  61 |       }

完整的回调代码部分如下所示：

  callbacks: {
    jwt: async ({ token, user }) => {
      // First time JWT callback is run, user object is available
      if (user && user.id && user.role) {
        token.id = user.id;
        token.role = user.role;
      }
      return token;
    },
    session: async ({ session, token }) => {
      if (token && token.id && token.role) {
        session.id = token.id;
        session.role = token.role;
      }
      return session;
    },
  },

我正在使用带有电子邮件和密码的 CredentialProvider。这是authorize：

    async authorize(credentials) {
      if (!credentials || !credentials.email) return null;

      const dbCredentials = await executeAccountQuery(
        `SELECT password FROM auth WHERE email=?`,
        [credentials.email]
      );

      if (Array.isArray(dbCredentials) && "password" in dbCredentials[0]) {
        const isValid = await compare(
          credentials.password,
          dbCredentials[0].password
        );

        if (isValid) {
          return {
            id: "5",
            role: 99,
            name: "John Smith",
            email: credentials.email,
          };
        }
        return null;
      }
      return null; // login failed
    },

由于该authorize函数的工作方式，我知道该User对象将附加一个事实role（因为我已经测试过它），但我无法找到处理此错误并消除它的方法。

同样，我也收到回调错误，session其中session.id和session.role也不存在Session。

Answer 1

经过大量的互联网挖掘和反复试验，我找到了解决这个问题的方法。

您需要通过执行以下操作来手动扩展Session,User和类型：JWT

1. types/next-auth.d.ts在您的根项目目录中创建。
2. 将以下内容插入到文件中：

import { Session } from "next-auth";
import { JWT } from "next-auth/jwt";

declare module "next-auth" {
  interface Session {
    id: string;
    role: number;
  }

  interface User {
    id: string;
    role: number;
  }
}

declare module "next-auth/jwt" {
  interface JWT {
    id: string;
    role: number;
  }
}

3. 运行npm run build并验证它是否正确构建。

Answer 2

类型定义：

types/next-auth.d.ts：

import { DefaultUser } from 'next-auth';
declare module 'next-auth' {
    interface Session {
        user?: DefaultUser & { id: string; role: string };
    }
    interface User extends DefaultUser {
        role: string;
    }
}

用法：

async session({ session, user }) {
    if (session?.user) {
        session.user.id = user.id;
        session.user.role = user.role;
    }

    return session;
}