React Native集成Google Tasks遇401错误：如何解决令牌验证问题？

问题背景 #

在React Native应用中实现Google登录后，调用Google Tasks API获取任务列表时返回HTTP 401错误。已完成以下操作：

• 创建React Native应用并安装@react-native-google-signin/google-signin和axios依赖
• 编写App.tsx实现登录与API调用逻辑
• 在Google控制台启用Tasks API
• 尝试使用Web和Android类型的OAuth凭证，问题未解决

核心原因 #

401错误源于令牌类型错误、凭证配置不匹配或权限未正确授权。当前代码使用idToken调用API，但idToken仅用于身份验证，Google API需要的是用于授权的accessToken。

解决方案 #

1. 修正代码中的令牌使用 #

将登录成功后传递给fetchTasks的idToken替换为accessToken，修改后的signIn函数片段：

const signIn = async () => {
  try {
    await GoogleSignin.hasPlayServices();
    const userInfo = await GoogleSignin.signIn();
    setUserInfo(userInfo);
    fetchTasks(userInfo.accessToken); // 替换为accessToken
  } catch (error) {
    // 原有错误处理逻辑保持不变
  }
};

2. 正确配置OAuth 2.0凭证 #

根据目标平台配置对应类型的OAuth客户端ID：

• Android平台：
  1. 在Google控制台API和服务 > 凭据页面，创建Android类型客户端ID
  2. 填写应用包名（如com.googletasksapp）和调试/发布密钥库的SHA-1指纹（调试指纹可通过keytool -list -v -keystore ~/.android/debug.keystore获取）
  3. 在GoogleSignin.configure中添加androidClientId参数：

     GoogleSignin.configure({
       scopes: [
         'https://www.googleapis.com/auth/tasks',
         'https://www.googleapis.com/auth/calendar',
       ],
       webClientId: GOOGLE_WEB_CLIENT_ID,
       androidClientId: GOOGLE_ANDROID_CLIENT_ID, // Android平台必填
     });
     

• iOS平台：创建iOS类型客户端ID，填写应用Bundle ID，并在配置中设置对应的iosClientId

3. 完善OAuth同意屏幕配置 #

• 在Google控制台API和服务 > OAuth同意屏幕页面，将https://www.googleapis.com/auth/tasks和https://www.googleapis.com/auth/calendar添加到已授权范围
• 若应用处于测试阶段，需将测试用户添加到测试用户列表（未发布的OAuth应用仅测试用户可访问）

4. 关于API密钥的说明 #

Google Tasks API属于需要OAuth 2.0授权的API，不需要使用API密钥，仅需正确配置OAuth客户端ID并使用有效的accessToken即可。

额外检查项 #

• 验证accessToken有效性：可通过https://oauth2.googleapis.com/tokeninfo?access_token=YOUR_ACCESS_TOKEN查看令牌的权限范围和有效期
• 确保设备上的Google Play服务为最新版本，避免因服务版本过低导致授权失败

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