在HTML5中有一種新的跨域方式浪听,即設(shè)置“Access-Control-Allow-Origin”可以指定允許跨域訪問的域名篮条。
Node.js中可以這樣寫
app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", 'https://www.google.com');
res.header('Access-Control-Allow-Methods', 'POST, GET');
res.header('Access-Control-Allow-Headers', 'X-Requested-With');
res.header('Access-Control-Allow-Headers', 'Content-Type');
next();
});
但在實際使用中瘟芝,可能需要設(shè)置多個域名纲爸。
在網(wǎng)上查詢資料俱笛,有一種寫法
Access-Control-Allow-Origin: https://www.google.com,https://www.baidu.com
改成相應(yīng)的代碼捆姜,但是始終提示問題,只允許一個值迎膜。
于是換種方式泥技,查資料發(fā)現(xiàn),許多是先自己判斷域名是否是允許的磕仅,如果是再設(shè)置允許跨域訪問珊豹。那么代碼應(yīng)該改成如下形式
app.all('*', function(req, res, next) {
if( req.headers.origin == 'https://www.google.com' || req.headers.origin == 'https://www.baidu.com' ){
res.header("Access-Control-Allow-Origin", req.headers.origin);
res.header('Access-Control-Allow-Methods', 'POST, GET');
res.header('Access-Control-Allow-Headers', 'X-Requested-With');
res.header('Access-Control-Allow-Headers', 'Content-Type');
}
next();
});
使用時可以把允許訪問的域名寫成一個數(shù)組,然后JS寫一個比較字符串是否在數(shù)組內(nèi)的函數(shù)宽涌,這樣使用就比較方便了平夜。
其中,Access-Control-Allow-Origin
就是我們需要設(shè)置的域名卸亮,Access-Control-Allow-Methods
是允許的請求方式忽妒,Access-Control-Allow-Headers
跨域允許包含的頭。
兼容性