代理在 create-react-app 和 axios 中不起作用答案

【问题标题】：proxy won't work in create-react-app and axios代理在 create-react-app 和 axios 中不起作用
【发布时间】：2018-05-10 20:23:34
【问题描述】：

我在 package.json 中添加了"proxy": "http://localhost:3001"，然后运行 npm run start 来启动客户端应用程序。

然后我用 axios 来做这个

axios.get('/')
    .then(resp => {
      console.log(resp)
      this.setState({
        name: resp.name
      })
    })

我打开网络选项卡，我看到它调用 http://localhost:3000 而不是代理，有什么线索吗？我有一个在 3001 上运行的快速服务器。

【问题讨论】：

你不能改用fetch吗？
@mersocarlin 我可以，但我想知道出了什么问题。

标签： node.js reactjs axios create-react-app

【解决方案1】：

打开网络标签，我看到它调用 http://localhost:3000 而不是代理

代理就是这样工作的！浏览器向您的代理服务器运行的localhost:3000 发出请求，代理服务器将请求转发到localhost:3001

【讨论】：

【解决方案2】：

问题出在 webpack 配置文件中，使用您自己的启动包只需按照以下代码设置“webpack.dev.js”

module.exports = merge(common, { mode: 'development', devServer: { host: 'localhost', port: 3000, open: true, historyApiFallback: true, proxy: { '/api': { target: 'http://localhost:5000', secure: false } } }, devtool: 'inline-source-maps' });

并为您的服务器设置适当的本地主机并重新启动开发服务器。在“create-react-app”中，webpack 配置文件应该在路径 /node_modules/react-scripts/config 上，按照上面的代码进行更改并重新启动 dev-server，你应该没问题。在这条路上有 webpack.config.dev.js。 //由npm start使用 webpack.config.prod.js //被npm run build使用

【讨论】：