CORS – 与Angular和Express的http选项错误

我正在尝试从Angularjs客户端向我的API进行POST,我在另一个域中运行的服务器上有这个configuration:

app.use(function(req, res, next) { res.setHeader('Access-Control-Allow-Origin', '*'); res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, OPTIONS, DETELE'); res.setHeader('Access-Control-Allow-Headers', '*'); next(); }); 

发送到服务器的标题是:

 OPTIONS /api/authenticate HTTP/1.1 Host: xxxx.herokuapp.com Connection: keep-alive Access-Control-Request-Method: POST Origin: http://127.0.0.1:5757 User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.93 Safari/537.36 Access-Control-Request-Headers: accept, content-type Accept: */* Referer: http://127.0.0.1:5757/login Accept-Encoding: gzip, deflate, sdch Accept-Language: en,es;q=0.8,gl;q=0.6,pt;q=0.4 

响应标题是:

 HTTP/1.1 403 Forbidden Server: Cowboy Connection: keep-alive X-Powered-By: Express Access-Control-Allow-Origin: * Access-Control-Allow-Methods: GET, POST, PUT, OPTIONS, DETELE Access-Control-Allow-Headers: X-Requested-With,content-type,Authorization Content-Type: application/json; charset=utf-8 Content-Length: 47 Etag: W/"2f-5f255986" Date: Sun, 20 Sep 2015 19:26:56 GMT Via: 1.1 vegur 

而我在Chrome控制台中得到的是:

 angular.js:9814 OPTIONS http://xxxxx.herokuapp.com/api/authenticate XMLHttpRequest cannot load http://xxxx.herokuapp.com/api/authenticate. Response for preflight has invalid HTTP status code 403 

事实上,大多数安全原则的浏览器都不允许客户端的js代码从同一主机请求资源。

但是,当资源所有者通过添加跨源资源共享标头来响应客户端浏览器告知其共享资源时,这是允许的。

为了不用猜测头使用Cors包 – 它会为你做所有肮脏的工作。

 npm install cors --save 

接着:

 var express = require('express') , cors = require('cors') , app = express(); app.use(cors()); 

就这样 :)

其他文档在这里: https : //www.npmjs.com/package/cors

我看到,这个话题有点老,但是我在ACCESS-CONTROL-ALLOW-METHODS发现了一个小小的错字。

只是想分享这与其他用户有一个类似的问题,当他们复制和粘贴:

 Access-Control-Allow-Methods: GET, POST, PUT, OPTIONS, DETELE 

DELETE有一个错字。