nginx配置解决前端跨域

Question

假设接口域名A：http://www.aUrl.com
前端域名B：http://www.bUrl.cn

后台服务器大概十几台，做了负载均衡
前端这边有一些是B域名，访问A域名接口。也有一些是A域名，访问A域名接口。
也就是说存在同域也存在不同域。

大佬们知道怎么配置nginx配置吗，就是做反向代理解决跨域问题那个，需要两个域名都可以访问那个接口。

有做运维的老哥也可以讲讲，我知道这个方法能解决跨域但是我不会写服务器配置，我和公司运维说了他好像也不大明白，不知道怎么加配置。

Answer 1

参考： https://blog.csdn.net/u013084... 浏览器的跨域问题以及解决方案
参考： https://segmentfault.com/a/11... 前端常见跨域解决方案（全）

jquery的ajax的post方法请求：

$.ajax(
{
    type : "POST",
    url : "http://xxx.com/api/test",
    dataType : 'json',
    xhrFields :
    {
        withCredentials : true
    },
    crossDomain : true,
    success : function ()  {},
    error : function ()  {}
})


服务器端设置：
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Origin: http://www.xxx.com");



php代码端设置
if (isset($_SERVER['HTTP_ORIGIN'])) {
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Origin: " . $_SERVER['HTTP_ORIGIN']);
header("Access-Control-Allow-Headers: *, X-Requested-With, Content-Type");
header("Access-Control-Allow-Methods: GET, POST, DELETE, PUT");
}

解决前端跨域
回归正题, 修改nginx.conf文件如下:

    #进程, 可更具cpu数量调整
worker_processes  1;

events {
    #连接数
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;

    #连接超时时间，服务器会在这个时间过后关闭连接。
    keepalive_timeout  10;

    # gizp压缩
    gzip  on;

    # 直接请求nginx也是会报跨域错误的这里设置允许跨域
    # 如果代理地址已经允许跨域则不需要这些, 否则报错(虽然这样nginx跨域就没意义了)
    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Headers X-Requested-With;
    add_header Access-Control-Allow-Methods GET,POST,OPTIONS;

    # srever模块配置是http模块中的一个子模块，用来定义一个虚拟访问主机
    server {
        listen       80;
        server_name  localhost;
        
        # 根路径指到index.html
        location / {
            root   html;
            index  index.html index.htm;
        }

        # localhost/api 的请求会被转发到192.168.0.103:8080
        location /api {
            rewrite ^/b/(.*)$ /$1 break; # 去除本地接口/api前缀, 否则会出现404
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_pass http://192.168.0.103:8080; # 转发地址
        }
        
        # 重定向错误页面到/50x.html
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

    }

}

nginx -s reload 重新载入nginx配置.

Answer 2

都是访问A域名接口，A服务器配置下CORS：Acess-Control-Allow-Origin 和 Access-Control-Allow-Credentials 就好了吧。
要做反向代理，那就得是B域名接口请求B域名服务器，再proxy_pass反向代理到A服务器。怪麻烦的。