CORS 问题 React 本地客户端和 AWS Lambda 函数

Question

我正在尝试从 localhost:3000 向我开发的 Lambda 函数发出请求

在我的 lambda 函数响应中，我指定了所有需要的标头以允许此操作

    return {
    'statusCode': 200,
    'body': json.dumps(result_object),
    'headers': {
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin': '*',  # Use '*' for allowing any origin, or specify a domain to restrict access
        'Vary': 'Origin',
        'Access-Control-Allow-Methods': 'GET,POST,OPTIONS',  # Optionally add other methods your API supports
        'Access-Control-Allow-Headers': 'Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token,Access-Control-Allow-Origin,Access-Control-Allow-Methods',  # Optionally specify other headers your API accepts
    }
}

此外，当我在 Postman 中获取响应时，我可以看到所有正确的标题

但是当我通过 Chrome 或 Safari 的 React 应用程序执行相同操作时，我收到以下错误：

从源“http://localhost:3000”获取...的访问已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-Origin”标头。如果不透明响应满足您的需求，请将请求模式设置为“no-cors”以在禁用 CORS 的情况下获取资源。

我还能做什么来解决这个问题？ 我的标题格式有问题吗？

Answer 1

是因为API网关，

因此您还必须在 Lambda 和 API 网关中配置 CORS 设置。