调用jsonwebtoken的jwt.sign报读取undefined的sign属性错误求解

运行登录接口代码时控制台抛出报错：

something went wrong logging in TypeError: Cannot read properties of undefined (reading 'sign')

业务代码 #

import { mAdmin } from "../../library/magic-server";
import { jwt } from "jsonwebtoken";

export default async function login(req, res) {
    
  if (req.method === "POST") {
    try {
      const auth = req.headers.authorization;
      const didToken = auth ? auth.substr(7) : "";
      console.log({ didToken });

      const metadata = await mAdmin.users.getMetadataByToken(didToken);
      console.log({ metadata });

      const token = jwt.sign(
        {
          ...metadata,
          iat: Math.floor(Date.now() / 1000),
          exp: Math.floor(Date.now() / 1000 + 7 * 24 * 60 * 60),
          "https://hasura.io/jwt/claims": {
            "x-hasura-allowed-roles": ["user", "admin"],
            "x-hasura-default-role": "user",
             "x-hasura-user-id": `${metadata.issuer}`,
          },
        },
        '<my secret key>',
        { algorithm: 'HS256' },
        function(err, token){
            console.log(token);
            console.error(err);
        }
      );

      console.log({ token });

      res.send({ done: true });
    } catch (error) {
      console.error("something went wrong logging in", error);
      res.status(500).send({ done: false });
    }
  } else {
    res.send({ done: false });
  }
}

调试信息 #

• 使用Postman携带授权Token向localhost:3000/api/login接口发送POST请求
• 控制台可正常打印didToken与metadata的返回值，初步判断问题出在jwt相关调用行
• 控制台错误栈提示at login (webpack-internal:///(api)/./pages/api/login.js:22:74)，但源码对应第22行不存在第74个字符位置，无法直接定位错误点

报错核心原因是jsonwebtoken的导入写法错误。jsonwebtoken包采用默认导出规则，不存在命名导出的jwt属性，写import { jwt } from "jsonwebtoken"时，实际导入的jwt值为undefined，后续调用jwt.sign()自然会抛出「读取undefined的sign属性」的错误。
另外代码中同时给jwt.sign传入了回调函数，这种异步写法下函数不会同步返回token值，后续同步执行console.log({ token })拿到的结果也会是undefined，属于第二个逻辑问题。
错误栈行号与源码不匹配是因为Next.js本地开发时会经过webpack编译打包，错误栈标注的是编译后文件的位置，不是原始源码位置，属于正常现象。

1. 修正jsonwebtoken的导入语句，将命名导入改为默认导入：

   // 错误写法
   // import { jwt } from "jsonwebtoken";
   // 正确写法
   import jwt from "jsonwebtoken";
   

2. 调整jwt签名逻辑，不要混用同步返回和异步回调写法，推荐直接使用同步写法简化逻辑：

   // 移除传入的回调参数，直接同步获取签名后的token
   const token = jwt.sign(
     {
       ...metadata,
       iat: Math.floor(Date.now() / 1000),
       exp: Math.floor(Date.now() / 1000 + 7 * 24 * 60 * 60),
       "https://hasura.io/jwt/claims": {
         "x-hasura-allowed-roles": ["user", "admin"],
         "x-hasura-default-role": "user",
          "x-hasura-user-id": `${metadata.issuer}`,
       },
     },
     '<my secret key>',
     { algorithm: 'HS256' }
   );
   
   console.log({ token });
   res.send({ done: true, token });
   

内容的提问来源于stack exchange，提问作者SOHAM