使用fetchAuthSession获取Access Token遇401 Unauthorized问题求助

1. 检查请求中实际发送的Token值 #

你代码中直接将accessToken对象拼接进请求头，Amplify返回的accessToken是CognitoAccessToken实例对象，并非原始JWT字符串。直接拼接会导致发送的是Bearer [object Object]这类无效值。

解决：获取原始JWT字符串，正确写法是：

// 替换原拼接代码
"x-access-token": `Bearer ${accessToken.toString()}`
// 部分Amplify版本需取jwtToken属性
"x-access-token": `Bearer ${accessToken.jwtToken}`

同时可以在控制台打印accessToken.toString()的结果，和Postman拿到的Token对比，确认是否一致。

2. 移除mode: "no-cors"配置 #

no-cors模式会强制浏览器限制跨域请求的请求头，自定义头（如x-access-token）会被浏览器自动忽略，导致后端根本接收不到Token，直接返回401。

如果你的API配置了正确的CORS规则（允许你的前端域名、允许自定义头），直接移除mode: "no-cors"即可；若CORS未配置，需要在API网关/后端服务中添加对应的CORS规则。

3. 验证请求头的正确性 #

确认后端API期望的Token头字段：

• 多数标准API使用Authorization头而非x-access-token，比如：

  headers: {
    "Authorization": `Bearer ${accessToken.toString()}`,
  }
  

对比Postman中调用时使用的请求头，确保代码中的头字段完全一致。

4. 对比Postman与fetchAuthSession返回Token的Payload #

使用JWT解码工具（本地解码即可）对比两个Token的以下字段：

• aud（受众）：是否与后端API要求的一致
• iss（签发者）：是否为同一个Cognito用户池
• scope（权限范围）：是否包含API所需的权限（比如transactions/read）
• exp（过期时间）：确认Token未过期

如果aud或scope不匹配，需要检查Amplify的配置（比如是否指定了正确的oauth.scopes），或者调整后端的Token验证规则。

5. 确认Amplify配置正确性 #

检查你的Amplify初始化配置，确保userPoolId、userPoolWebClientId、region与Postman中使用的Cognito用户池信息完全一致。如果配置错误，fetchAuthSession会从错误的用户池获取Token，自然无法通过后端验证。

代码修改示例 #

修正后的fetchTotalTransactions函数：

export const fetchTotalTransactions = async () => {
  try {
    const accessToken = await currentSession(); 
    if (!accessToken) {
      throw new Error("Access token not found");
    }
    const tokenStr = accessToken.toString(); // 获取原始JWT字符串
    console.log("使用的Token:", tokenStr);
    const response = await fetch(
      "https://v7rz2vn2tl.execute-api.us-east-1.amazonaws.com/dev/transactions/totals?fund_id=78773d35-4272-4891-989d-ffae9dac59d4&limit=10",
      {
        method: "GET",
        // 移除no-cors模式
        headers: {
          // 确认后端期望的头字段，这里假设是Authorization，若为x-access-token则替换
          "Authorization": `Bearer ${tokenStr}`,
          "Content-Type": "application/json"
        },
      }
    );

    if (!response.ok) {
      // 获取后端返回的错误信息，帮助排查
      const errorData = await response.json();
      throw new Error(`请求失败: ${response.status} - ${JSON.stringify(errorData)}`);
    }

    return response.json();
  } catch (error) {
    console.error(error);
    throw error;
  }
};

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