Invalid Host header when running Create React App on localhost subdomain

Question

After updating to the react-scripts 1.0.0 I get this error when I try to open my app in the browser on a localhost subdomain: 'Invalid Host header'

My app was set up to serve different data for different subdomains: group1.localhost:3000 group2.localhost:3000 ...

I found that adding the code below to my webpack config should fix the problem.

devServer: {
  disableHostCheck: true
}

But how can i fix it in CRA without ejecting?

Answer 1

An easy solution for development environment would be to set the following environment variable: DANGEROUSLY_DISABLE_HOST_CHECK=true

That can be done by e.g. adding that line to .env file in the root of the project. Note that this is not a secure solution and should not be used in production.

Answer 2

Please update to [email protected].
It fixes this issue for users who don't use the proxy feature in React.

If you do use the proxy feature, please follow these instructions.