close

[Solved] I am getting an “Invalid Host header” message when connecting to webpack-dev-server remotely

Hello Guys, How are you all? Hope You all Are Fine. Today I get the following error I am getting an “Invalid Host header” message when connecting to webpack-dev-server remotely in javascript. So Here I am Explain to you all the possible solutions here.

Without wasting your time, Let’s start This Article to Solve This Error.

How I am getting an “Invalid Host header” message when connecting to webpack-dev-server remotely Error Occurs?

Today I get the following error I am getting an “Invalid Host header” message when connecting to webpack-dev-server remotely in javascript.

How To Solve I am getting an “Invalid Host header” message when connecting to webpack-dev-server remotely Error ?

  1. How To Solve I am getting an “Invalid Host header” message when connecting to webpack-dev-server remotely Error ?

    To Solve I am getting an “Invalid Host header” message when connecting to webpack-dev-server remotely Error Add this config to your webpack config file when using webpack-dev-server (you can still specify the host as 0.0.0.0).
    devServer: { disableHostCheck: true, host: '0.0.0.0', port: 3000 }

  2. I am getting an “Invalid Host header” message when connecting to webpack-dev-server remotely

    To Solve I am getting an “Invalid Host header” message when connecting to webpack-dev-server remotely Error Add this config to your webpack config file when using webpack-dev-server (you can still specify the host as 0.0.0.0).
    devServer: { disableHostCheck: true, host: '0.0.0.0', port: 3000 }

Solution 1

I found out, that I need to set the public property of devServer, to my request’s host value. Being that it will be displayed at that external address.

So I needed this in my webpack.config.js

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

Another solution is using it on the CLI:

webpack-dev-server --public $C9_HOSTNAME   <-- var for Cloud9 external IP

Solution 2

Add this config to your webpack config file when using webpack-dev-server (you can still specify the host as 0.0.0.0).

devServer: {
    disableHostCheck: true,
    host: '0.0.0.0',
    port: 3000
}

Summery

It’s all About this issue. Hope all solution helped you a lot. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you? Thank You.

Also Read

Leave a Comment