CORS標頭「訪問控制允許來源」 localhost上

製作到不同的端口的請求時缺少我有一個節點的網絡服務器（表達）在端口6000運行。CORS標頭「訪問控制允許來源」 localhost上

當調用http://localhost:6000/，index.html供應到具有腳本，logic.js運行客戶端：

var xhr = new XMLHttpRequest(); 
var url = 'http://localhost:4000/endpoint'; 
xhr.open('POST', url, true); 
xhr.setRequestHeader('Content-type', 'application/json'); 
xhr.onreadystatechange = function() { 
    if (xhr.readyState === 4 && xhr.status === 200) { 
    console.log('endpoint'); 
    callback(xhr.responseText); 
    } 
}; 
xhr.send(JSON.stringify({'key': 'value'}));

有端口4000運行的另一個Express服務器。

服務器建立它簡單的返回請求主體提交的內容端點：

app.route('/segment') 
    .post(bodyParser.json(), function(req, res) { 
    res.set('Access-Control-Allow-Origin', '*'); 
    res.send(req.body); 
});

當我訪問http://localhost:6000/，我看到這個在瀏覽器控制檯：

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:4100/segment. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing)

有在原型製作過程中繞過這一點的一種方式？

來源

2017-02-16 bobbyrne01

你的終點可能不提供其使用的瀏覽器來檢查CORS標頭（他們讓真正的請求之前）的OPTIONS HTTP方法。

如果您需要在研發和生產不同的CORS頭，我認爲最好的辦法是增加一個新的後端配置選項與允許起源的價值和一些全球響應濾波器爲他們服務。

來源

2017-02-16 10:21:03

您已設置xhr.setRequestHeader('Content-type', 'application/json');所以這是一個preflighted request（經驗法則：內容類型是不是爲enctype屬性的HTML表單將觸發預檢請求的有效值）。

你的服務器端代碼只設置Access-Control-Allow-Origin頭以響應POST請求。您需要編寫服務器端代碼來響應預檢OPTIONS請求。

來源

2017-02-16 10:21:38 Quentin

下面是解決這個問題的一些方法：

最佳：CORS頭（需要服務器的更改）

CORS（跨來源資源共享）是服務器說的方式「我會接受你的請求，即使你來自不同的來源。「這需要服務器的合作 - 所以如果你不能修改服務器（例如，如果你使用的是外部API），這種方法將不起作用。

修改服務器添加頁眉訪問控制允許來源：*從任何地方實現跨域請求（或指定域名，而不是*）。這應該可以解決你的問題。

第二選擇：代理服務器

如果不能修改服務器，你可以運行自己的代理。如果這個代理與您的頁面不在同一個原始位置，它可以返回Access-Control-Allow-Origin標頭。相反，發送API請求一些遠程服務器的

，你會是請求您的代理，將它們轉發到遠程服務器。這裏有幾個代理選項。

第三選擇：JSONP（需服務器支持）

如果CORS和代理服務器不爲你工作，JSONP可能會有幫助。你基本上是做一個回調參數的GET請求：

（獲得）http://api.example.com/endpoint?callback=foo 服務器將包裝在一個函數調用中的JSON回覆您的回調，在那裏你可以處理它：

富（{「你「：」json「，here：true}）有一些缺點，特別是JSONP僅支持GET請求，並且您仍然需要協作服務器。

來源

2017-02-16 10:23:09

CORS標頭「訪問控制允許來源」 localhost上

回答

相關問題