当前位置: 首页 > 知识库问答 >
问题:

远程连接到webpack dev服务器时,我收到一条“无效主机头”消息

闻人英韶
2023-03-14

我正在使用Cloud9作为一个环境。io UbuntuVM Online IDE和我通过故障排除将此错误简化为只使用Webpack dev server运行应用程序。

我用以下方式启动它:

webpack-dev-server -d --watch --history-api-fallback --host $IP --port $PORT

$IP是一个具有主机地址的变量$PORT具有端口号。

我被指示在Cloud 9中部署应用程序时使用这些VAR,因为它们具有默认的IP和端口信息。

服务器启动并编译代码,没问题,但它没有显示索引文件。只有“无效主机标题”作为文本的空白屏幕。

请求如下:

GET / HTTP/1.1
Host: store-client-nestroia1.c9users.io
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 
(KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36
Accept: 
text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
DNT: 1
Accept-Encoding: gzip, deflate, sdch, br
Accept-Language: en-US,en;q=0.8

这是我的package.json:

{
  "name": "workspace",
  "version": "0.0.0",
  "scripts": {
    "dev": "webpack -d --watch",
    "server": "webpack-dev-server -d --watch --history-api-fallback --host $IP --port $PORT",
    "build": "webpack --config webpack.config.js"
  },
  "author": "Artur Vieira",
  "license": "ISC",
  "dependencies": {
    "babel-core": "^6.18.2",
    "babel-loader": "^6.2.8",
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-react": "^6.16.0",
    "babel-preset-stage-0": "^6.24.1",
    "file-loader": "^0.11.1",
    "node-fetch": "^1.6.3",
    "react": "^15.5.4",
    "react-bootstrap": "^0.30.9",
    "react-dom": "^15.5.4",
    "react-router": "^4.1.1",
    "react-router-dom": "^4.1.1",
    "url-loader": "^0.5.8",
    "webpack": "^2.4.1",
    "webpack-dev-server": "^2.4.4",
    "whatwg-fetch": "^2.0.3"
  }
}

这是webpack.config.js:

const path = require('path');

module.exports = {

  entry: ['whatwg-fetch', "./app/_app.jsx"], // string | object | array
  // Here the application starts executing
  // and webpack starts bundling
  output: {
    // options related to how webpack emits results

    path: path.resolve(__dirname, "./public"), // string
    // the target directory for all output files
    // must be an absolute path (use the Node.js path module)

    filename: "bundle.js", // string
    // the filename template for entry chunks

    publicPath: "/public/", // string
    // the url to the output directory resolved relative to the HTML page
  },

  module: {
    // configuration regarding modules

    rules: [
      // rules for modules (configure loaders, parser options, etc.)
      {
        test: /\.jsx?$/,
        include: [
          path.resolve(__dirname, "./app")
        ],
        exclude: [
          path.resolve(__dirname, "./node_modules")
        ],
        loader: "babel-loader?presets[]=react,presets[]=es2015,presets[]=stage-0",
        // the loader which should be applied, it'll be resolved relative to the context
        // -loader suffix is no longer optional in webpack2 for clarity reasons
        // see webpack 1 upgrade guide
      },
      {
        test: /\.css$/,
        use: [ 'style-loader', 'css-loader' ]
      },
      {
        test: /\.(png|jpg|jpeg|gif|svg|eot|ttf|woff|woff2)$/,
        loader: 'url-loader',
        options: {
          limit: 10000
        }
      }
    ]
  },

  devServer: {
    compress: true
  }
}

由于我的主机设置,网页包开发服务器正在返回此消息。在网页包dev server/lib/server中。js第60行。从…起https://github.com/webpack/webpack-dev-server

我的问题是如何设置以正确通过此检查。任何帮助都将不胜感激。

共有3个答案

傅朗
2023-03-14

这就是我的工作原理:

在网页包中的devServer下添加allowedHosts。配置。js:

devServer: {
  compress: true,
  inline: true,
  port: '8080',
  allowedHosts: [
      '.amazonaws.com'
  ]
},

我不需要使用--host或--public参数。

穆轶
2023-03-14

我发现,我需要将devServer的public属性设置为请求的主机值。因为它将显示在该外部地址。

所以我webpack.config.js需要这个

devServer: {
  compress: true,
  public: 'store-client-nestroia1.c9users.io' // That solved it
}

另一个解决方案是在CLI上使用它:

webpack-dev-server --public $C9_HOSTNAME   <-- var for Cloud9 external IP
尉迟京
2023-03-14

出现此问题是因为webpack-dev-server2.4.4添加了主机检查。您可以通过将此添加到webpack配置来禁用它:

 devServer: {
    compress: true,
    disableHostCheck: true,   // That solved it

 }      

编辑:请注意,此修复程序不安全。

有关安全解决方案,请参见以下答案:https://stackoverflow.com/a/43621275/5425585

 类似资料:
  • 我试图在移动设备上测试我的React应用程序。我使用ngrok使我的本地服务器可用于其他设备,并与各种其他应用程序一起工作。但是,当我尝试将ngrok连接到React dev服务器时,我得到了错误: 我相信React默认情况下会阻止来自其他来源的所有请求。有什么想法吗?

  • sudo ufw状态:活动状态 从---------22/TCP允许任意位置10000 允许任意位置Nginx完全 允许任意位置3333 允许任意位置27017 允许任意位置22/TCP(v6) 允许任意位置(v6)10000(v6) 允许任意位置(v6)Nginx完全(v6) 允许任意位置(v6)27017(v6) 允许任意位置(v6) 从我的mac连接到它会引发错误: mongo MongoD

  • 使用VisualVM,我可以看到两种类型来连接远程主机。 > jstatd 所以我正在尝试使用JMX,我学习了很多教程,但到目前为止还没有成功。 目前,有我的桌面和一个运行java服务器应用程序的linux盒子。我正在尝试在桌面上设置VisualVM客户端,以查看在linux Box上运行的java应用程序。 我为Linux上的java应用程序在start.sh脚本上添加了以下JAVA_OPTS脚

  • 问题内容: 我想对redis.conf进行一些更改,以便每当我键入redis-cli时,它就会将我连接到安装在远程服务器上的redis。 我知道我们可以通过以下方式连接到安装在远程服务器上的redis: 但是实际上,我有一些bash脚本,在那些脚本中,我在很多地方都使用过redis-cli。因此,我不想以每个文件中的redis-cli -h’IP- Address-Of-Server’替换redi

  • 问题内容: 我已经使用Ubuntu 10.10服务器上http://redis.io/topics/quickstart上的快速入门指南中的说明成功安装了Redis 。我将服务作为dameon运行(因此可以通过init.d运行) 该服务器是具有内部和外部IP的Rackspace Cluster的一部分。主机在端口6379上运行(Redis的标准配置) 我在iptables中添加了一行,以允许来自端

  • 问题内容: 我有以下骆驼对Redis进行投票: 而且效果很好。但是,当我将redisUri从 至 我收到以下错误: 我检查了通过telnet到并使用redis-cli可以访问elasticache。 连接到远程主机时出现此错误是什么? 我的本地redis和elasticache redis都运行2.8.24。运行骆驼2.17.1。 问题答案: 这是我的工作方式: 属性文件: 骆驼路线与以前相同。