0

When I deploy my React app on Heroku, I receive an Invalid Host error.

When I search for a reason, I find this in the docs: https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#invalid-host-header-errors-after-configuring-proxy

However, when I create an .env file and include the HOST, I receive this error:

Attempting to bind to HOST environment variable: XXX.herokuapp.com
If this was unintentional, check that you haven't mistakenly set it in your shell.

Could not find an open port at XXX.herokuapp.com.
Network error message: listen EADDRNOTAVAIL 52.205.227.252

What am I doing wrong?

UPDATE: I've set the HOST variable to the Heroku url both via the .env file and through the Heroku CLI, but I'm still getting the above error.

Adam White
  • 1,096
  • 3
  • 14
  • 28

2 Answers2

2

This is a slightly old question, but one of the many I came across while dealing with this same issue, so I'm sharing what I've learned and hope it will be useful to others.

A working solution is to use http-proxy-middleware to manually set up the proxy. Please see an explanation here: deploying create-react-app to heroku with express backend returns invalid host header in browser

Here is a minimal working example: https://github.com/sehailey/proxytest and here is that example deployed: https://proxytest2.herokuapp.com/

Sarah Hailey
  • 494
  • 5
  • 19
0

I used to get the same error when deploying on an aws ec2. I then realised that the problem was that I was including the port in the HOST=xxxx.com. Soon as I removed the port, it worked in dev mode.

Hope this helps

Antonio
  • 21
  • 4