今天做一個AJAX案例時,瀏覽器監控到如下錯誤:
XMLHttpRequest cannot load http://54.169.69.60:8081/process_message. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://54.169.69.60' is therefore not allowed access.
網站地址是 http://54.169.69.60/qnow/ 而 AJAX URL 是 http://54.169.69.60:8081/process_message,兩個端口不一致,因此要跨域。
Access-Control-Allow-Origin是HTML5中定義的一種服務器端返回Response header,用來解決資源(比如字體)的跨域權限問題。
它定義了該資源允許被哪個域引用,或者被所有域引用(google字體使用*表示字體資源允許被所有域引用)。
解決方法:
根據錯誤信息可知,必須給 header 加上頭部 Access-Control-Allow-Origin,比如我的是 Node.js,這樣寫:
response.type('application/json');
response.status(200);
response.append('Access-Control-Allow-Origin', "*");
if (err) {
response.json({ result: 'error', message: err });
}
else {
response.json({ result: 'success', message: res.message });
}
