使用Auth0保存JWT Token时出错，请求技术排查

核心错误原因：Auth0中未配置匹配的API受众（Audience） #

报错Service not found: http://localhost:8000本质是Auth0无法识别你指定的受众标识符，按以下步骤逐一排查：

1. 确认Auth0控制台已创建对应API #

• 登录Auth0 Dashboard，进入APIs页面
• 检查是否存在标识符为http://localhost:8000的API：
  • 如果没有，点击"Create API"，填写标识符为http://localhost:8000，选择签名算法为RS256，完成创建
  • 如果已存在，确认标识符和代码中配置的完全一致（注意端口、斜杠、大小写不能有差异）

2. 授权前端应用访问该API #

• 在上述API的详情页，切换到Applications标签
• 找到你的前端单页应用（SPA），确保"Authorized"开关处于开启状态
• 确认已分配所需的权限（openid、profile、email这些scope需要在API的"Permissions"中提前定义，或直接使用默认OIDC scopes）

3. 修复前端Token存储的错误 #

你的代码中直接将getAccessTokenWithPopup的返回值存入localStorage，这是错误的——该方法返回的是包含accessToken属性的对象，而非纯token字符串：

const getTokenAndRegister = async () => {
  const res = await getAccessTokenWithPopup({
    authorizationParams: {
      audience: "http://localhost:8000",
      scope: "openid profile email",
    },
  });
  // 修正：提取accessToken属性
  localStorage.setItem("access_token", res.accessToken);
  setUserDetails((prev) => ({ ...prev, token: res.accessToken }));
  console.log(res.accessToken);
};

4. 验证后端配置正确性 #

确保后端的issuerBaseURL替换为你的实际Auth0租户域名（格式为https://<你的租户域名>.auth0.com），不能保留占位符：

const jwtCheck = auth({
  audience: "http://localhost:8000",
  issuerBaseURL: "https://your-tenant-domain.auth0.com", // 替换为真实租户域名
  tokenSigningAlg: "RS256",
});

按以上步骤调整后，重新测试获取Token的流程，问题应该能解决。

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