webpack的proxy代理配置

// webpack.config.js
devServer: {
    hot:true, // 它是热更新：只更新改变的组件或者模块，不会整体刷新页面
    open: true, // 是否自动打开浏览器
    proxy: { // 配置代理（只在本地开发有效，上线无效）
      "/x": { // 这是请求接口中要替换的标识
        target: "https://api.bilibili.com", // 被替换的目标地址，即把 /api 替换成这个
        pathRewrite: {"^/api" : ""}, 
        secure: false, // 若代理的地址是https协议，需要配置这个属性
      },
      '/api': {
        target: 'http://localhost:3000', // 这是本地用node写的一个服务，用webpack-dev-server起的服务默认端口是8080
        pathRewrite: {"/api" : ""}, // 后台在转接的时候url中是没有 /api 的
        changeOrigin: true, // 加了这个属性，那后端收到的请求头中的host是目标地址 target
      },
    } 
  }

请求接口文件

// 请求接口文件
// 会报跨域的错，因为本地的是 http://localhost:8080/
fetch('/x/web-interface/nav').then(res=>res.json).then(data => {
  console.log(data)
});

let xhr = new XMLHttpRequest();
xhr.open('get','/api/user',true)
xhr.onreadystatechange = function(){
  if(xhr.readyState === 4) {
    console.log(xhr);
    console.log(xhr.response)
  }
}
xhr.send(null);