RuoYi-Vue( 一 )

RuoYi-Vue

登录流程

首先进入登陆界面 login

在Vue中查看前端页面进行分析查看进行了哪些请求

在这里插入图片描述

前端页面的逻辑点

  1. 输入密码框 验证码框 可以进行enter进行登录执行handleLogin方法
    在这里插入图片描述

  2. 在验证码图片位置有一个click事件 执行getCode
    在这里插入图片描述

在页面刷新时就会获取图片

在这里插入图片描述

是在创建周期进行调用方法进行获取验证码和cookie

分析获取验证码方法

在这里插入图片描述

调用 “@/api/login” 中的getCodeImg方法

在这里插入图片描述

进入login.js里面 发现 调用 ‘@/utils/request’ 中的 request()封装函数

在这里插入图片描述

发现里面是axios的封装 从而导出的request请求对象

我们返回来分析

在这里插入图片描述

https://www.cnblogs.com/skuld-yi/p/14599594.html

里面的then是一个异步请求,所以就需要自己复习!!

cookies

在这里插入图片描述

这里面获取cookies也是进行工具类的封装

接下的地方需要进行分析

在这里插入图片描述

处理登录时使用handleLogin 函数进行处理,使用this.$store.dispatch("Login", this.loginForm) 进行store里面的user.js的action中的Login方法进行调用login的登陆方法

user.js 里面调用
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

登录 login getCodeImg

后端分析

/login

在这里插入图片描述

请求登录后,会返回前端接口访问成功的Ajax返回体

然后通过login方法生成token返回前端

 /**
     * 登录验证
     * 
     * @param username 用户名
     * @param password 密码
     * @param code 验证码
     * @param uuid 唯一标识
     * @return 结果
     */
    public String login(String username, String password, String code, String uuid)
    {
        // 获取配置判断是否开启验证码
        boolean captchaEnabled = configService.selectCaptchaEnabled();
        // 验证码开关
        if (captchaEnabled)
        {
            validateCaptcha(username, code, uuid);
        }
        // 用户验证
        Authentication authentication = null;
        try
        {
            //SpringSecurity 中的类实体
            UsernamePasswordAuthenticationToken authenticationToken = new UsernamePasswordAuthenticationToken(username, password);
            // SpringSecurity 设置的session存储器 设置session中的信息,便于在后续的操作中访问session中的内容
            AuthenticationContextHolder.setContext(authenticationToken);
            // 该方法会去调用UserDetailsServiceImpl.loadUserByUsername
            authentication = authenticationManager.authenticate(authenticationToken);
            
            // authenticationManager 里面为接口  里面只有一个ProviderManager实现类 里面的authenticate验证方法 会调用 AuthenticationProvider 里面的authenticate方法 而其本身也是接口类型 他有一个 bstractUserDetailsAuthenticationProvider 抽象类 而这个类被继承后就可以自定义实现用户的验证方式和方法
        }
        catch (Exception e)
        {
            if (e instanceof BadCredentialsException)
            {
                AsyncManager.me().execute(AsyncFactory.recordLogininfor(username, Constants.LOGIN_FAIL, MessageUtils.message("user.password.not.match")));
                throw new UserPasswordNotMatchException();
            }
            else
            {
                AsyncManager.me().execute(AsyncFactory.recordLogininfor(username, Constants.LOGIN_FAIL, e.getMessage()));
                throw new ServiceException(e.getMessage());
            }
        }
        finally
        {
            AuthenticationContextHolder.clearContext();
        }
        //异步执行日志记录
        AsyncManager.me().execute(AsyncFactory.recordLogininfor(username, Constants.LOGIN_SUCCESS, MessageUtils.message("user.login.success")));
        //这里判断认证信息和验证码没有错误,进行认证信息获取,在下面进行登录信息记录
        LoginUser loginUser = (LoginUser) authentication.getPrincipal();
        recordLoginInfo(loginUser.getUserId());
        // 生成token
        return tokenService.createToken(loginUser);
    }

/captchaImage

 @GetMapping("/captchaImage")
    public AjaxResult getCode(HttpServletResponse response) throws IOException
    {
        AjaxResult ajax = AjaxResult.success();
        boolean captchaEnabled = configService.selectCaptchaEnabled();
        ajax.put("captchaEnabled", captchaEnabled);
        if (!captchaEnabled)
        {
            return ajax;
        }

        // 保存验证码信息 接下来要在redis中进行读取比对
        String uuid = IdUtils.simpleUUID();
        String verifyKey = CacheConstants.CAPTCHA_CODE_KEY + uuid;

        String capStr = null, code = null;
        BufferedImage image = null;

        // 生成验证码
        String captchaType = RuoYiConfig.getCaptchaType();
        if ("math".equals(captchaType))
        {
            String capText = captchaProducerMath.createText();
            capStr = capText.substring(0, capText.lastIndexOf("@"));
            code = capText.substring(capText.lastIndexOf("@") + 1);
            image = captchaProducerMath.createImage(capStr);
        }
        else if ("char".equals(captchaType))
        {
            capStr = code = captchaProducer.createText();
            image = captchaProducer.createImage(capStr);
        }

        //存入redis中验证码信息
        redisCache.setCacheObject(verifyKey, code, Constants.CAPTCHA_EXPIRATION, TimeUnit.MINUTES);
        // 转换流信息写出
        FastByteArrayOutputStream os = new FastByteArrayOutputStream();
        try
        {
            ImageIO.write(image, "jpg", os);
        }
        catch (IOException e)
        {
            return AjaxResult.error(e.getMessage());
        }

        ajax.put("uuid", uuid);
        ajax.put("img", Base64.encode(os.toByteArray()));
        return ajax;
    }
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值