react脚手架配置代理总结

文章总结来源于尚硅谷老师的讲解

假设请求地址是"http://localhost:5000"，网页发出请求的地址是"http://localhost:3000"

方法一

在package中追加如下配置

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

说明：

1.优点：配置简单，前端请求资源时可以不加任何前缀。

2.缺点：不能配置多个代理。

3.工作方式：当请求了3000不存在的资源时，那么该请求会转发给5000（优先匹配前端资源）

方法二

1.第一本：创建配置代理文件

      在src下创建配置文件：src/setupProxy.js

2.编写setupProxy.js配置具体代理规则

const proxy = require("http-proxy-middleware");

module.exports = function (app) {
  app.use(
    proxy("/api1", {
      // 遇见/api1前缀的请求，就会触发该代理配置（所有带有/api前缀的请求都会转发给5000）
      target: "http://localhost:5000", // 请求转发给谁（服务器地址）
      changeOrigin: true, // 控制服务器收到的请求头中Host的值
      /*