12

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?

Improve this question
2
  • 1
    For multiple subdomains please track this issue: github.com/facebookincubator/create-react-app/issues/2233. Commented May 19, 2017 at 21:45
  • Even with the initial solution you had (devServer: { disableHostCheck: true }) I still couldn't fix this problem. Any idea what's wrong? Commented Jan 9, 2021 at 23:18

5 Answers 5

Reset to default
22

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.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

How sketchy would it be to use this in a production env?
what should use in production ?
The question and this answer applies to start script which starts a development server. In production you should run build script to build a production bundle. This static bundle is then served to users using a web server, e.g. Nginx or Apache. It's also possible to use Node.JS for that, e.g. Express package.
7

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.

Improve this answer

3 Comments

it says add HOST=mypublicdevhost.com where do I find / what is my "mypublicdevhost" ?
add it in the .env.development file at the root folder
just to mention that, as of today, that "instructions" link is not working anymore. Not sure whether it should point to create-react-app.dev/docs/proxying-api-requests-in-development/…
4

Solved it by adding 0.0.0.0 <domain> in my /etc/hosts in addition to adding the domain to the .env file.

Improve this answer

1 Comment

Thanks! This was my scenario as well. I had a HOST=local.companydomain.com in an .env as well, but needed to add 0.0.0.0 local.companydomain.com in my /etc/hosts. Reference to 0.0.0.0
0

Add the HOST in your .env file, then create react app will your host, rather than localhost. If it doesn't fix the issue then add DANGEROUSLY_DISABLE_HOST_CHECK=true in the .env file.

Don't forget to restart the development server.

HOST=mydevserver.com
Improve this answer

Comments

-1

running a basic yarn command fixed things for me

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.