发请求到获得服务器响应的整个过程_10个步骤
-
表单验证(通过非空,自定义判断后返回true触发ajax请求)
-
通过校验后,收集用户的参数并调用api/user.js中封装的api
a. 设置基地址,从环境变量中拼接
b. 导入api/user.js中的login方法(登陆的ajax请求)
-
经过请求拦截器,添加请求头(添加token,utils/request.js)
config.headers.Authorization=`Bearer ${token}` -
代理转发(在vue.config.js中编辑代理端口,解决跨域问题)
-
线上接口/本地接口
-
经过相应拦截器的处理(在utils/request.js中编辑,解包axios的data包装/脱壳)
// 判断当前操作是否成功,决定axios是否报错
-
调用成功后把返回的token存储到store/modules/user.js中的state(公共数据以便复用)
-
token做持久化 (调用utils/auth.js中的js-cookie)
// 基于vue-admin-template