springboot vue登录注册,vue实现登录注册和验证码
这篇文章主要为大家详细介绍了vue springboot实现登录验证码，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
本文实例为大家分享了vue springboot实现登录验证码的具体代码，供大家参考，具体内容如下
先看效果图
在注册页面添加验证码超文本标记语言
在后端砰的一声文件添加卡普查依赖
属国
groupIdcom.github.penggle/groupId
artifactIdkaptcha/artifactId
版本2 .3 .2/版本
/依赖关系
创建KaptchaConfig工具类
包com。才华横溢。模块。系统。控制器。util
impl。defaultkaptcha
导入com。谷歌。代码。你好。util。配置；
导入org。spring框架。语境。注释。豆；
导入org。spring框架。语境。注释。配置；
导入Java。util。属性；
@配置
公共类KaptchaConfig {
@Bean
public DefaultKaptcha getDefaultKaptcha(){
DefaultKaptcha DefaultKaptcha=new DefaultKaptcha()；
性能属性=新属性();
//图片宽
属性。设置属性( kapt cha。形象。宽度， 180 )；
//图片高
属性。设置属性( kapt cha。形象。高度， 50 )；
//图片边框
属性。设置属性( kapt cha。边框，是)；
//边框颜色
属性。设置属性( kapt cha。边框。颜色， 105，179，90 )；
//字体颜色
属性。设置属性( kapt cha。文字制作人。字体。颜色，蓝色)；
//字体大小
属性。设置属性( kapt cha。文字制作人。字体。大小， 40 )；
//会话密钥
属性。设置属性( kapt cha。会话。键，代码)；
//验证码长度
属性。设置属性( kapt cha。文字制作人。夏尔。长度， 4 )；
//字体
属性。设置属性( kapt cha。文字制作人。字体。姓名，宋体，楷体，微软雅黑);
配置配置=新配置（属性);
defaultkaptcha。设置配置(config)；
返回defaultKaptcha
}
}
控制器中，生成的验证码存储在了存储中，用于以后作校验(redis的配置以及依赖自行百度)
@RestController
@RequestMapping(/api/user )
@Api(tags=系统用户管理)
公共类SysUserController扩展抽象控制器{
@自动连线
私有系统用户服务系统用户服务
@自动连线
private DefaultKaptcha DefaultKaptcha；
@自动连线
redistemp
@GetMapping(/createImageCode )
公共void createImageCode(http servlet请求请求，HttpServletResponse响应)引发IOException {
回应。set头( Cache-Control ， no-store，no-Cache )；
回应。设置内容类型(“图像/JPEG”)；
//生成文字验证码
string text=defaultkaptcha。创建文本()；
//生成图片验证码
缓冲图像image=defaultkaptcha。创建图像(文本)；
//这里我们使用存储缓存验证码的值，并设置过期时间为60秒
redisTemplate.opsForValue().set(imageCode ，text，60，时间单位.秒);
ServletOutputStream out=response。获取输出流()；
ImageIO.write(image， jpg ，out)；
出去。flush()；
出去。close()；
}
生成之后，在登录界面输入验证码需要进行校验输入的是否正确
在登录按钮外层加一次请求判断，验证输入的验证码是否正确，根据返回值提示错误信息
@PostMapping(/compareCode )
公共结果比较代码(@请求正文字符串验证码){
如果(!redis模板。haskey(图像代码){
返回结果错误(500，验证码已过期);
}
字符串代码=redis模板。值得操作().get(imageCode ).toString()；
if(字符串实用程序。等于(验证码，代码)){
返回结果。ok()；
}否则{
返回结果错误(500，验证码输入错误);
}
}
这就是本文的全部内容。希望对大家的学习有帮助，支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。