Question

更新＃2：这已经解决，请参阅我自己的答案（我还不能接受）。

我正在通过Express使用node.js后端在heroku上运行React应用程序。在前端，我想发送一个包含JSON有效负载的POST请求，发送方式如下：

fetch('/api/shows', {
        method: 'POST',
        accept: 'application/json',
        headers: new Headers({
            'Content-Type': 'application/json',
        }),
        // mode: 'cors',    // tried this, but no effect
        // cache: 'default',    // tried this, but no effect
        body: JSON.stringify({ "foo": "bar" }),
    }).then(response => {
        return response.json();
    }).then(response => {
        // … handling the response …
    }).catch(err => {
        // … handling errors …
    });

后端设置如下：

const express = require('express');
const bodyParser = require('body-parser');

const app = express();

app.set('port', (process.env.PORT || 3001));

if (process.env.NODE_ENV === 'production') {
    app.use(express.static('frontend/build'));
}

app.post('/api/shows', bodyParser.json(), (req, res) => {
    const data = req.body;
    console.log(data); // shows {}
});

在本地这一切都运行正常，但在heroku上部署请求的内容类型为application/x-www-form-urlencoded而不是application/json，这就是正文解析器中间件不解析JSON的原因。

很奇怪，这个在我尝试过一次之前已经工作了，而且我不知道在此期间我在这方面做了任何改变。

尽管明确为请求设置了标头，但是导致标头出错的原因是什么？无论如何，我可以配置中间件来读取它，但这似乎是一种解决方法。我想要了解问题的实际根本原因。

更新＃1

我认为这可能与URL设置有关。使用命令行中的curl请求为后端提供服务，使用http://my-app.herokuapp.com/api/shows时会收到数据，但使用http://myurl.info/api/shows时则不会收到。

Answer 1

就像往常一样，在发布后不久，我已经弄明白了。问题实际上与应用程序无关。

我通过提供商使用自己的网址并设置了对myapp.herokuapp.com的reidrection，结果证明是问题所在。 Heroku explains in detail如何为Heroku应用程序配置域名，并在按照该过程使用CNAME条目后，一切正常。

fetch（）标题显示为application / x-www-form-urlencoded而不是application / json

1 个答案: