在您的webpack配置中，您可以在devServer配置中添加disableHostCheck: true。例如，

devServer: {
  disableHostCheck: true
}

只是为了解释为什么会发生这种情况。

webpack-dev-server已发布 v2.4.3。

引用他们的补丁说明：
请求的主机标头必须与公共选项中提供的监听地址或主机匹配。请确保在此处提供正确的值。
他们还包括disableHostCheck来关闭此检查，但是
只有当你知道你在做什么的时候才使用它。不推荐。

在Webpack的最新版本（我使用v4）中，disableHostCheck不可用，但文档建议使用allowedHosts。它对我很有效。

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

请参阅Webpack的devServer.allowedHosts。

配置响应目标主机将修复“Invalid Host Header”错误

查找React服务器的FQDN，例如，如果服务器的FQDN为：my.devserver.com
将以下行添加到.env文件中：

HOST=my.devserver.com

重新启动react应用程序并在http://my.devserver.com:3000/下访问它
如果my.devserver.com需要从其他计算机访问www.example.com，请将以下行添加到hosts文件（在基于Unix的系统上为/etc/hosts）：

0.0.0.0 my.devserver.com

如果你看到这个与nginx proxy + ssl /和docker结合在一起，我需要指定主机和定制的代理变量
https://github.com/plaid/quickstart/blob/master/frontend/src/setupProxy.js
我基本上需要告诉React主机+环境：

- REACT_APP_API_HOST=www.yourdomainhere.com
- HOST=frontend 

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

 
  frontend:
    environment:
      - REACT_APP_API_HOST=www.yourdomainhere.com # 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 . "