Login登录页面点了登录请求之后是如何发送出去的?与项目架构图?

1.点击了登录会进行validator校验,校验的规则在validaMobile中,符合正则要求会通过,不符合会提示不符合手机号的要求

    2.调用了Login接口,找到axios实例,设置了基地址,基地址是环境变量,分别在开发环境和生产环境中设置了基地址,开发环境中是/api,执行不同的命令会使用不同环境的基地址

    3.login接口地址/sys/login会找到环境变量的基地址/api/,在找到vue.config.js中的api中的target地址进行拼接

    4.发送请求会经过request.js请求拦截器,会统一的携带token到后端的服务器上,本地会存一份token(调用utils/auth.js文件中的setToken方法),vuex中也会存储一份token(mapstations中的setToken方法)

   5.然后走最后的手动兜底校验,如果以上都没有问题,valida为true,会发送axios请求,为false,就执行不了请求

    6.请求发送还会经历跨域的问题,我们需要使用代理转发在vue.config.js文件中添加devServer,解决跨域问题

    7.后端服务器要启动MongoDB,才能有数据返回

    8.返回的过程中会经过request.js中的响应拦截器,来进行数据的脱壳

项目架构图