我正在尝试在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