在服务器上部署 Angular 全栈应用程序时出现跨域源问题

Question

我这里真的是一窍不通；我在 GitHub、Google 和 Whosebug 上对这个问题进行了极端搜索，但没有解决。

我有一个 Angular Fullstack 生成器应用程序。这是构建如下：

Node -> Express -> Angular

我在这里没有做任何不寻常的事情；我的应用程序在我家里的开发机器上运行得很好。然而，一旦我构建了它，就将它缩小并通过节点而不是 grunt 在我的互联网服务器上启动它；我看到 html 呈现，css 加载，但在尝试进行身份验证时（我为此使用 express-jwt）；我到处都遇到跨域起源问题。

我在 npm 上使用 CORS 模块；那是一个不需要任何设置就能让一切通过的问题，所以不要将这个问题标记为重复，它不是；我可以向你保证！

服务器端的 app.js 基本上是这样构建的：

var express = require('express');
var app     = express();
var config  = require('./config/environment');
var cors    = require('cors');
var server  = require('http').createServer(app);

require('./config/express')(app);
require('./routes')(app);
require('./config/passport')(passport); 

app.use(cors());
app.options('*', cors()); 

require('./routes')(app, passport);

server.listen(config.port, config.ip, function () {
  console.log('Express server listening on %d, in %s mode', config.port, app.get('env'));
});

exports = module.exports = app;

这是我的浏览器向我显示的内容：

Cross-Origin-Request blocked: The Same-Origin-Policy....

我不明白 - 我根本 x-origin 没有要求任何东西。所有资源都驻留在我的服务器上。所有请求都来自一个浏览器。

回复中可以看到headers:

 access-control-allow-origin: *

然后当登录时，OPTIONS 请求被发送到本地主机而不是 FQDN，并立即以红色字母中止。

Answer 1

必须在路由之前调用Cors。这就是我一劳永逸地摆脱所有 CROSS Domain Origin 问题的方法：

var cors    = require('cors');

app.use(cors());
app.options('*', cors()); 

require('./routes')(app);

在服务器上部署 Angular 全栈应用程序时出现跨域源问题

Cross Domain Origin Problems when deploying Angular Full Stack App on Server

angularjs

express

angular-fullstack