解决nginx跨域问题

解决nginx跨域问题

1. 没法跨域现象

访问请求外域URL没法访问，浏览器认为访问外域URL不安全，致使访问不了简称跨域问题。以下图：

2. 参数说明

#context配置段: server, location

Access-Control-Allow-Origin
    注释："表示容许访问的外域URI"
Access-Control-Allow-Origin:*
    注释：""*"容许访问任何外域URL"
Access-Control-Allow-Methods
    注释："首部字段用于预检请求的响应。其指明了实际请求所容许使用的 HTTP 方法"
Access-Control-Allow-Credentials
    注释："表示是否容许发送Cookie。默认状况下，Cookie不包括在CORS请求之中。设为true，即表示服务器明确许可，Cookie能够包含在请求中，一块儿发给服务器。这个值也只能设为true，若是服务器不要浏览器发送Cookie，删除该字段便可"

3. Nginx容许跨域配置方法

A 1.容许单域名跨域
    add_header 'Access-Control-Allow-Origin' 'http://ky.test.com';
    add_header 'Access-Control-Allow-Credentials' 'true';
    add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS';

B 2.容许多域名跨域
    #nginx跨域配置
    #配置段context: http
    #map指令用来建立变量，仅在变量被接受的时候执行视图映射操做
    map $http_origin $corsHost {
    #默认值，当没有设置 default，将会用一个空的字符串做为默认的结果
    default 0;
    "~http://ky.test1.com" http://ky.test1.com;
    "~https://ky.test1.com" https://ky.test1.com;
    "~http://ky.dev1.com" http://ky.dev1.com;
    "~https://ky.dev1.com" https://ky.dev1.com;
    }

    #配置段context: server, location
    add_header 'Access-Control-Allow-Origin' '$corsHost';
    add_header 'Access-Control-Allow-Credentials' 'true';
    add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS';

C 3.容许来自任何域的访问
    add_header Access-Control-Allow-Origin '*';

4. 重载nginx并测试

#重载nginx
nginx -t
nginx -s reload

#跨域测试
见下图标红内容 ↓