"Неверный заголовок узла" в При запуске приложения React

У меня есть один простой проект React JS, и я внедряюсь в OSE. Также я использую ниже зависимости в моем проекте.

 "webpack": "^2.2.0",
 "webpack-dev-server": "^1.14.1",
 "react": "^15.5.4",
 "react-router-dom": "^4.1.1"

Также я запускаю свой проект через скрипт ниже.

"build": "SET NODE_ENV=production && webpack-dev-server --host 0.0.0.0 --inline --history-api-fallback --content-base . "

В OSE все идет хорошо, и Webpack успешно скомпилирован. Но при доступе к URL на веб-странице отображается "Неверный заголовок узла".

Может ли кто-нибудь помочь в этом. Несколько новое в реакции.

Заранее спасибо.

Источник

6 ответов

В вашем конфиге webpack вы можете добавить disableHostCheck: true в devServer конфигурации. Например,

devServer: {
  disableHostCheck: true
}
Источник

В более поздних версиях Webpack (я использую v4) disableHostCheck недоступен , но в документации предлагается использовать allowedHosts. Это сработало для меня.

      module.exports = {
  //...
  devServer: {
    allowedHosts: 'all',
  },
};

См . devServer.allowedHosts Webpack .

Источник

Настройка целевого хоста реакции исправит ошибку «Недопустимый заголовок хоста».

Найдите полное доменное имя вашего сервера реакции, например, если полное доменное имя вашего сервера: my.devserver.com

Добавьте следующую строку в ваш .env файл:

      HOST=my.devserver.com

Перезапустите приложение React и получите доступ к нему по адресу http://my.devserver.com:3000/.

Если my.devserver.com должен быть доступен с других машин, добавьте эту строку в свой файл hosts (/ etc / hosts в системах на базе Unix):

      0.0.0.0 my.devserver.com
Источник

Просто чтобы объяснить, почему это происходит.

webpack-dev-server выпустил v2.4.3.

Цитируя их примечание патча:

Заголовок Host запроса должен соответствовать адресу прослушивания или хосту, указанному в общедоступной опции. Убедитесь, что здесь указаны правильные значения.

Они также включены disableHostCheck чтобы отключить эту проверку, НО

Используйте его только тогда, когда знаете, что делаете. Не рекомендуется.

Источник

Если вы видите это в сочетании с nginx proxy + ssl / и docker, мне нужно было указать HOST, но также и специальный прокси-сервер var
https://github.com/plaid/quickstart/blob/master/frontend/src/setupProxy.js

Мне в основном нужно было сказать, как реагирует среда HOST +:

      - REACT_APP_API_HOST=www.covershot.app
- HOST=frontend 


services:
  go:
    networks:
      - "quickstart"
    depends_on:
      - "frontend"
    image: "100418366104"
    ports: ["8000:8000"]

 
  frontend:
    environment:
      - REACT_APP_API_HOST=www.covershot.app # see above setupProxy.js file
      - HOST=frontend 
    networks:
      - "quickstart"
    image: "e478fc0620e6"
    ports: ["3000:3000"]
  nginx:
    networks:
      - "quickstart"
    build:
        dockerfile: ./nginx/Dockerfile
        context: .
    ports:
        - 80:80
        - 443:443
    depends_on:
        - frontend
networks:
  quickstart:
    name: quickstart
Источник

Измените хост на 127.0.0.1 в сценарии сборки.

"build": "SET NODE_ENV=production && webpack-dev-server --host 127.0.0.1 --inline --history-api-fallback --content-base . "

Источник
Другие вопросы по тегам