Развертывание приложения React: недопустимый заголовок хоста и ошибка 404 не найдена - PullRequest
0 голосов
/ 05 августа 2020

Я пытаюсь развернуть свое приложение для реагирования на heroku.

По сути, у меня есть два независимых каталога ui и api. И я успешно развернул api на heroku.

Когда я разрабатываю свое приложение локально, в моем package.json в ui каталоге появляется следующая строка:

"proxy": "https://my-web-project-api.herokuapp.com/"

И это отлично работает, когда я запускаю npm start на своей локальной машине в ui. Я могу вводить данные с локального хоста и общаться с развернутым приложением api.

Итак, теперь, если я попытаюсь развернуть ui и на heroku. Я удалил "proxy": "https://my-web-project-api.herokuapp.com/" в package.json. Затем я добавил новый файл src/setupProxy.js в свой каталог ui root. Выглядит это примерно так:

const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function(app) {
  app.use(
    '/',
    createProxyMiddleware({
      target: 'https://my-web-project-api.herokuapp.com/',
      changeOrigin: true,
    })
  );
};

В моем package.json у меня "http-proxy-middleware": "^1.0.5".

Теперь, если я пу sh мой ui на героку и получаю https://my-web-project-ui.herokuapp.com. Я вижу веб-страницу, которая является страницей входа в систему, однако, если я попытаюсь ввести некоторые данные, я получаю ошибку 404, не найден.

Чтобы воспроизвести эту проблему локально, я пытаюсь запустить npm start и запустите мое приложение на моем локальном компьютере , сохранив только что сделанные изменения. Я по-прежнему получаю ту же ошибку:

POST http://localhost:3000/login 404 (Not Found) 

Поскольку изначально я мог делать это локально, используя «прокси» в package.json. Я думаю, что мои ui и api должны иметь возможность общаться правильно, и при изменении настроек proxy должна возникнуть проблема.

Какой шаг идет не так? Может ли кто-нибудь дать мне знать? Заранее спасибо!

...