“Invalid Host header” in a React app deployed to I

2019-09-04 15:04发布

问题:

I have developed a very simple demo Todo List app (Express + React), according to Brad Traversy's YT tutorial and successfully deployed this app to Heroku, where it is up and running. However, when I deployed the same exact code to IBM Cloud, I only got a blank screen with a sentence Invalid Host header.

Some more context:

  • I've used create-react-app in the root of my project
  • There is a proxy between the server and the React client
  • I'm deploying a production version that serves the static files:

    // Serve static assets if in production
    if (process.env.NODE_ENV === 'production') {
      app.use(express.static('client/build'))
    
      app.get('*', (req, res) => {
        res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'))
      })
    }
    
  • Build and Deploy phases in my Deployment Pipeline in IBM Cloud pass with no problem

I have googled and tried to solve this using the approach the official create-react-app docs suggest:

HOST=mypublicdevhost.com
DANGEROUSLY_DISABLE_HOST_CHECK=true

Some people asked a similar question on Stack Overflow, too:

  • Invalid Host header when running Create React App on localhost subdomain

  • "Invalid Host Header" in When running React App

  • How do I fix an Invalid Host Header error when deploying my react app to Heroku?

None of the answers helped, however.

I've come to a conclusion that it is an IBM Cloud-specific issue. Does anyone know the possible cause of this? Are there any limitations IBM Cloud has that prevents my app from loading correctly?

Any help will be appreciated.

EDIT:

The script for the Build phase:

export PATH=/opt/IBM/node-v6.7.0/bin:$PATH
npm install
npm run build

The script for the Deploy phase:

cf push "${CF_APP}"

回答1:

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/