webpack 相关

1. 本地开发通过localhost 访问后端接口的时候我们可以通过设置 proxy 来解决跨域问题
   设置代理的前提条件：
   1). 需要使用本地开发插件：webpack-dev-server。
   2). webpack-dev-server使用的是http-proxy-middleware来实现跨域代理的。
   3). webpack版本： 3.0、4.0亲测有效

一个webpack配置信息：

module.exports = {
  //...
  devServer: {
    proxy: {
      '/api': {
        target: 'http://www.baidu.com/', // 后端接口域名
        pathRewrite: {'^/api' : ''},
        changeOrigin: true,     // target是域名的话，需要这个参数，
        secure: false,          // 设置支持https协议的代理
      },
      '/api2': {
          .....
      }
    }
  }
};

需要注意的点
1). proxy 里的 /api 就是我们ajax 请求里的 baseUrl公共部分，比如我们正常的测试环境配置是

const testHost = `${window.location.origin}/test-apit/api`
const request = axios.create({
  withCredentials: true,
  baseURL: testHost,
  timeout: 60000,
  headers: {
    'Response-Type': 'json'
  }
})

那么我们的 proxy 里的key 就应该是 '/test-apit/api'，如下

  proxy: {
      '/test-apit/api': {
        target: 'http://www.baidu.com/', // 后端接口域名
        changeOrigin: true,     // target是域名的话，需要这个参数
      },

这样我们访问 localhost:8004/test-apit/api/admin/useMemo 接口就会代理到
http://www.baidu.com/test-apit/api/admin/useMemo

• pathRewrite
  路径重写，也就是说会修改最终请求的API路径。
  比如访问的API路径：/api/users,
  设置pathRewrite: {'^/api' : ''},后，
  最终代理访问的路径：http://www.baidu.com/users，
  这个参数的目的是给代理命名后，在访问时把命名删除掉。

• changeOrigin
  这个参数可以让target参数是域名。

• secure
  secure: false,不检查安全问题。
  设置后，可以接受运行在 HTTPS 上，可以使用无效证书的后端服务器