节点js路由期间的CORS问题

我想连接我的angular度应用程序到我的节点服务器,我不想保留我的路线在服务器文件,所以我有一个节点服务器文件,看起来像这样

var express = require('express'); var path = require('path'); var bodyParser = require('body-parser'); var morgan = require('morgan'); var app = express(); var router = express.Router(); var port = process.env.PORT || 3000; var mongoose = require('mongoose'); var cors = require('cors'); app.use(cors()) var db ='mongodb://localhost:27017/demo' mongoose.connect(db,function(err){ if(err){ console.log("err"); } else{ console.log("coonected to db"); } }) app.use(bodyParser.urlencoded({ extended: false })); app.use(bodyParser.json()); app.use(morgan('dev')); app.set('views', path.join(__dirname,'views')); app.set('view engine','ejs'); app.engine('html',require('ejs').renderFile); app.use(express.static(path.join(__dirname,'app'))); app.use(bodyParser.json()); app.use(bodyParser.urlencoded({extended:false})); app.get('/',function(req,res){ console.log("you have reached server"); res.json('wtf'); }) module.exports = app; require('./route.js'); app.listen(port); 

在route.js我有我的这样的路线

  var login = require ('./api/login'); var app = require('./server') app.get('/login',login.authenticate); 

它工作正常,如果我在节点服务器上使用它,但如果我在angular度服务器上使用它显示此错误:

从“localhost:3000 / login”redirect到“localhost:3000 / login /”已被CORS策略阻止:在请求的资源上没有“Access-Control-Allow-Origin”头。 因此原产地'本地主机:4200'不允许访问。

 It only happens to the routes that I define in `route.js`. If I define the same route in `server.js` they work fine. PS: I have also used app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin", '*'); res.header("Access-Control-Allow-Credentials", true); res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS'); res.header("Access-Control-Allow-Headers", 'Origin,X-Requested-With,Content-Type,Accept,content-type,application/json'); next(); }); and some variation of this code but nothing works if I want to route to login url which is in my route file 

您在route.js和server.js中的应用程序不会引用相同的内容。 因此,你的“应用程序”不能在routes.js中工作。 如果你想在routes.js中使用app = express(),你可以在server.js中添加这样的内容

 var Routes = require('./routes.js'); var r = new Routes(app); 

所以为了像这样实例化路由,您的routes.js应该如下所示:

 module.exports = function(app){ var login = require ('./api/login'); app.get('/login',login.authenticate); ... } 

老答案:

正如@Auurag Singh Bisht也回答你应该允许跨域请求。 我的答案略有不同:

 app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin", '*'); res.header("Access-Control-Allow-Credentials", true); res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS'); res.header("Access-Control-Allow-Headers", 'Origin,X-Requested-With,Content-Type,Accept,content-type,application/json'); next(); }); 

您需要allow cross origin服务器中的allow cross origin ,以便您的前端可以访问它。

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

您需要添加以下代码来处理从浏览器发送的preflight请求。

 const cors = require('cors') const corsOptions = { origin: '*' } app.use(cors(corsOptions)) app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin", '*'); res.header("Access-Control-Allow-Credentials", true); res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS'); res.header("Access-Control-Allow-Headers", 'Origin,X-Requested-With,Content-Type,Accept,content-type,application/json'); next(); });