前言
首先,告诉大家一个好消息:
DncZeus
v2.0.0版本发布,在这个版本中已支持动态权限路由及菜单渲染。
基于.NET Core和Vuejs(iView)的前后端分离的通用后台管理系统框架DncZeus自发布以来也有5个多月时间了,其中得到了不少开发者们的认可。
托管在github的仓库累计获得了近400颗星(本文写作时已有396个Stars)。
首先,在这里感谢码友们(特别是.NET开发者)的支持,还有为DncZeus
作出贡献的taadis以及QQ交流群(483350228)中的诸位好友们,不一一列出名字了。
感谢你们的贡献,建议和意见。感谢你们让DncZeus
越来越完善。
今天Rector写这篇文章与大家分享一下DncZeus
的用户鉴权及动态权限数据流的整个过程。
从此以后,除了通用的系统级默认路由外,开发者可以不用再在router.js
路由配置文件中手动添加每一个路由及页面映射关系了,你现在可以将需要动态权限控制的路由添加到后台管理系统,将由角色权限模块来控制用户的动态路由映射。
有没有被惊喜到呢???哈哈。。。
说了这么长的废话了,下面我们进入正题,来详细了解一下v2.0.0版本作出的一些变更。
登录/验证/授权/动态路由流程与控制
要了解DncZeus
的用户权限控制,我们需要先了解DncZeus
框架从用户登录,到信息验证,再到授权,最后到动态路由绑定的整个流程。这个流程也是许多使用者经常反馈的问题。
在这里我就结合DncZeus
这个框架进行说明。
资源访问和保护机制
DncZeus
鉴权是基于JWT的令牌(token)认证的,要访问后端受保护资源,必须提供可用的令牌(token)。
注:关于什么是JWT?JWT的工作原理是什么?等等问题请自行查阅资料,不是本文的重点,不做更多说明。
这里,我整理了一张关于DncZeus
项目前后端分离用户权限数据流的图,如下:
下面,我们根据这张图,一步一步解析:
第一步.登录验证
用户在浏览器输入登录名和密码,点击[登录]按钮之后,DncZeus.App
前端项目(后文简称前端)会向DncZeus.Api
后端项目(后文简称后端)发送一个HTTP(GET)的登录验证请求,请求地址为:
当后端接收到登录验证请求后,会验证用户的信息,包括用户是否存在,用户状态是否正常,用户名密码是否匹配等等,如果验证通过,则会调用令牌(token)生成器,为当前用户生成一个可用的令牌(这个令牌中包含了一些重要但不敏感的用户基础数据,如:用户名,用户类型等,这些数据将作为令牌的一部分被以后的授权访问所携带),然后将这个令牌返回给前端,返回的令牌JSON如下:
前端从返回的JSON数据中读取令牌并将其存储到浏览器的本地存储(localStorage),以便后续(如:用户进行系统后刷新页面)读取和使用。
第二步.拉取用户基础数据
由于后端其他资源绝大部分是受保护的(设置了Authorize即为受保护资源)。所以在访问这些受保护资源的时候,需要在请求头部(Request Headers)携带Bearer令牌,形如:
设置请求头的令牌操作,在DncZeus
的前端是由axios这个组件的请求拦截器完成的,你可以查看DncZeus
拦截器axios.js实现源码了解具体实现。
注:
DncZeus
封装了axios
,所有通过util\axios
这个组件发起的请求,都将自动携带令牌(token)。
当用户登录信息验证成功并获取到令牌(token)之后,我们需要获取当前用户的一些基础数据(如:用户ID,头像,可用权限列表等),请求地址为:
当后端接收到此请求后,由于”AccountController/Profile”配置了[Authorize]鉴权属性,所以将先触发请求权限验证拦截器。后端系统会自动从请求头部中获取携带的令牌,并验证令牌的有效性,如果没有令牌或者令牌无效,则直接返回UnauthorizeException
(未授权的访问)的错误。如果鉴权成功,则根据需要查询用户的基础数据并返回如下类似的数据:
其中的permissions
即为当前用户可以访问的所有路由页面分别对应的可用权限集合。当前端接收到这些数据之后,将这些数据分别写入到Vuex的全局状态管理器中,以便在前端程序的整个生命周期中使用这些基础数据。
第三步.接取权限菜单并动态配置路由
完成上面两步之后,用户可以进入系统,但没有菜单,因为我们还没有拉取当前用户可用的菜单。
接下来,我们再一次发送携带令牌的HTTP(GET)请求以拉取当前用户的可用的菜单,请求地址为:
后端同样需要作鉴权,如果鉴权成功,则读取当前用户的可用菜单列表并返回类似如下的菜单JSON数据:
前端接收到此菜单JSON后,将其解析将转换成Vue.js的路由格式,同时动态添加到前端路由表中。
至此,DncZeus
的前端用户登录,鉴权以及动态路由就完成了,直接跳转进入系统即可。
以上就是DncZeus
框架的整个用户权限数据流的介绍,如果你还有什么问题,欢迎交流反馈。
我是Rector,希望本文对你或者他人有所帮助。
如果你觉得本文对你有用,请为我点赞,感谢阅读!!!
版权声明:本作品系原创,版权归码友网所有,如未经许可,禁止任何形式转载,违者必究。
发表评论
登录用户才能发表评论, 请 登 录 或者 注册