Cloudflare Tunnel访问树莓派Node.js/React应用遇Invalid Host Header错误

几个实用的解决方向： #

• 修改React启动命令，指定允许的主机
  直接在package.json的scripts里改启动命令，让开发服务器监听所有主机：

  "start": "HOST=0.0.0.0 react-scripts start"
  

  Windows环境换成"start": "set HOST=0.0.0.0 && react-scripts start"，这样就不会限制请求头里的Host值了。

• 用环境变量放开主机限制
  启动应用前先设置环境变量：

  export ALLOWED_HOSTS='*'
  

  或者把这个变量加到你的启动脚本里，确保React能读取到，直接跳过Host校验。

• 检查Express代理的配置
  你用了Express代理API请求，得确保代理转发时处理好Host头。在代理配置里加上changeOrigin: true：

  app.use('/api', proxy('http://localhost:8080', {
    changeOrigin: true
  }));
  

  这个配置会把请求的Host改成目标服务器的地址，避免因为Host不匹配触发错误。

• 生产构建版本的额外处理
  如果部署的是npm run build后的静态文件，用Express托管的话，要让Express信任Cloudflare的代理：

  app.set('trust proxy', true);
  

  这样Express就不会因为来自Cloudflare的请求Host头异常而拒绝访问了。

提醒一句：如果是Create React App创建的项目，单独加自定义webpack.config.js大概率不生效，CRA会忽略这个文件，优先用前面的环境变量或启动参数方法更省事。

内容的提问来源于stack exchange，提问作者MichaelLong102