使用jsonwebtoken解码遇类型错误：'string|JwtPayload'无指定属性

问题根源 #

jwt.decode()的返回类型是string | JwtPayload，TypeScript无法确定解码结果是对象还是字符串，直接解构id、deviceId、exp等属性会触发类型校验错误。

解决方案 #

1. 自定义Payload接口，明确类型结构 #

先定义匹配你的token payload结构的TypeScript接口，让类型系统明确解码后的对象结构：

interface TokenPayload {
  id: string | number; // 根据userId实际类型调整
  deviceId: string | number; // 根据deviceId实际类型调整
  exp: number;
}

2. 优化decode函数，处理类型边界 #

修改你的decode方法，添加类型断言并处理解码失败返回字符串的情况：

public static decode(token: string): TokenPayload | null {
  const decoded = jwt.decode(token);
  // 校验解码结果是否为有效对象
  if (typeof decoded === 'object' && decoded !== null) {
    return decoded as TokenPayload;
  }
  return null; // 解码失败或结果为字符串时返回null
}

3. 解码后先校验再解构 #

调用decode后，先判断结果有效性，再安全解构属性：

async getSecretKey(request: Request) {
  const headers = request.headers;
  const token = headers['authorization']?.split(" ")[1];
  
  if (!token) {
    throw new Error("请求头中未携带Token");
  }
  
  const payload = JwtStrategy.decode(token);
  if (!payload) {
    throw new Error("Token解码失败或无效");
  }
  
  const { id, deviceId, exp } = payload;
  // 后续业务逻辑...
}

4. 推荐方案：用jwt.verify替代jwt.decode（更安全） #

jwt.decode仅解码不验证签名，存在安全风险。jwt.verify会校验签名有效性，同时返回明确的对象类型：

// 先修改generateToken的payload参数类型
public generateToken(payload: TokenPayload, secretKey: string) {
  return jwt.sign({ ...payload, exp: Math.floor(Date.now() / 1000 + EXP_2_MIN) }, secretKey);
}

// 新增verifyToken方法
public static verifyToken(token: string, secretKey: string): TokenPayload {
  return jwt.verify(token, secretKey) as TokenPayload;
}

调用示例：

async getSecretKey(request: Request) {
  const headers = request.headers;
  const token = headers['authorization']?.split(" ")[1];
  
  if (!token) {
    throw new Error("请求头中未携带Token");
  }
  
  // 传入你的JWT密钥（建议从环境变量读取）
  const payload = JwtStrategy.verifyToken(token, process.env.JWT_SECRET_KEY);
  const { id, deviceId, exp } = payload;
  // 后续业务逻辑...
}

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