回顾：
SpringBoot项目——jwt 登录验证与编写前后端分离API
SpringBoot项目——配置Mysql与session注册登录验证
SpringBoot项目——创建菜单与游戏页面
SpringBoot项目——配置git环境与项目创建
文章目录
- SpringBoot项目——前端页面授权+注册页面实现+登录状态持久化
- 1. 实现前端页面授权
- 2. 实现 jwt 注册页面
- 3. 实现登录状态的持久化
router 中增加属性存储是否需要授权
引入store中is_login判断是否登录
router 中增加路由跳转前的执行函数，若为需要授权页面且为登录直接跳转到登录界面
实现注册页面组件UserAccountRegisterView.vue
采用ajax调用后端所写注册API
这里的ajax并未放在vuex里：对store的state有修改操作的才需要放在store的mutation里直接修改，或者像ajax这种异步跨域操作的放在action里调用mutation修改。
目前jwt_token存在用户本地，若关闭浏览器或者刷新会使得token删除，从而取消登录状态重定向到登录页面。下面实现将 jwt_token 存在local_storage（浏览器的一小块空间），当关闭浏览器或者刷新时，不会取消登录状态。
刷新后退出登录状态:
实现刷新后不退出登录状态：
1、localStorage中存储jwt_token处理（store中）
登录成功后将jwt_token存在localStorage。
退出后将jwt_token从localStorage删除。
登录后查看Local Storage可以看到所存储的jwt_token。
2、用户重定向到登陆页面的时候，我们可以事先判断有没有将token存在本地LocalStorage，如果存在本地就把token取出来，验证是否过期。如果没有过期，无需重新登陆，可直接跳转到首页。
刷新时闪过登录页面处理
1、全局存储记录是否时拉去信息的过程，若是则不显示登录页面。并写相应方法修改。
2、 v-if控制是否显示login里的content
3、实现本地localStorage所存jwt_token不合法才会显示登录页面。
即目前本地localStorage所存jwt_token若不合法，就将其定为非拉取信息状态，才显示登录页面。
只要本地localStorage所存jwt_token合法，边不会显示登录页面
