前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >后台管理系统登录思路「建议收藏」

后台管理系统登录思路「建议收藏」

作者头像
全栈程序员站长
发布2022-08-24 15:47:00
1.1K0
发布2022-08-24 15:47:00
举报
文章被收录于专栏:全栈程序员必看

大家好,又见面了,我是你们的朋友全栈君。

一般来说我们不管是做后台管理,还是做普通项目,必不可少的其实就是登录。那么登录又是怎么实现的呢?废话不多说,上代码。 首先我们把登录接口封装在一个文件里,如果这个接口有必备的参数,我们就得传参,然后在登录页引入调用。 其次就是我们在登录页写登录框信息,这时候就需要接收接口必备的参数,那具体怎么接呢? 先在data里设置两个放置参数的空数组。然后在登录信息框中外围prop接收,然后在信息框上v-model获取用户信息。 在一个就是当我们填完用户信息的时候做什么逻辑:首先就是调用封装好的登录接口,其次在登录成功后跳转到详情页。(如果是登录过的就把token存在本地) 那么问题又来了,怎么判断用户是否登录成功呢? 其实就是给全局加一个路由前置全局钩子函数,在函数里把用户登录的token在本地获取到,然后判断,当我们在本地找到这个用户时,如果这个用户token存在,就登录成功,否则就作废。(例子)

router.beforeEach((to, from, next) => { console.log(‘to:’, to) const token = localStorage.getItem(‘token’); if (to.meta.Authorition) { if (token) { next() } else { router.push({name:‘Login’}) } } else { next() }

}) 那么这个栗子就是说如果我们从本地取到了token,那就继续下一步并且跳转到详情页,否则的话让他返回登录页或者报错。

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/140718.html原文链接:https://javaforall.cn

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022年5月8,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档