如何在 GraphQL/AWS Amplify 的前端启用 CORS 模式？

Posted 2023-03-08

【中文标题】如何在 GraphQL/AWS Amplify 的前端启用 CORS 模式？

【英文标题】：How to enable the CORS mode on frontend side in GraphQL/AWS Amplify?

【发布时间】：2021-01-14 14:03:27

【问题描述】：

AWS Amplify 的 GraphQL 如何做同样的事情？

fetch('https://trusted-api.co.jp', 
  mode: 'cors'
);

我既没有找到如何做的文档，也没有找到提到 cors 的源代码。

参考

常规的graphQL操作可以如下调用：

import AWSAmplifyAPI,  graphqlOperation as graphQL_Operation, GraphQLResult  from "@aws-amplify/api";
import Observable from "zen-observable";

export default class DataBaseService 

  public static async sendRequestAndExtractDataFromResponse(
      graphQL_RawRequest: string,
      requestVariables?: object
  ): Promise<unknown> 

    const serverRawResponse: GraphQLResult | Observable<unknown> =
        await AWSAmplifyAPI.graphql(graphQL_Operation(graphQL_RawRequest, requestVariables));
   // ...
  

【参考方案1】：

您需要在服务器端进行配置，因此服务器端需要批准这个“CORS”问题。

从技术上讲，您的放大 lambda 函数将添加类似于以下内容的代码：

exports.handler = async (event) => 
  const response = 
    statusCode: 200,
    //  Uncomment below to enable CORS requests
    headers: 
      "Access-Control-Allow-Origin": "*",
    ,

    //   headers: 
    //     "Access-Control-Allow-Headers" : "Content-Type",
    //     "Access-Control-Allow-Origin": "https://www.example.com",
    //     "Access-Control-Allow-Methods": "OPTIONS,POST,GET"
    // ,
    body: JSON.stringify("Hello from Lambda!"),
  ;
  return response;
;