html 访问权限控制,用户登录与访问权限控制设计

用户登录与访问权限控制设计

前述

系统用户分为管理员用户、普通用户

管理员用户有且唯一

系统初始状态不存咋任何用户,首次使用需创建用户(admin)

前端界面显示控制

用户管理模块

根据本地credentials判断是否为管理员用户 => 显示/不显示用户管理模块

导航栏模块

功能页面显示导航栏;welcome/login不显示导航栏

动态控制导航栏的显示与隐藏

前端本地控制(进入页面前)-- 路由守卫

welcome/login页面

是否本地存在credentials(包含token及用户信息)(是否属于已登录状态) => 跳转至首页/Next

发送请求至后端 => 后端确认是否首次使用系统(系统有/无任何用户)=> welcome/login页面

功能页面

是否本地存在credentials(是否属于已登录状态) => 进入功能页面/跳转至login

Admin页面

是否本地存在credentials(是否属于已登录状态) => Next/跳转至login

本地credentials是否显示用户为管理员类型 => 进入Admin页面/跳转至404页面

前端向后端请求验证(进入页面后)-- http拦截器

请求发送处理

每个heep请求在请求头带上本地credentials中的token

请求响应处理

返回401状态码 => 删除本地credentials(如果有),跳转至login

否则，不做特殊处理

后端登录与鉴权

登录逻辑

后端接收到前端发送的用户信息