vue实现代理

1、数据结构

devServer: {
    
    
//前端host
	host:jost,
//前端port
    port: port,
    //代理
    proxy: {
    
    
    //匹配/api这种的url
      '/api': {
    
    
      //要从前端-》后端的地址
        target: "http://localhost:8081",
        //支持代理
        changeOrigin: true,
        //路径重写  ^:这个符号就是以xxx开头的意思
        pathRewrite: {
    
    
          '^/api': ''//这个意思就是以api开头的，替换为空，将url中/api以前的替换为target中的字符串
        }
      }
    }
  },

注意：前端中报错时显示的地址还是前端ip+port+xxx路径，不会将替换好的地址显示出来。