首页 > 解决方案 > AWS API 网关引发 CORS 错误

问题描述

我在 API Gateway 后面有一个 api 堆栈。我使用 connexion 并且我有一个代码,它添加了与 CORS 相关的响应。

app = connexion.FlaskApp(__name__, specification_dir='swagger/')
app.add_api('swagger.yaml', arguments={'title': 'MyApp Server'})
app.app.json_encoder = JSONEncoder
CORS(app.app)
app.run()

我已确保在 api 网关端启用了 cors。我可以使用 curl 运行所有 api 端点。我通过 curl 的请求标头(我添加了 -H 'ORIGIN: http://localhost:8080 ' 来模拟浏览器行为)。

> POST /dev/current/login HTTP/2
> Host: <host>.execute-api.us-east-1.amazonaws.com
> User-Agent: curl/7.54.0
> Accept: */*
> Origin: http://localhost:8080

我得到的回应

< HTTP/2 200 
< content-type: application/json
< content-length: 560
< date: Fri, 17 Jan 2020 21:08:20 GMT
< x-amzn-requestid: <>
< access-control-allow-origin: http://localhost:8080
< x-amzn-remapped-content-length: 560
< x-amz-apigw-id: <>
< vary: Origin
...

我正在尝试构建一个 Web 应用程序。当我模拟类似的行为时,我得到了 CORS 错误。

:path: /dev/current/login
:scheme: https
accept: application/json, text/plain, */*
accept-encoding: gzip, deflate, br
accept-language: en-US,en;q=0.9
content-length: 342
content-type: application/json;charset=UTF-8
origin: http://localhost:8080
referer: http://localhost:8080/
sec-fetch-mode: cors

回复

content-encoding: gzip
content-length: 43
content-type: application/json
date: Fri, 17 Jan 2020 20:31:02 GMT
status: 403
via: 1.1 <CF Host>.cloudfront.net (CloudFront)

x-amzn-errortype: ForbiddenException
x-cache: Error from cloudfront

我究竟做错了什么。

我的客户是用反应写的。

Axios.post('https://<host>.execute-api.us-east-1.amazonaws.com/dev/current/login', {
        headers: {
            'Access-Control-Allow-Origin': '*',
            'X-Api-Key': 'API key',
            'ORIGIN': 'http://localhost:443',

        }
    }).then(v => console.log(v)).catch(c => console.log(c));

标签: aws-api-gatewayamazon-cloudfront

解决方案


看起来您的 API 期望来源是http://localhost:8080.

看起来您不是从主机发送请求,http://localhost:8080因为我看到您的反应代码将原点设置为'ORIGIN': 'http://localhost:443'

我建议您将 API cors 设置为允许来自的请求,*以查看您收到的错误是否与 cors 有关(我很确定它是)。一旦你让它工作,那么你可以将它设置为特定的域。

希望这可以帮助。


推荐阅读