vue-admin-template的ajax请求响应

274 阅读1分钟

发请求到获得服务器响应的整个过程_10个步骤

  1. 表单验证(通过非空,自定义判断后返回true触发ajax请求)

  2. 通过校验后,收集用户的参数并调用api/user.js中封装的api

    a. 设置基地址,从环境变量中拼接

    b. 导入api/user.js中的login方法(登陆的ajax请求)

  3. 经过请求拦截器,添加请求头(添加token,utils/request.js) config.headers.Authorization=`Bearer ${token}`

  4. 代理转发(在vue.config.js中编辑代理端口,解决跨域问题)

  5. 线上接口/本地接口

  6. 经过相应拦截器的处理(在utils/request.js中编辑,解包axios的data包装/脱壳)

    // 判断当前操作是否成功,决定axios是否报错

  7. 调用成功后把返回的token存储到store/modules/user.js中的state(公共数据以便复用)

  8. token做持久化 (调用utils/auth.js中的js-cookie)

// 基于vue-admin-template