如何在 node.js 上的快速.js框架中启用跨源资源共享 (CORS)



我正在尝试在node.js中构建一个Web服务器,它将支持跨域脚本,同时仍然提供来自公共目录的静态文件。我正在使用快递.js并且不确定如何允许跨域脚本(Access-Control-Allow-Origin: *)。

我看到了这篇文章,我觉得没有帮助。

var express = require('express')
  , app = express.createServer();
app.get('/', function (req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    next();
});
app.configure(function () {
    app.use(express.methodOverride());
    app.use(express.bodyParser());
    app.use(app.router);
});
app.configure('development', function () {
    app.use(express.static(__dirname + '/public'));
    app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});
app.configure('production', function () {

    var oneYear = 31557600000;
    //    app.use(express.static(__dirname + '/public', { maxAge: oneYear }));
    app.use(express.static(__dirname + '/public'));
    app.use(express.errorHandler());
});
app.listen(8888);
console.log('express running at http://localhost:%d', 8888);

查看 enable-cors.org 的示例:

在 node.js 上的 ExpressJS 应用程序中,对路由执行以下操作:

app.all('/', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  next();
 });
app.get('/', function(req, res, next) {
  // Handle the get for this route
});
app.post('/', function(req, res, next) {
 // Handle the post for this route
});

第一次调用 ( app.all ) 应在应用中的所有其他路由(或至少要启用 CORS 的路由)之前进行。

[编辑]

如果您希望静态文件也显示标头,请尝试以下操作(确保它在调用use(express.static())之前:

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  next();
});

我用你的代码测试了这一点,并从public目录中获取了资产的标头:

var express = require('express')
  , app = express.createServer();
app.configure(function () {
    app.use(express.methodOverride());
    app.use(express.bodyParser());
    app.use(function(req, res, next) {
      res.header("Access-Control-Allow-Origin", "*");
      res.header("Access-Control-Allow-Headers", "X-Requested-With");
      next();
    });
    app.use(app.router);
});
app.configure('development', function () {
    app.use(express.static(__dirname + '/public'));
    app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});
app.configure('production', function () {
    app.use(express.static(__dirname + '/public'));
    app.use(express.errorHandler());
});
app.listen(8888);
console.log('express running at http://localhost:%d', 8888);

当然,您可以将函数打包到一个模块中,这样您就可以执行类似操作。

// cors.js
module.exports = function() {
  return function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    next();
  };
}
// server.js
cors = require('./cors');
app.use(cors());

遵循@Michelle Tilley 解决方案,显然它一开始对我不起作用。不知道为什么,也许我正在使用chrome和不同版本的节点。在做了一些小的调整后,它现在对我有用。

app.all('*', function(req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
  res.header('Access-Control-Allow-Headers', 'Content-Type');
  next();
});

如果有人面临与我类似的问题,这可能会有所帮助。

尝试使用这个 cors npm 模块。

var cors = require('cors')
var app = express()
app.use(cors())

该模块提供了许多功能来微调 cors 设置,例如域白名单、为特定 API 启用 cors 等。

我使用这个:

var app = express();
app
.use(function(req, res, next){
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Headers', 'X-Requested-With');
    next();
})
.options('*', function(req, res, next){
    res.end();
})
;
h.readFiles('controllers').forEach(function(file){
  require('./controllers/' + file)(app);
})
;
app.listen(port);
console.log('server listening on port ' + port);

此代码假定控制器位于控制器目录中。 此目录中的每个文件应如下所示:

module.exports = function(app){
    app.get('/', function(req, res, next){
        res.end('hi');
    });
}

建议使用 cors express 模块。这允许您将域列入白名单,允许/限制专门针对路由的域等,

如果要

通过"凭据"使用"cookie",则必须设置Access-Control-Allow-Credentials: true

app.all('*', function(req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Credentials', true);
  res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
  res.header('Access-Control-Allow-Headers', 'Content-Type');
  next();
});
app.use(function(req, res, next) {
var allowedOrigins = [
  "http://localhost:4200"
];
var origin = req.headers.origin;
console.log(origin)
console.log(allowedOrigins.indexOf(origin) > -1)
// Website you wish to allow to
if (allowedOrigins.indexOf(origin) > -1) {
  res.setHeader("Access-Control-Allow-Origin", origin);
}
// res.setHeader("Access-Control-Allow-Origin", "http://localhost:4200");
// Request methods you wish to allow
res.setHeader(
  "Access-Control-Allow-Methods",
  "GET, POST, OPTIONS, PUT, PATCH, DELETE"
);
// Request headers you wish to allow
res.setHeader(
  "Access-Control-Allow-Headers",
  "X-Requested-With,content-type,Authorization"
);
// Set to true if you need the website to include cookies in the requests sent
// to the API (e.g. in case you use sessions)
res.setHeader("Access-Control-Allow-Credentials", true);
// Pass to next layer of middleware
next();

});

将此代码添加到索引.js或服务器.js文件中,并根据需要更改允许的源数组。

我需要采取的另一个步骤是将我的URL从http://localhost切换到http://127.0.0.0

相关内容

  • 没有找到相关文章

最新更新