我是靠谱客的博主 粗犷帆布鞋,最近开发中收集的这篇文章主要介绍对于搭建nginx后前后端分离的用户信息存储问题对于搭建nginx后前后端分离的用户信息存储问题,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

对于搭建nginx后前后端分离的用户信息存储问题

我们后端使用springboot技术、shiro、reids非关系型数据库、mysql关系型数据库和mybatis-plus

 public CommonResult findByNameAndPassword(LoginVo loginVo) {
        QueryWrapper<User> wrapper=new QueryWrapper<>();
        wrapper.eq("username",loginVo.getLoginName());
        wrapper.eq("password",loginVo.getPassword());
        User user=userDao.selectOne(wrapper);
        if(user!=null) {
            //把用户的信息保存到redis中。
            //随机产生一个Key
            String key = UUID.randomUUID().toString().replace("-", "");
            redisTemplate.opsForValue().set(key,user,24, TimeUnit.HOURS);
            return new CommonResult(2000, "登陆成功", key);
        }else{
            return new CommonResult(5000, "登陆失败", null);
        }
    }

我们通过后台技术把用户信息存储到redis中,这样就可以保证用户信息的完整性,后续操作可以通过存储的key值进行存取用户信息,那么如何保证用户登录后的每次请求都可以带着此key值,让后台查询呢?

假如这是一个vue的登录axios请求,当请求到上面的后台后,后台返回key值后可以使用sessionStorage.setItem(“token”,resp.data.result)方法把返回的key存到消息头中,(“token”,resp.data.result),然后就可在后台根据token作为key值,取到存放用户信息到reids时的key,继而取到用户的信息使用,

//登陆方法
              login(){
                   var that=this;
                   this.$refs.loginFormRef.validate((valid) => {
                        if (valid) {
                             this.$http.post("http://localhost:8888/sys/login/login",this.loginFormData).then(function(resp){
                                  if(resp.data.code===2000){
                                       that.$message.success(resp.data.msg);
                                       //把用户的key保存起来. sessionStorage   | localStorage 本地
                                       sessionStorage.setItem("token",resp.data.result)
                                       that.$router.push("/home")
                                  }else{
                                       that.$message.error(resp.data.msg);
                                  }
                             })
                        }
                   });

在main.js中配置请求拦截器

axios.interceptors.request.use(config=>{
  var token = sessionStorage.getItem("token");
  if(token){
    //如果token不为空,就把token带到每个请求的请求头上
    config.headers.token=token;
  }
  return config;
})

在后台可以通过request对象取到token的值

 HttpServletRequest req= (HttpServletRequest) request;//多态  向下转型
String token = req.getHeader("token");

路由守卫

通过设置登录后信息存放在以后每次消息的消息头中
我们可以通过路有守卫来拦截未登录直接在地址栏上访问页面的现象。

在这里插入图片描述

//设置路由守卫
//to:路由跳转的路径
//from: 从哪跳转来的。
//next():执行
router.beforeEach((to,from,next)=>{
  var path = to.path;
  if(path=="/login"){//如果跳转路径为login路径则放行
    return next();
  }
  var token =sessionStorage.getItem("token");
  if(token){
    return  next();//已经登陆则放行放行
  }
return next("/login")//未登录跳转到login页面
})

最后

以上就是粗犷帆布鞋为你收集整理的对于搭建nginx后前后端分离的用户信息存储问题对于搭建nginx后前后端分离的用户信息存储问题的全部内容,希望文章能够帮你解决对于搭建nginx后前后端分离的用户信息存储问题对于搭建nginx后前后端分离的用户信息存储问题所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(66)

评论列表共有 0 条评论

立即
投稿
返回
顶部