heroku 404(页面未找到)返回首页

uqjltbpv  于 2022-11-13  发布在  其他
关注(0)|答案(1)|浏览(116)

你好,我的CORS出现了问题。

一般结构:

Angular 4发送一个表单的数据到我的api。函数saveForm()在我发送表单联系人的信息时被执行。

应用程序.组件.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;
            }
        }
    );

}

这里是问题的根源,因为我使用POSTContent-Type->application/json来发送数据,根据定义,它给了我一个关于CORS-preflighted request的问题,这里有更多的定义:关于预检请求的链接
这意味着,在角4将数据发送到服务器之前,这用动词OPTION询问服务器是否可以接收我的数据,如果服务器的响应是OK,则角4发送表格的数据。

问题:

在控制台中,我总是收到以下错误消息:
404(页面未找到)
XMLHttpRequest无法加载https://pablocordovaupdated.herokuapp.com/api。对预检请求的响应未通过访问控制检查:请求的资源上不存在“Access-Control-Allow-Origin”标头。因此不允许访问源“https://pablocordova.herokuapp.com”。响应的HTTP状态代码为404。
XHR加载失败:开机自检“https://pablocordovaupdated.herokuapp.com/api“。
错误响应{_body:进度事件,状态:0,确定:假,状态文本:“",标题:标题...}

我尝试的内容:

到目前为止,我理解问题是因为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 StackOverFlowDiscussion 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

问题:

这是我真正的问题还是我理解得不好?和/或我能做些什么来解决这个问题?和/或有什么建议吗?

  • 谢谢-谢谢
oxf4rvwz

oxf4rvwz1#

问题似乎是: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的请求都没有得到应用代码的预期处理,所以这似乎是你首先需要解决的问题。

相关问题