AWS|API Gateway 启用 CORS 跨域请求

by 穿卡芦苇 #AWS手册
文章目录

AWS REST API 要能正常跨域请求,在 API Gateway,Lambda Function 都需要额外的配置。

先了解 CORS

有助于理解后续步骤和处理可能出现的问题。 参考文章:➦阮一峰:跨域资源共享 CORS 详解

为 API 开启 CORS

可参考 ➦官方文档

  1. Enable CORS API Gateway → Resources → 选择 API, Actions → Enable CORS, 选上 4XX,选上 5XX; 点击按钮 「Enable CORS」

  2. 手动补充更多 检查每个方法的 Response 的每个 HTTP Status,即除了 200 之外,可能还需要手动添加 400,500等(如果连接的 Lambda会返回相关状态的话), 为每个 HTTP Status,都要添加一个 Header:Access-Control-Allow-Origin

非必须: 如果有自定义的 Header ,在 Enable CORS 时,将自定义 header 字符串添加到 Access-Control-Allow-Headers 里 并且,每个 HTTP Status 里,要添加一个 Header:Access-Control-Allow-Headers

Lambda or HTTP proxy integrations 配置

Lambda Functoin 在返回结果时也要添加 header : Access-Control-Allow-Origin:'?'

Python 代码举例:

return {
        'statusCode': 200,
        'headers': {Access-Control-Allow-Origin:'*'},
        'body': json.dumps(data)
    }
  • 允许所有域名的跨域请求
      其中 Access-Control-Allow-Origin:'*'
  • 只允许指定的域名跨域,
      则将*星号替换为指定域名即可  
  • 要允许多个指定域名,
      方法是判断请求来源的域名之后,返回对应的域名。更多详情可参考➦掘金的这篇文章。  

Deploy API

最后别忘了部署API。

前端/客户端的请求

  • 若浏览器端使用 JS fetch()
      需要注意这几个参数:
    credentials: 'same-origin' 
    headers: {
      'Authorization': 'Bearer ' + id_token //如果请求的 API 开启了 token 验证
    },
    method: 'GET', //根据 API 提供的访问方法而定
    mode: 'cors',
    

(正文结束。芝士就是力量!