• 登录/退出—token验证(路由导航守卫控制访问权)


    登录/退出—token验证(路由导航守卫控制访问权)如果不是要访问登录页先判断登录状态,不在登录状态的强制跳转到login登录页面

    登录功能

    登录login页面点击按钮绑定点击事件@click="login"

    1,login事件里先判断表单预验证:用户名和密码是否为合法。如果是合法内容直接走下一步发起请求。不是合法内容那么弹出提示

    2,发起请求成功--token存储再本地,然后跳转home主页组件       

    window.sessionStorage.setItem('token', res.data.token)
    this.$router.push('/home')

    成功的存储到了token,登录成功的时候携带token

    路由守卫

    路由守卫--做token验证:beforeEach((to,from,next) =>{ }

    • to 将要访问的路径
    • from 从哪个路径跳转而来
    • next是函数表示放行执行

    退出功能

    退出功能的时候:退出按钮绑定事件,触发退出事件拿到token,然后销毁token清空就可以。这样就访问的时候不会携带token,强制跳转login页面。生成新的token才能访问。

    现在退的时候清空token,再跳转登录页页完成了。

    退出的时候清空了!

  • 相关阅读:
    Git 基础笔记整理1
    学习开源中国客户端
    IOS项目中的细节处理,如更改状态栏等等
    网络编程
    当FileWriter没有flush的时候,不写入文件
    批量移动文件
    批量重命名文件
    替换一个文件内的某个字符
    遍历map和删除map中的一个entry
    ArrayList的遍历-转载
  • 原文地址:https://www.cnblogs.com/mahmud/p/16859987.html
Copyright © 2020-2023  润新知