node.js – CORS – OPTIONS … 404(未找到)

嗨,我遇到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问题 – 预检请求,这里更多定义：Link about preflighted request

这意味着在角度4发送数据到服务器之前,这要求服务器是否可以用动词OPTION接收我的数据,如果服务器的响应是OK则则角度4发送格式的数据.

问题：

在控制台中我总是收到此错误消息：

我做了什么：

到目前为止,我理解这个问题是因为https://pablocordovaupdated.herokuapp.com/api没有返回动词选项的答案

然后我尝试解决这两种方式：

使用COrs包CORS package
我根据文档配置.

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',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',next) {
    console.log('!I AM YOUR FATHER');
    ...
});

但从未打印过.
注意：我尝试使用heroku日志查看此消息,因为整个页面都在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

题：

这是我的真正问题还是我理解不好？和/或
我该怎么做才能解决这个问题？和/或
有什么建议吗？

谢谢.

$curl -i https://pablocordovaupdated.herokuapp.com/api
http/1.1 404 Not Found

<iframe src="//www.herokucdn.com/error-pages/no-such-app.html"></iframe>