Cross-Origin Resource Sharing (CORS) 跨域,一个网站引用了另外一个网站的资源,就需要跨域了。

最通俗点,就是服务器的返回头上要加上三行:

Access-Control-Allow-Origin", "*"
Access-Control-Allow-Methods", "GET, POST, OPTIONS"
Access-Control-Allow-Headers", "DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization"

说白点:就是允许的来源站,允许的方法,允许的头信息

那在不同的地方配置又不相同:

一、Nginx
    server {
        add_header Access-Control-Allow-Origin *;
        add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
        add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
二、openresty中的lua脚本
location /pg/nginit {
    rewrite_by_lua_block {
        ngx.log(ngx.ERR, "Environment configuration update, about to get configuration information from redis")
 
        -- 添加跨域 CORS 头
        ngx.header["Access-Control-Allow-Origin"] = "*"  -- 允许所有域名请求
        ngx.header["Access-Control-Allow-Methods"] = "GET, POST, OPTIONS"  -- 允许的方法
        ngx.header["Access-Control-Allow-Headers"] = "DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization"  -- 允许的请求头
三、AWS的S3
<CORSConfiguration>
  <CORSRule>
    <AllowedOrigin>http://example.com</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
  </CORSRule>
</CORSConfiguration>
四、AWS Lambda 或者 API Gateway
headers: {
  'Access-Control-Allow-Origin': '*',
  'Access-Control-Allow-Credentials': true,
}

最后,AWS的ALB不支持配置CORS!!!,必须在后端的 application 中设置。