101

我已经在 node.js 的 express 框架上编写了一个 REST API,它适用于来自 Chrome 中的 js 控制台和 URL 栏等的请求。我现在正试图让它在另一个应用程序上处理来自另一个应用程序的请求域(CORS)。

javascript 前端自动发出的第一个请求是到 /api/search?uri=,并且似乎在“预检”OPTIONS 请求上失败。

在我的快递应用程序中,我正在添加 CORS 标头,使用:

var allowCrossDomain = function(req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
    res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');

    // intercept OPTIONS method
    if ('OPTIONS' == req.method) {
      res.send(200);
    }
    else {
      next();
    }
};

和:

app.configure(function () {
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);
  app.use(allowCrossDomain);
  app.use(express.static(path.join(application_root, "public")));
  app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});

从 Chrome 控制台我得到这些标题:

请求网址:http://furious-night-5419.herokuapp.com/api/search?uri=http%3A%2F%2Flocalhost%3A5000%2Fcollections%2F1%2Fdocuments%2F1

请求方法:选项

状态码:200 OK

请求标头

Accept:*/*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:origin, x-annotator-auth-token, accept
Access-Control-Request-Method:GET
Connection:keep-alive
Host:furious-night-5419.herokuapp.com
Origin:http://localhost:5000
Referer:http://localhost:5000/collections/1/documents/1
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_4) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.56 Safari/536.5

查询字符串参数

uri:http://localhost:5000/collections/1/documents/1

响应标头

Allow:GET
Connection:keep-alive
Content-Length:3
Content-Type:text/html; charset=utf-8
X-Powered-By:Express

这看起来像 API 应用程序发送的缺少正确的标头吗?

谢谢。

4

6 回答 6

66

我已经在一个干净的 ExpressJS 应用程序上检查了你的代码,它工作得很好。

尝试将您的移动app.use(allowCrossDomain)到配置功能的顶部。

于 2012-06-15T20:16:14.497 回答
5

我之所以将其添加为答案,只是因为原始帖子是作为评论放入的,因此当我第一次浏览此页面时,它确实被您忽略了。

正如@ConnorLeech 在他对上述已接受答案的评论中指出的那样,有一个非常方便的 npm 包,毫不奇怪,名为 cors。它的使用很简单var cors = require('cors'); app.use(cors());(同样,抄自 Leech 先生的回答),也可以按照他们的文档中所述的更严格、更可配置的方式应用。

可能还值得指出的是,我上面提到的原始评论是在 2014 年发表的。现在是 2019 年,查看npm 包的 github 页面,repo 是在 9 天前更新的。

于 2019-06-06T02:35:57.697 回答
4

要支持带有凭据的 cookie,您需要此行 xhr.withCredentials = true;

mdn 文档 xhr.withCredentials

在 Express Server 中,将此块添加到所有其他块之前

`app.all('*', function(req, res, next) {
     var origin = req.get('origin'); 
     res.header('Access-Control-Allow-Origin', origin);
     res.header("Access-Control-Allow-Headers", "X-Requested-With");
     res.header('Access-Control-Allow-Headers', 'Content-Type');
     next();
});`
于 2016-09-15T08:08:24.437 回答
2

在此处输入图像描述

请按照以下步骤操作:

npm install cors --save

在你的根 js 文件中:

 var express = require('express') 
 var cors = require('cors')
 var app = express()
 app.use(cors())
于 2020-09-10T18:19:30.657 回答
1

对于大多数浏览此问题的人来说,情况并非如此,但我遇到了完全相同的问题,并且解决方案与CORS.

原来 JSON Web Token secretstring没有在环境变量中定义,因此无法对令牌进行签名。这导致任何POST依赖检查或签署令牌以获得超时并返回503错误的请求,告诉浏览器有问题CORS,但事实并非如此。在 Heroku 中添加环境变量解决了这个问题。

我希望这可以帮助别人。

于 2017-07-18T00:05:17.900 回答
0

Cors 错误可能掩盖了您的实际错误。查看您的 heroku 构建日志以查看您潜在的真正错误。我的是这个。

Heroku Postgres:“psql:致命:主机没有 pg_hba.conf 条目”

于 2021-04-21T23:40:18.790 回答