跨项目通信中jwt-decode解码JWT Token报InvalidTokenError求助

我正在搭建两个项目的通信：voll-api-nodejs作为后端API项目，voll-mobile作为调用该API的移动端项目。

后端生成JWT Token的代码：

const token = jwt.sign({ id, role }, process.env.SECRET, {
  expiresIn: 86400
}); // 24小时过期

res.status(200).json({
  auth: true,
  token
});

移动端调用API并解码Token的代码：

import { jwtDecode } from "jwt-decode";

const result = await api.post("/auth/login", {
  email,
  password,
});

const token = result.data.token;
const decodedToken = jwtDecode(token);
const myId = decodedToken.id;

调用jwtDecode时触发错误：

Error decoding token: [InvalidTokenError: Invalid token specified: invalid base64 for part #2 (Property 'atob' doesn't exist)]

已验证该Token有效，Token内容：

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjI1NzlkMTVmLWY0ZjEtNGEwOS04MGRjLTk3OTdiZmZmMzg4NyIsInJvbGUiOiJQQUNJRU5URSIsImlhdCI6MTcwMjY3MzM1MiwiZXhwIjoxNzAyNzU5NzUyfQ.Oz7iBmkfPCVDr0s-JlzGjyvpZIPvJBYsrjqOT0tJQ3w

这个错误的核心原因是移动端环境（比如React Native）没有浏览器自带的atob函数，而jwt-decode默认依赖这个函数解码Base64部分。

有两种直接的解决方式：

方式一：添加atob/btoa兼容函数 #

在移动端项目的入口文件（比如App.js）顶部添加以下代码，给全局环境补上这两个函数：

if (typeof atob === 'undefined') {
  global.atob = (str) => Buffer.from(str, 'base64').toString('binary');
}

if (typeof btoa === 'undefined') {
  global.btoa = (str) => Buffer.from(str, 'binary').toString('base64');
}

方式二：给jwtDecode传自定义解码逻辑 #

调用jwtDecode时，通过配置项传入基于Buffer的解码函数（React Native原生支持Buffer），绕开对atob的依赖：

import { jwtDecode } from "jwt-decode";

const result = await api.post("/auth/login", {
  email,
  password,
});

const token = result.data.token;
const decodedToken = jwtDecode(token, {
  decode: (base64Str) => Buffer.from(base64Str, 'base64').toString('utf8')
});
const myId = decodedToken.id;

额外检查点：

• 确认移动端已正确安装jwt-decode，建议使用v3及以上版本（支持自定义解码配置）
• 打印result.data.token确认内容完整，没有被截断或转义

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