登录+权限验证+动态菜单+按钮权限
文章目录
前端登录代码
前端生成uuid,携带账号密码与验证码请求后端,登陆成功后获得登录用户信息,菜单权限信息,按钮权限信息保存至本地,跳转至主页面
data() {
return {
base64Str: '',
loginForm: {
uuid: '',
username: '',
password: '',
captcha: ''
}
}
}
methods: {
//获得图片验证码
async getCaptcha() {
//给uuid赋值
this.loginForm.uuid = this.guid();
//发送请求,给验证码图片赋值
this.base64Str = await getCaptche(this.loginForm.uuid)
},
async doLogin() {
//携带登录需要验证的信息,
let token = await doLogin(this.loginForm);
//使用vue-cookie存储到cookie中token信息,封装好的工具类
auth.setToken(token);
//调用方法获取用户信息
this.getAdminInfo();
},
//获取用户信息
async getAdminInfo() {
//发送请求
let response = await getAdminInfo();
//储存用户信息
localStorage.setItem("userInfo", JSON.stringify(response.admin))
//储存菜单列表
localStorage.setItem("menuList", JSON.stringify(response.menuList))
//储存按钮权限
localStorage.setItem("btnPerm", JSON.stringify(response.btnPerm))
//跳转页面
this.$router.push("/");
},
//获得uuid
guid() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
var r = Math.random() * 16 | 0,
v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
}
}
后端缓存实体类
登录成功后需要保存在redis中的登录用户信息以及权限列表
@Data
public class LoginAdmin {
//登录用户的uuid
private String uuid;
//用户信息
private Admin admin;
//菜单列表
private List<Menu> perms;
}
缓存工具类
用于和redis交互的工具类,使用SpringDataRedis操作,方法包含自定义时间的存值,默认时间的存值,修改或者添加缓存,通过key判断缓存是否存在,通过key获取缓存,删除缓存
@Component
@RequiredArgsConstructor
public class CacheService {
// 默认时间
public static final long defaultTime = 2;
private final StringRedisTemplate stringRedisTemplate;
public void setCacheWithCustomerTime(String key, String value, long minute) {
stringRedisTemplate.opsForValue().set(key, value, minute, TimeUnit.MINUTES);
}
/**
* 有默认时间的缓存
*/
public void setCacheWithDefaultTime(String key, String value) {
stringRedisTemplate.opsForValue().set(key, value, defaultTime, TimeUnit.MINUTES);
}
/**
* 设置缓存
*/
public void setCache(String key, String value) {
stringRedisTemplate.opsForValue().set(key, value);
}
/**
* 判断缓存是否存在
*/
public boolean exitsKey(String key) {
return stringRedisTemplate.hasKey(key);
}
/**
* 获取缓存
*/
public String getCache(String key) {
// 判断key是否存在
if (exitsKey(key)) {
return stringRedisTemplate.opsForValue().get(key);
}
return