Node JS Express 服务器 - 跨域请求被阻止,即使有所有正确的标头

Posted

技术标签:

【中文标题】Node JS Express 服务器 - 跨域请求被阻止,即使有所有正确的标头【英文标题】:Node JS Express Server - Cross Origin Request Blocked, even with all the correct headers 【发布时间】:2018-11-05 15:55:10 【问题描述】:

尽管我的 nodejs 服务器中有正确的标头:

app.get('/api', function(req, res)
    res.header('Access-Control-Allow-Origin'. '*');
    res.header('Access-Control-Allow-Methods', 'GET');
    res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');

    res.status(200).send('a':'b');
);

当我在 Firefox 浏览器中发出请求时,我仍然收到错误消息:

“跨域请求被阻止:同源策略不允许读取位于http://www.example.com/api/ 的远程资源。(原因:CORS 标头‘Access-Control-Allow-Origin’缺失)。”

这是我在客户端发出请求的方式:

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function()
    if(this.readyState === 4 && this.status === 200)
        console.log(this.response);
    
;
xhr.open('GET', 'http://www.example.com/api', true);
xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
xhr.setRequestHeader('Access-Control-Allow-Methods', 'GET');
xhr.setRequestHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
xhr.send(null);

【问题讨论】:

你知道Access-Control-Allow-Origin', '*' 只是服务器端的吗?你为什么把它设置在你的客户端上? 尝试使用github.com/expressjs/cors。我怀疑它在 EXPRESS 级别被阻止并且没有到达您的路由处理程序 在发出 xhr 请求时,您不必设置任何标头。而且您的快速代码中有错字。 res.header('Access-Control-Allow-Origin','*'); 在这里找到我的答案:***.com/questions/20433655/…谢谢 【参考方案1】:

不要在客户端设置“Access-Control-Allow-Origin”,它应该只在服务器端添加。所以,服务器知道接受来自所有来源的请求。

【讨论】:

【参考方案2】:

你可以试试cors模块和express

var express = require('express');
var cors = require('cors');
var app = express();

var corsOptions = 
  origin: 'http://example.com',
  optionsSuccessStatus: 200 // some legacy browsers (IE11, various SmartTVs) choke on 204


app.use(cors(corsOptions));

app.listen(80, function () 
  console.log('CORS-enabled web server listening on port 80')
)

如果你想要特定的域。

var express = require('express');
var cors = require('cors');
var app = express();

var allowlist = ['http://example1.com', 'http://example2.com']
var corsOptionsDelegate = function (req, callback) 
  var corsOptions;
  if (allowlist.indexOf(req.header('Origin')) !== -1) 
    corsOptions =  origin: true ; // reflect (enable) the requested origin in the CORS response
   else 
    corsOptions =  origin: false ; // disable CORS for this request
  
  callback(null, corsOptions); // callback expects two parameters: error and options


app.get('/products/:id', cors(corsOptionsDelegate), function (req, res, next) 
  res.json(msg: 'This is CORS-enabled for an allowed domain.');
);

app.listen(80, function () 
  console.log('CORS-enabled web server listening on port 80');
);

更多详情click here

HTH

【讨论】:

以上是关于Node JS Express 服务器 - 跨域请求被阻止,即使有所有正确的标头的主要内容,如果未能解决你的问题,请参考以下文章

Node.js---使用Express写接口

node跨域cors模块,nodejs+express跨域

Node.js express 跨域问题

Express.js - 跨域请求被阻止

Node.js+Express框架跨域解决方案

node.js express配置允许跨域