CORS预检请求后302重定向到nodejs服务器

Question

我尝试构建一个平台，它由两个独立的部分组成：后端和前端。\n后端由 Express.js 和 Passport.js 提供支持。它可以通过 localhost:3000 获得。\n前端使用 Googlespolymer-1.0 并在 localhost:8001 上运行。

\n\n

我想在我的后端完成所有 API 工作。Ui调用并从后端获取数据。

\n\n

当尝试对我的后端路由进行 Iron-ajax 授权请求时，我收到 CORS 错误：

\n\n

XMLHttpRequest 无法加载 http://localhost:3000/auth/facebook。\n请求已重定向到 \'https://www.facebook.com/v2.2/dialog/oauth?response_type=code&redirect_uri=\xe2\x80\ xa6%3A3000%2Fauth%2Ffacebook%2Fcallback&scope=email&client_id=0815\', \n对于需要预检的跨域请求是不允许的。

\n\n

用户界面片段：

\n\n

\n\niron-ajax\n id="login"\n url=""\n method="GET"\n headers=\'{"X-Requested-With": "XMLHttpRequest"}\'\n 句柄-as="json"\n on-response="hresponse"\n debounce-duration="300">\n/iron-ajax>\n\n\n_handleTap: function () {\n var url = \' http://localhost:3000/auth/\' + this.service;\n this.$.login.url = url;\n this.$.login.generateRequest(); \n},\n

\n\n

后端片段：

\n\n

\napp.get(\'/auth/facebook\', Passport.authenticate(\'facebook\', { range: \'email\' }));\n\napp.get(\'/auth/facebook/ callback\', Passport.authenticate(\'facebook\'), function(req, res) {\n res.status(200).json({\n success: true,\n message: \'享受！\' ,\n 重定向: \'/route/to/nowhere\',\n }).end();\n });\n\n

\n\n

如您所见，我只是使用Passport.js 文档中的简单 Facebook 身份验证片段。

\n\n

已处理 2 个请求：\n预检：

\n\n

\n响应\nHTTP/1.1 200 OK\nX-Powered-By: Express\nAccess-Control-Allow-Origin: *\nAccess-Control-Allow-Headers: Origin、X-Requested-With、Content-Type、Accept\nAllow : GET,HEAD\n内容类型：text/html；charset=utf-8\n内容长度：8\nETag：W/"8-8ww6QOmj5lyGjHVKXelZGQ"\n日期：2016 年 1 月 26 日星期二 12:59:20 GMT\n连接：保持活动\n\nREQUEST\nOPTIONS /auth/ facebook HTTP/1.1\n主机：localhost:3000\n连接：保持活动\n访问控制请求方法：GET\n来源：http://localhost:8001\n用户代理：Mozilla/5.0（Macintosh；Intel Mac OS X 10_11_3) AppleWebKit/537.36 (KHTML，如 Gecko) Chrome/47.0.2526.111 Safari/537.36\nAccess-Control-Request-Headers: 接受，x-requested-with\n接受： */*\nDNT: 1\nReferer: http ://localhost:8001/\n接受编码: gzip, deflate, sdch\n接受语言: de-DE,de;q=0.8,en-US;q=0.6,en;q=0.4\n

\n\n

得到：

\n\n

\n响应\nHTTP/1.1 302 找到\nX-Powered-By: Express\nAccess-Control-Allow-Origin: *\nAccess-Control-Allow-Headers: Origin、X-Requested-With、Content-Type、Accept\nLocation ：https://www.facebook.com/v2.2/dialog/oauth?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fauth%2Ffacebook%2Fcallback&scope=email&client_id=0815\n内容长度：0\n日期： 2016 年 1 月 26 日星期二 12:59:20 GMT\n连接：保持活动\n\nREQUEST\nGET /auth/facebook HTTP/1.1\n主机：localhost:3000\n连接：保持活动\naccept：application/json\ nOrigin：http://localhost:8001\nx-requested-with：XMLHttpRequest\nUser-Agent：Mozilla/5.0（Macintosh；Intel Mac OS X 10_11_3）AppleWebKit/537.36（KHTML，如 Gecko）Chrome/47.0.2526.111 Safari/ 537.36\nDNT: 1\n引用者: http://localhost:8001/\n接受编码: gzip, deflate, sdch\n接受语言: de-DE,de;q=0.8,en-US;q=0.6,en ;q=0.4\n

\n\n

我的 Node.js 服务器也接受 CORS 请求

\n\n

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

\n\n

当使用 localhost:3000/auth/facebook 作为链接时，我从后端和端口 3000 获取 json 响应，但这不是我想要的。

\n\n

是否有可能通过自己的 API 接口（例如我的）来处理此类 API 请求？目前我在这里看到了一个大场面。

\n\n

谢谢 & BR;\nandre

\n

Answer 1

您需要以这种方式将此中间件添加到您的所有请求中

app.all('/*', function(req, res, next) {
  res.header('Access-Control-Allow-Origin', req.headers.origin || '*');
  res.header('Access-Control-Allow-Methods', 'GET,POST,PUT,HEAD,DELETE,OPTIONS');
  res.header('Access-Control-Allow-Headers', 'content-Type,x-requested-with');
  next();
});

就像这里解释的How to allowed CORS in Express/Node.js?