javascript - CORS 頭缺少 'Access-Control-Allow-Origin'如何解決？

Question

{代碼...} 火狐上運行，出現如下報錯訊息。已攔截跨來源要求：同源策略禁止讀取位於 https://openapi.lechange.cn/o... 的遠端資源。 （原因：CORS 頭缺少 'Access-Control-Allow-Origin'）。網上搜解決辦法是，在被...

天蓬老师 · Answer

CORS一般不需要在瀏覽器配置，瀏覽器發現這次跨源AJAX請求是簡單請求，就自動在頭信息之中，添加一個Origin字段，Origin字段用來說明，本次請求來自哪個源（協議+ 域名+ 連接埠）。
伺服器根據這個值，決定是否同意這次請求，也就是說伺服器會存在一份白名單，說明哪一些來源是可以被允許的，而Access-Control-Allow-Origin就是包含在回應頭裡的白名單。
瀏覽器發現，這個回應的頭信息沒有包含Access-Control-Allow-Origin字段，就知道出錯了，從而拋出一個錯誤，也就是你遇到的提示，是返回結果被瀏覽器攔截了，而不是請求發不出。

所以你需要的是在伺服器上配置這個白名單，而不是更改頁面。

關於CORS的原理可以看參考這篇
關於tomcat如何設定可以看這篇文件

仅有的幸福 · Answer

跨域可以使用jsonp嘛

$.ajax({
    url: 'https://openapi.lechange.cn/openapi/accessToken',
    type: 'post',
    dataType:'jsonp',
    data: '{"system":{"ver":"1.0","sign":"5326bdd79317a8cd215b649e75e042b6","appid":"lace1fdddaa5de4393","time":"1491895621","nonce":"49735441495760803893403522385895","appSecret":"6d5c2c727dbb4ba78fac5a0e9ece82"},"params":{"phone":"17691260000"},"id":"80"}',
    success:function(data){
       console.log(data);
     },
})

高洛峰 · Answer

cors不需要前端配置，讓你們後台工程師在伺服器上配置

高洛峰 · Answer

Nginx 新增 header 支援

ringa_lee · Answer

用node或python寫個爬蟲中轉要嘛就加代理

淡淡烟草味 · Answer

在伺服器端入口檔案最上面貼上如下程式碼

上線後最好把 Access-Control-Allow-Origin: * 的 * 改為允許訪問的特定網域

header('Access-Control-Allow-Origin:*');
header('Access-Control-Allow-Methods:HEAD,GET,POST,OPTIONS,PATCH,PUT,DELETE');
header('Access-Control-Allow-Headers:Origin,X-Requested-With,Authorization,Content-Type,Accept,Z-Key');