前端登录流程

前端登录流程

初次登录的时候,前端调后调的登录接口,发送用户名和密码,后端收到请求,验证用户名和密码,验证成功,就给前端返回一个token,和一个用户信息的值,前端拿到token,将token储存到Vuex中,然后从Vuex中把token的值存入浏览器Cookies中。把用户信息存到Vuex然后再存储到LocalStroage中
Cookies
前端登录流程_第1张图片
LocalStroage
前端登录流程_第2张图片
前端登录流程_第3张图片
然后跳转到下一个页面,根据后端接口的要求,只要不登录就不能访问的页面需要在前端每次跳转页面师判断Cookies中是否有token,没有就跳转到登录页,有就跳转到相应的页面,我们应该再每次发送post/get请求的时候应该加入token,常用方法再项目utils/service.js中添加全局拦截器,将token的值放入请求头中
前端登录流程_第4张图片
后端判断请求头中有无token,有token,就拿到token并验证token是否过期,在这里过期会返回无效的token然后有个跳回登录页面重新登录并且清楚本地用户的信息前端登录流程_第5张图片
再全局拦截器中加代码前端登录流程_第6张图片

你可能感兴趣的:(前端登录流程,weui)