需求分析

1. 在项目中需要多次发起请求，并且很多请求都需要token的身份认真，而且后台给到的数据嵌套也比较深，所以需要用到axios的拦截器和响应拦截器来做注入token和分解数据的处理
2. 本项目使用的是前后端端口分离的技术，所以也需要对跨域问题进行处理

使用proxy反向代理解决跨域问题，同时封装axios请求跟路径

1. 因为项目使用的是前后端端口分离的技术，所以需要使用vue中的反向代理解决跨域问题，在vue.config文件中devServer属性里使用proxy属性，配置路径，完成代理

devServer: {
    port: port,
    open: true,
    overlay: {
      warnings: false,
      errors: true
    },
    //反向代理解决跨域问题
    proxy: {
      // 当我们的本地的请求 有/api的时候，就会代理我们的请求地址向另外一个服务器发出请求
      '/api': {
        target: 'http://ihrm.itheima.net/', // 跨域请求的地址
        changeOrigin: true // 只有这个值为true的情况下 才表示开启跨域
      }
    }
  },

2. 在.env.development中配置 basAPI的路径改为和代理中一致的路径

# base api
VUE_APP_BASE_API = '/api'

3.在封装好的axios请求初始化文件中设置baseURL的路径使用process方法调用env.developmen中的VUE_APP_BASE_API

const service = axios.create({
// process是node.js中的方法
  baseURL: process.env.VUE_APP_BASE_API,
  timeout: 5000
})