如果出于任何原因，您尝试在没有服务器的情况下部署客户端，请确保删除：

"proxy": "http://localhost:5000"

从客户端的package.json..

编辑2019年7月：

Create React App 2.0更改了我们定义代理的方式。要确定您使用的版本，请检查您的客户端包.json：“React脚本”大于“2.x.x”
现在，在client/目录中安装以下软件包：

npm install http-proxy-middleware --save

在client/src/目录下创建setupProxy.js文件，不需要将该文件导入到任何地方，CRA查找该名称的文件并加载。
添加代理的方法有多种：

备选案文1：

const {创建代理中间件} =需要（“http代理中间件”）;

module.exports = function(app) {
  app.use(
    createProxyMiddleware(["/api", , "/otherApi"], { target: "http://localhost:5000" })
  );
};

备选案文2

const { createProxyMiddleware } = require('http-proxy-middleware');
     
    module.exports = function(app) {
        app.use(createProxyMiddleware('/api/**', { target: 'http://localhost:5000' }));
        app.use(createProxyMiddleware('/otherApi/**', { target: 'http://localhost:5000' }));
    };

答复评论

这个代理只在开发环境中使用。在生产/Heroku中，所有东西都在同一个服务器下运行，所以那里不需要代理。

create-react-appserver只运行在Dev环境中，因此当应用程序运行在PROD模式下时，它只用于生成将由Node/Express服务器服务的生产JS bundle。

有关如何使其在生产环境中工作的问题，请查看其他答案。

Invalid Host Header已经作为DNS Rebinding的解决方案被放入。
要解决这个问题，必须在create-react-app根文件夹中创建一个名为**.env.development**的文件。

HOST=name.herokuapp.com

来自文档：https://create-react-app.dev/docs/proxying-api-requests-in-development/#invalid-host-header-errors-after-configuring-proxy

在我的例子中，当我在开发模式下运行React应用程序和webpack时发生了这种情况。我通过在webpack.config.js文件中设置allowedHosts的值来解决这个问题。您可以从官方webpack文档中查看有关allowedHosts属性的更多信息。
对于我的示例，我将以下代码添加到webpack.config.json的module.exports中：

module.exports = {
    // Some stuff that already exists before
    //.
    //.
    //.
    devServer: {
        allowedHosts: 'all'
    },
}

**注意：**由于安全问题，建议不要将all用于allowedHosts属性。请确保指定必须运行应用的特定主机。

在我的例子中，问题是由开发中使用的环境变量引起的，因为包含环境变量的.env文件包含在我的.gitignore中，所以在生产中没有读取这些环境变量
为了解决这个问题，我在Heroku主机上添加了环境变量。设置-〉配置变量-〉显示配置变量
然后在这里添加您在开发中使用的相同环境变量。一旦完成，错误就消失了！
environment variable being used in app
same environment variable in Heroku, Config Vars