千峰商城-springboot项目搭建-52-基于token实现前后端分离用户流程及用户认证的实现…

追求适度,才能走向成功;人在顶峰,迈步就是下坡;身在低谷,抬足既是登高;弦,绷得太紧会断;人,思虑过度会疯;水至清无鱼,人至真无友,山至高无树;适度,不是中庸,而是一种明智的生活态度。

导读:本篇文章讲解 千峰商城-springboot项目搭建-52-基于token实现前后端分离用户流程及用户认证的实现…,希望对大家有帮助,欢迎收藏,转发!站点地址:www.bmabk.com,来源:原文

在单体项目中如何实现用户认证?

在单体项目中如何保证受限资源在用户未登录的情况下不允许访问?

千峰商城-springboot项目搭建-52-基于token实现前后端分离用户流程及用户认证的实现...

在单体项目中,视图资源(页面)和接口(控制器)都在同一台服务器。用户的多次请求都是基于同一个会话(session),因此可以借助session来进行用户认证判断。

1.当用户登录成功之后,将用户信息存放到session。

2.当用户再次访问受限资源时,验证session中是否存在用户信息,可以根据session中有无用户信息来判断用户是否登录。

前后端分离开发项目中如何实现?

千峰商城-springboot项目搭建-52-基于token实现前后端分离用户流程及用户认证的实现...

1.基于token的用户认证的实现

//UserController
@GetMapping("/login") public ResultVO login(@RequestParam("username") String name,@RequestParam(value = "password") String pwd){ ResultVO resultVO = userService.checkLogin(name,pwd); return resultVO; }

//UserServiceImpl
public ResultVO checkLogin(String name, String pwd) {
        //1.根据账号查询用户信息 Example example = new Example(Users.class); Example.Criteria criteria = example.createCriteria(); criteria.andEqualTo("username",name); List<Users> users = usersMapper.selectByExample(example); //2.判断。如果user=null则错误 if (users.size() == 0){ //用户名不存在 return new ResultVO(ResStatus.NO,"登录失败,用户名不存在",null); }else { //3.对输入的密码进行加密 String md5Pwd = MD5Utils.md5(pwd); //4.使用加密后的密码 和 user中的密码进行匹配。 if (md5Pwd.equals(users.get(0).getPassword())){ //如果登录验证成功,则需要生成令牌token(token就是按照特定规则生成的字符串) String token = Base64Utils.encode(name+"QIANfeng6666"); //验证成功 return new ResultVO(ResStatus.OK,token,users.get(0)); }else { //密码错误 return new ResultVO(ResStatus.NO,"登录失败,密码错误!",null); } } }

2.登录页面接收到token存储到cookie(login.html)

                   doSubmit(){
                       if(vm.isRight){
                           var url=baseUrl+"user/login"; axios.get(url, { params:{ username:vm.username, password:vm.password } }).then((res)=>{ var vo=res.data; //console.log(vo); if(vo.code=10000){ //如果登录成功就把token存储到cookie setCookieValue("token",vo.msg); window.location.href="index.html"; }else{ vm.tips="账号或密码错误"; } }); }else{ vm.tips="请正确输入账号和密码"; } }

3.购物车页面加载时访问购物车列表接口

获取token,携带token访问接口。

        <script type="text/javascript">
            var baseUrl = "http://localhost:8080/";
            var vm = new Vue({ el:"#container", data:{ token:"" }, created(){ //当进入到购物车页面时,就要查询购物车列表(访问购物车列表接口) this.token = getCookieValue("token"); axios({ method:"get", url:baseUrl+"shopcart/list", params:{ tokrn:this.token } }).then(function(res){ console.log(res); }); } }); </script>

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/128123.html

(0)
飞熊的头像飞熊bm

相关推荐

发表回复

登录后才能评论
极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!