React调用未认证GraphQL查询遇“Error: No current user”问题排查

核心原因 #

你遇到的错误是因为Amplify的IAM认证需要先获取未认证身份池的凭证，React应用不会自动初始化未认证用户身份，必须显式触发身份获取流程。

解决方案步骤 #

1. 确认未认证访问已正确启用 #

虽然你提到已完成配置，仍需再次确认：

• 运行 amplify update auth，选择"Walkthrough all the auth configurations"
• 确保"Enable unauthenticated access?"选项设置为Yes
• 执行部署变更：amplify push

2. 在React应用中初始化未认证身份 #

在调用GraphQL API之前，需要先获取未认证用户的身份凭证。在应用初始化阶段（比如App组件的useEffect钩子中）添加以下代码：

import { Auth } from 'aws-amplify';

// 初始化未认证身份
async function initUnauthUser() {
  try {
    await Auth.signInAnonymously();
    console.log("未认证身份初始化成功");
  } catch (error) {
    console.error("初始化未认证身份失败:", error);
  }
}

// 组件挂载时触发初始化
useEffect(() => {
  initUnauthUser();
}, []);

注：若使用较旧版本的Amplify，可替换为 Auth.federatedSignIn({ provider: 'AWS' }) 完成身份初始化

3. 修正GraphQL API调用的参数格式 #

你当前的API调用参数格式有误，API.graphql的配置参数需以对象形式传入，明确指定authMode：

const response = await API.graphql({
  query: submitResponseMessage,
  variables: { message: "hello" },
  authMode: 'AWS_IAM'
});

4. 验证未认证角色的权限 #

确保IAM中的未认证角色具备以下权限：

• AppSync API的 appsync:Invoke 权限（针对目标mutation）
• 绑定的Lambda函数 myFunc-${env} 的 lambda:InvokeFunction 权限

可通过IAM控制台查看该角色的策略文档，确认是否包含对应权限声明。

验证 #

完成以上步骤后重新运行React应用，即可成功调用该公共mutation。

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