這兩天一直在研究ajax呼叫跨域的問題處理，使用了多種方法都無法解決，網上看了很多列子要麼不全要麼不符合要求，要麼實驗後無法調通，比如使用jsonp（只支援get請求），但是我們系統必須要用post請求，在後臺加允許跨域（'Access-Control-Allow-Origin' '*';）也是不行，因為需要經過閘道器轉發到後臺，閘道器不允許設定跨域，候來考慮用nginx或者zuul，nginx和zuul都可以實現nginx相對來說比較麻煩些，zuul加入pom.xml的依賴和加app.properties的配置就行，下面我們來詳細說明下實現過程，以做記錄後續參考。

1，請求呼叫的ajax方法，post的data引數需要用JSON.stringify格式化，不然請求傳送過去的data是無法識別

function loginOauth(){
    var dataValue= [{
        'client_id':'xxxxxxxxxxxxxxxxxxx',
        'response_type':'code',
        'redirect_uri':'http://xx.xxx.com:8181/html/index.html'
    }];
    // alert(JSON.stringify(dataValue));
    $.ajax({
        type: 'POST',
        timeout: 30000, // 超時時間 10 秒
        contentType: 'application/json',
        headers: {
            'CallerModule' : 'xxx',
            'CallerModuleVersion' : '1.0.0',
            'Content-Type':'application/json'
        },
        url: 'http://10.200.47.231:8287/OAuth2/authorize',
        data: JSON.stringify(dataValue) ,
        success: function(data) {
            alert(data);
            $(location).attr('href', data);
        },
        error: function(err) {
            console.log(err);
        },
        complete: function(XMLHttpRequest,status) { //請求完成後最終執行引數　
            // alert(JSON.stringify(XMLHttpRequest));
            var ajaxobj=eval("("+JSON.stringify(XMLHttpRequest)+")");
            console.log('data='+ajaxobj.responseText);
            var dataobj=eval("("+ajaxobj.responseText+")");
            console.log('data='+dataobj.data);
            // alert(status);
            $(location).attr('href', dataobj.data);
        }
    });

}
 

2，nginx的配置如下，windows啟動nginx到nginx的安裝目錄執行start nginx，停止執行nginx.exe -s quit   

server {
        listen       8287;    # nginx的埠扣
        #access_log  logs/host.access.log  main;
        add_header Access-Control-Allow-Origin *;  # 允許跨域
        location / {                          #nginx的過濾路徑
           if ($request_method = 'OPTIONS') {
                add_header 'Access-Control-Allow-Origin' '*';   # 允許跨域的鬱悶
                add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
                add_header 'Access-Control-Allow-Headers' '*';  # 允許設定的請求頭
                add_header 'Access-Control-Max-Age' 1728000;
                add_header 'Content-Type' 'text/plain charset=UTF-8';
                add_header 'Content-Length' 0;
                return 204;
            }
            if ($request_method = 'POST') {
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
            add_header 'Access-Control-Allow-Headers' '*'; 
            add_header 'Access-Control-Expose-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Content-Range,Range';
            }    
            proxy_pass https://xx-di1.xx.xx.com/;   #需要請求的目標伺服器地址
        }
    
    }