Обновление № 2: это было решено, см. Мой собственный ответ (который я еще не могу принять).
Я запускаю приложение React на heroku, используя бэкэнд node.js через Express. В интерфейсе я хочу отправить запрос POST, содержащий полезную нагрузку JSON, которая отправляется следующим образом:
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
, поэтому промежуточное ПО body-parser не анализирует JSON.
Как ни странно, это работало пару дней назад, когда я попробовал это однажды, и я не знаю никаких изменений, которые я сделал в этой области тем временем.
Что вызывает неправильный заголовок, несмотря на то, что он явно задан для запроса? Я мог бы сконфигурировать промежуточное ПО, чтобы все это прочитать, но это похоже на обходной путь. Вместо этого я хотел бы понять фактическую основную причину проблемы.
Обновление # 1
Я думаю, что это может быть связано с настройкой URL. Используя запрос curl из командной строки для обслуживания бэкэнд, данные принимаются при использовании http://my-app.herokuapp.com/api/shows, но не при использовании http://myurl.info/api/показывает.
Как это часто бывает, вскоре после публикации я понял это. Проблема не имела никакого отношения к приложению вообще.
Я использую свой собственный URL-адрес через поставщика и установил reidrection на myapp.herokuapp.com, который оказался проблемой. Heroku подробно объясняет, как настроить домен для приложения Heroku и после выполнения этой процедуры использовать запись CNAME, все работает нормально.