如何使用 GraphQL POST 请求进行授权获取？答案

【问题标题】：How to do authorization fetch with GraphQL POST request?如何使用 GraphQL POST 请求进行授权获取？
【发布时间】：2022-01-16 05:09:35
【问题描述】：

我正在尝试通过使用 fetch 方法来获取架构来发出 GraphQL 请求。在我的设置中的 AWSAppSync 上，我看到了 API URL 和 API ID，但我不知道如何正确配置我的 fetch POST 请求以获取包含我需要的数据的响应。

这是我尝试使用的代码：

fetch('https://qnwb7jaoxdyky6egh4.appsync-api.us-east-1.amazonaws.com/graphql', {
    method: 'POST',
    headers: { 
Authorization: 'Basic bnwak7alhw52rlioy',  <----- this is API ID from AWS AppSync settings
'Content-Type': 'application/json' 
},
    body: JSON.stringify({
      variables: {},
      query: `
      {
        __schema {
          types {
            kind
            name
            possibleTypes {
              name
            }
          }
        }
      }
    `,
    }),
  })
    .then((result) => result.json())
    .then((result) => {
      debugger;  <--------- here I'm expecting to see the response data, but I see an error "UnauthorizedException"

      // here we're filtering out any type information unrelated to unions or interfaces
      const filteredData = result.data.__schema.types.filter(
        (type) => type.possibleTypes !== null,
      );
      
      result.data.__schema.types = filteredData;
      fs.writeFile('./fragmentTypes.json', JSON.stringify(result.data), (err) => {
        if (err) {
          console.error('Error writing fragmentTypes file', err);
        } else {
          console.log('Fragment types successfully extracted!');
        }
      });
    });

我正在使用 AWS AppSync 设置中的 API URL 和 API ID。

我不知道为什么，但我收到一条错误消息：“消息：“无法解析 JWT 令牌。”

【问题讨论】：

标签： javascript reactjs amazon-web-services graphql aws-appsync

【解决方案1】：

您需要在 AppSync POST 请求中传递正确的标头。所需的标题因 authorization mode。 API Key auth 是默认的“默认授权模式”。检查 AppSync 控制台设置选项卡。

// API_KEY
headers: {
  `x-api-key`:  "da2-the.api.key.from.the.appsync.console"
}

// AMAZON COGNITO_USER_POOLS
headers: {
  Authorization: "ey.jwt.token.a.really.really.long.string.you.get.from.cognito.after.you.login",
  host: 'qnwb7jaoxdyky6egh4.appsync-api.us-east-1.amazonaws.com' // the middle bits of the URL
}

【讨论】：

我看到在我的情况下，默认授权模式是“Amazon Cognito 用户池”，但我找不到 JWT 令牌将其用于我的目的。我需要以某种方式创建它还是在哪里可以找到它？
对，我应该说API_KEY是“默认默认授权模式”。答案已编辑。
如果您为 Cognito 身份验证配置 Appsync，您会将您的 UserPool 用户名和密码凭证交换为 JWT。 SDK InitiateAuthCommand 返回一个令牌。 Amplify 具有 frontend libraries 和 UI 组件，以支持 React 和其他 Web 应用程序的用户身份验证流程。注意：您可以在没有后端“Amplify CLI”的情况下使用 Amplify 的前端工具。

【解决方案2】：

我已经在这样的标头中传递了 API 密钥，就我而言，我正在调用与 API 密钥一起使用的 APPSync Graphql 端点

headers: {
        "x-api-key": "XXXX-XXXXXXX", // API key here
      },

【讨论】：