嗨，我在使用 CORS 时遇到了问题。
一般结构：
Angular 4 将表单的数据发送到我的 api。 函数saveForm()在我发送有关表单联系人的信息时执行。
app.component.ts
saveForm() {
let headers = new Headers();
headers.append('Content-Type', 'application/json');
let requestOptions = new RequestOptions({ headers: headers });
// Encode JSON as string to exchange data to web server.
this.data = JSON.stringify(this.myContact);
this.http.post('https://pablocordovaupdated.herokuapp.com/api', this.data, requestOptions).subscribe(res => {
let result = res.json();
if(result['result'] == 'success') {
this.successMessage = true;
}
}
);
}
这是问题的根源，因为我正在使用POST和Content-Type->application/json来发送数据，并且根据定义，它给了我一个问题CORS-preflighted request，这里有更多定义： 关于预检请求的链接
这意味着在 angular 4 将数据发送到服务器之前，这会询问服务器是否可以使用动词OPTION接收我的数据，如果服务器的响应正常，则 angular 4 发送形式的数据。
问题：
在控制台中，我总是收到此错误消息：
选项 https://pablocordovaupdated.herokuapp.com/api 404(未找到)
XMLHttpRequest 无法加载 https://pablocordovaupdated.herokuapp.com/api。对印前检查的响应 请求未通过访问控制检查：否 "访问控制允许源"标头存在于请求的上 资源。因此，原产地"https://pablocordova.herokuapp.com"不是 允许访问。响应具有 HTTP 状态代码 404。
XHR 加载失败：开机自检 "https://pablocordovaupdated.herokuapp.com/api"。
错误响应 {_body： 进度事件， 状态： 0， 正常： 假， statusText： "， headers： Headers...}
我尝试过：
到目前为止，我知道这个问题是因为https://pablocordovaupdated.herokuapp.com/api没有返回动词OPTIONS的答案
然后我尝试通过两种方式解决此问题：
使用 cors包 CORS 包 我根据文档进行了配置。
var express = require('express');
var cors = require('cors');
...
var app = express();
...
app.options('/api', cors());
app.post('/api', cors(), function(req, res, next) {
// Proccess to send this data via email
// and also save in data base(only for learning)
});
但是我在控制台中遇到相同的错误。
通过 Discussion StackOverFlow 或 Discussion Github手动配置标头
该代码插入到我要编写标头的每个路由中，在我的例子中：
app.post('/api', function(req, res, next) {
if (req.method === 'OPTIONS') {
console.log('!OPTIONS');
var headers = {};
// IE8 does not allow domains to be specified, just the *
// headers["Access-Control-Allow-Origin"] = req.headers.origin;
headers["Access-Control-Allow-Origin"] = "*";
headers["Access-Control-Allow-Methods"] = "POST, GET, PUT, DELETE, OPTIONS";
headers["Access-Control-Allow-Credentials"] = false;
headers["Access-Control-Max-Age"] = '86400'; // 24 hours
headers["Access-Control-Allow-Headers"] = "X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept";
res.writeHead(200, headers);
res.end();
} else {
// Process to send this data via email
// and also save in data base(only for learning)
}
});
这里的问题是永远不要执行console.log('!OPTIONS');
在这里，我也尝试了简单的：
app.post('/api', function(req, res, next) {
console.log('!I AM YOUR FATHER');
...
});
但从未打印过。 注意：我试图用heroku logs看到这条消息，因为整个页面都在 Heroku 中。
但是这样做我也得到了同样的错误。
更多信息：
调用.../api时，我有此标头
**GENERAL**:
Request URL:https://pablocordovaupdated.herokuapp.com/api
Request Method:OPTIONS
Status Code:404 Not Found
Remote Address:23.21.185.158:443
Referrer Policy:no-referrer-when-downgrade
**RESPONSE HEADERS**:
HTTP/1.1 404 Not Found
Connection: keep-alive
Server: Cowboy
Date: Wed, 10 May 2017 04:14:45 GMT
Content-Length: 494
Content-Type: text/html; charset=utf-8
Cache-Control: no-cache, no-store
**REQUEST HEADERS**:
OPTIONS /api HTTP/1.1
Host: pablocordovaupdated.herokuapp.com
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Access-Control-Request-Method: POST
Origin: https://pablocordova.herokuapp.com
User-Agent: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.96 Safari/537.36
Access-Control-Request-Headers: content-type
Accept: */*
Referer: https://pablocordova.herokuapp.com/
Accept-Encoding: gzip, deflate, sdch, br
Accept-Language: es-ES,es;q=0.8
问题：
这是我真正的问题还是我理解不好？和/或我能做些什么来解决这个问题？和/或有什么建议吗？
谢谢。
问题似乎是： https://pablocordovaupdated.herokuapp.com/api总是返回 404：
$ curl -i https://pablocordovaupdated.herokuapp.com/api
HTTP/1.1 404 Not Found
也就是说，服务器没有对OPTIONS请求做任何特殊/不同的事情——相反，所有请求都只是命中 404。
app.post('/api', function(req, res, next) { console.log('!I AM YOUR FATHER'); ... });
我不太清楚 Express 如何处理这种情况，但可能必须将其配置为为该路由发送某种响应——而不仅仅是服务器端的console.log。
当我查看 https://pablocordovaupdated.herokuapp.com/api 的内容时，我看到的只是一个通用的 Heroku 404 页面——所以它不是从你的应用程序中提供的，而是回退到由 Heroku 提供的。例如，该 404 页面的内容如下：
<iframe src="//www.herokucdn.com/error-pages/no-such-app.html"></iframe>
也就是说，在任何情况下，您的应用代码似乎都不会按预期处理对该 URL 的请求。所以这似乎是你需要首先解决的问题。