简单的数字验证码功能（Spring boot + vue.js ）

卷不过的叫混子

已于 2022-05-24 15:48:59 修改

阅读量714

点赞数

分类专栏： ssm 文章标签： java redis spring boot vue.js

于 2022-05-23 15:31:12 首次发布

本文链接：https://blog.youkuaiyun.com/qq_46112170/article/details/124928068

版权

本文介绍如何结合Spring Boot后端和Vue.js前端，利用Redis存储验证码，实现在登录表单中验证数字验证码的功能。用户需先正确输入验证码，才能继续验证登录密码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前端使用VUE+elementUI在表单中添加验证码的按钮和输入框，登录时先验证验证码，验证通过后才会验证登录密码。

    //验证验证码的
    const verificationCode =reactive({
      answer: '',  //答案
      formula: '', //验证码的公式
    })

    //获取验证码
    const getVerificationCode = () => {
      axios.get("/api/auth/generateVerification").then(res => {
        console.log(res.data);
        if(res.data.code === 200){
          verificationCode.formula = res.data.object;
        }else
        ElMessage.error(res.data.message);
      })
    }
    getVerificationCode();//初始化获取验证码