webpack-dev-server: "Invalid Host/Origin Header" warning

PLEASE READ

We are working on this problem. It is regression problem after fixing security error. Security issues are always high priority and we would not want to revert it, but it is require some changes in https://github.com/sockjs/sockjs-node/pull/247, we have workaround for this problem https://github.com/webpack/webpack-dev-server/pull/1608, but need some feedback. Feel free to feedback.

Fast workaround (put it in your devServer property in config):

disableHostCheck: true




We apologize for the situation. Thanks for helping us do webpack better. ⭐ ⭐ ⭐


  • Operating System: macos 10.14.2
  • Node Version: 11.5.0
  • NPM Version: 6.4.1
  • webpack Version: 4.28.1
  • webpack-dev-server Version: 3.1.11
  • This is a bug

Code

  // webpack.config.js
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

module.exports = {
  entry: [
    './src/main.css',
    './src/main.js'
  ],
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'index.js'
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: './src/main.html'
    }),
    new MiniCssExtractPlugin({
      filename: 'index.css'
    })
  ],
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          MiniCssExtractPlugin.loader,
          'css-loader'
        ]
      },
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: 'babel-loader'
      }
    ]
  },
  stats: {
    children: false,
    modules: false
  },
  devServer: {
    proxy: {
      '/api': 'http://localhost:3000'
    },
    stats: {
      children: false,
      modules: false
    }
  }
};

Expected Behavior

No warnings

Actual Behavior

Getting “Invalid Host/Origin Header” warning in browser console

For Bugs; How can we reproduce the behavior?

install webpack-dev-server@3.1.11 and run (v3.1.10 working as expected).

image

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 89
  • Comments: 59 (22 by maintainers)

Commits related to this issue

Most upvoted comments

@mrbbm I just had that very problem after upgrading my project to angular 7.2.0. I fixed it by modifying my package.json file as so:

{
  ...
  "scripts": {
    "ng": "ng",
    "start": "ng serve --disableHostCheck=true",    <===== HERE
    "build": "ng build --extract-css",
   ...

@ravshansbox it is security fix, looks you origin than you use in config, you can use disableHostCheck: true in you case, anyway can you create minimum reproducible test repo?

Even with disableHostCheck now after updating I can not get rid of these errors.

This is happening now on webpack 5 and disableHostCheck is not part of the api anymore. Any thoughts?

It happens again for me with the following versions:

{
  "webpack-cli": "3.2.0",
  "webpack-dev-server": "3.1.14"
}

error

Does it occur to you guys?

I am running 3.11.0 webpack-dev-server and still having this problem after specifying disableHostCheck: true

Looks like the issue has been solved. Thanks

This also affects projects created with @vue/cli - tested a few minutes ago with 3.1.12.

with disableHostCheck: true there is no warning.

Yes, it seems the npmjs security team does not know what is going on.

Reported https://npm.community/t/advisory-725-inconsistently-marks-affected-versions/4333

I also am getting this error in Firefox 64.0 with version 3.1.11. Reverting to 3.1.10 fixes it.

@kevinmu17 the disableHostCheck: true option was removed in favor of allowedHosts: "all", for more information please refer to our migration guide - https://github.com/webpack/webpack-dev-server/blob/master/migration-v4.md

webpack-dev-server@3.1.14 is not fixed this issue

Yep, 3.1.14 works fine 👍

#1608 is working for me (Node 11.5.0 and SockJS 0.3.19)

If you’re using @angular-builders/custom-webpack try this:

// custom-webpack.config.js
module.exports = {

  devServer: {
    disableHostCheck: true
  },

   plugins: []
};

@carlosgeos

Hi, I have no problem with this minimal example (with the latest versions of webpack-cli and webpack-dev-server): https://github.com/carlosgeos/simple-webpack-repo

@mrbbm in the webpack config like this:

module.exports = {
  // ...
  devServer: {
    disableHostCheck: true
  }
  // ...
};

Thanks for your reply. I would like to know where could I add in my Angular 7 project, there won’t be any file namely webpack.config

@davidpelayo yes, it is happening for me as well with the latest versions of both webpack-cli and webpack-dev-server

For now, I’ve added:

disableHostCheck: true,

…which skirts around the issue.

I can also confirm that the issue still exists

I am seeing this issue as well with 3.1.11. Rolling back to 3.1.10 fixes it.

@kevinmu17 the disableHostCheck: true option was removed in favor of allowedHosts: "all", for more information please refer to our migration guide - https://github.com/webpack/webpack-dev-server/blob/master/migration-v4.md

This link should be available on https://webpack.js.org/configuration/dev-server/ This was a live saver, I was banging my head, the information is very well explained and it took me a few hours to migrate. Thank you very much for pointing this out!

I see this message consistently when I run my project via Fiddler at localhost.fiddler:4200 and not when I use localhost:4200.

@khalwat >

@davidpelayo yes, it is happening for me as well with the latest versions of both webpack-cli and webpack-dev-server

For now, I’ve added:

disableHostCheck: true,

…which skirts around the issue.

Where could I add this disableHostCheck: true, ?

I tried to add workaround (#1608). It works and resolves this issue in my environment. Please check it.

@3846masa let’s wait some time and revert it, maybe we can implement workaround on our side, need investigate, feel free to do it, thanks

Please don’t spam Same problem here or issue still exists, better create minimum reproducible test repo, it is allow to fix all edge cases, thanks!

Also, got this issue after upgrading to 3.1.11