SSM实现验证码功能

时间：2021-08-28 来源：互联网编辑：宝哥软件园浏览：次

源码：https://github。com/Hannahlihui/StudentManager-SSM/tree/master/SSM-git/StudentManager-SSM-master

1.前端有一个图片引入，这里this.src=this.src '？就会调用映射到后台的checkCode

El-form-item prop=' code ' img src=' Http : CheckCode ' alt=' width=' 100 ' height=' 32 ' class=' password ' style=' height :43 px；光标：指针指针；float : left ' onclick=' this . src=this . src '？'el-input v-model='login.code '占位符='请输入验证码style=' width : 100 pxfloat : center '自动完成=' off '/El-input/El-form-item 2 .后台返回一个图片

@请求映射(值='/校验码')公共无效校验码(HttpServletrequest请求，HttpServletResponse响应)引发ServletException，IOException { //设置相应类型，告诉浏览器输出的内容为图片回应。setcontenttype(' image/JPEG ')；http会话会话=请求。getSession()；//设置响应头信息，告诉浏览器不要缓存此内容response.setHeader('pragma '，' no-cache ')；response.setHeader('缓存控制','无缓存');response.setDateHeader('Expire '，)；RandomValidateCode RandomValidateCode=new RandomValidateCode()；尝试{ randomvalidatecode。getrandcode(请求、响应);} catch(异常e){ e . print stack trace()；} }3.是通过RandomValidateCode生成随机字符串以及图片。下面这个代码可以直接用一下。来自：

https://www.jb51.net/article/152255.htm

公共类RandomValidateCode { public static final String RANDOMCODEKEY=' randomcode _ key '；//放到会议中的私钥Random Random=new Random()；私有字符串randString=' 0123456789 abcdefghijklmnopqrstuvwxyz '；//随机产生的字符串私有int宽度=80;//图片宽private int height=26//图片高private int lineSize=40//干扰线数量private int StringNum=4；//随机产生字符数量/** * 生成随机图片*/public void getRandcode(HttpServletrequest请求，HttpServletResponse响应){ HttpSession session=request。getSession()；//BufferedImage类是具有缓冲区的图像类图像类是用于描述图像信息的类图片图像=新的BufferedImage(宽度、高度、BufferedImage .TYPE _ INT _ BGR)；//产生图像对象的制图法对象，改对象可以在图像上进行各种绘制操作图形g=图像。getgraphics()；g.fillRect(0，0，宽度，高度);g.setFont(新字体(《新罗马时代》，字体罗曼_基线，18)；g.setColor(getRandColor(160，200))；//绘制干扰线for(int I=0；I=lineSizeI){ DrowLine(g)；} //绘制随机字符string randomString=for(int I=1；I=string numi){ randomString=drowString(g，randomString，I)；}会话。移除属性(RANDOMCODEKEY)；会话。setattribute(RANDOMCODEKEY，randomString)；g .处置()；尝试{ //将内存中的图片通过流动形式输出到客户端ImageIO.write(图像，' JPEG '，响应。getoutputstream())；} catch(异常e){ e . print stack trace()；} } /* * 获得字体*/private Font getFont(){ 0返回新字体(“固定系统”，字体.中心_基线，18);} /* * 获得颜色*/private Color getRandColor(int fc，int BC){ if(fc 255)fc=255；如果（公元前255年)公元前=255年；int r=fc随机。nextint(BC-fc-16)；int g=fc随机。nextint(BC-fc-14)；int b=fc随机。nextint(BC-fc-18)；返回新颜色(r、g、b)；} /* * 绘制字符串*/private String drowString(Graphics g，String randomString，int I){ g . setfont(getFont())；设置颜色(新颜色(随机。nextint(101)，random.nextInt(111)，random。nextint(121)))；字符串rand=字符串。getRandomString(随机)的值。nextint(randstring。length()))))；randomString=randg . translate(random . nextint(3)，random。nextint(3))；g . drawling(rand，13*i，16)；返回randomString} /* *绘制干扰线*/private void drowLine(Graphics g){ int x=random。nextint(宽度)；int y=random.nextInt(高度);int XL=随机。nextint(13)；int yl=随机。nextint(15)；g.drawLine(x，y，x xl，y yl)；} /* * 获取随机的字符*/public String getRandomString(int num){ return String。(randstring)的值。charat(num))；}}

4.至于验证验证码就是我弄了半天的东西。

因为我不太会某视频剪辑软件然后写前端研究了会会才知道它是怎么用的。然后我开始是想从前端拿到后端的会话，但是某视频剪辑软件这个是超文本标记语言页面，不能%@ %引入爪哇岛代码，然后我又试了一下射流研究…的创建交互式、快速动态网页应用的网页开发技术引入，但是报错，vue框架我也不太懂。然后还是交给后端验证嘛。

然后就很简单了，从注册那里验证，提交的时候多了一个验证码，但是我觉得这样做其实是不太好的，因为验证码跟登录一起验证，有点耗时，分开比较好。

submitForm(登录){这个.$ refs[登录]。验证((有效)={ if(有效){ this.loadings//加载动画//窗口。警惕(这个。登录。代码)；这个$http.post('/login '，{ username : this。登录。用户名，密码：这个。登录。密码，记住： this.login。记住，代码：this.login.code }).然后（结果={ //window.alert(结果));//判断用户是否登录成功，后端返回数据格式数据，不然娶不到数据if(结果。尸体。成功){ alert(' success ')；窗户。位置。href='/lisstudentinfo '；这个。装货。close()；//关闭动画加载} else { //弹出错误信息框这个$emit('submit-form '，这$ message({ message :结果。尸体。消息，类型：“警告”，持续时间： 6000 })，)；//清空表单状态这个参考文献[.登录]。resetFields()；} });} else { this .$emit('submit-form '，这$ message({ message : ’)输入信息有误!',键入："警告“，duration: 6000 })，)；返回false } })；}、@RequestMapping('/login ')公共结果登录(@RequestParam(值='用户名'，必选=false)字符串用户名，@RequestParam(值='密码'，必选=false)字符串密码，@RequestParam(值='代码'，必选=false)字符串代码，HttpServletRequest请求请求){字符串错误=nullhttp会话会话=请求。getSession()；System.out.println(代码);//系统。出去。println(会话。GetAttribute(randomvalidate代码.RANDOMCODEKEY))；if(用户名==null | | session。getattribute(RandomValidateCode .RANDOMCODEKEY).等于（代码)){//System.out.println('代码有问题');返回新结果（假，错误);}//System.out.println(密码);//System.out.println('调试');主题主题=安全实用程序。getsubject()；usernamepasswortoken=新的usernamepasswortoken(用户名、密码);如果（记住！=null){ if(内存。equals(' true '){//说明选择了记住我令牌。setrememberme(true)；} else { token。setrememberme(false)；} } else { token。setrememberme(false)；}系统。出去。println(令牌。isrememberme())；尝试{subject.login(令牌);结果re=新结果（真，"成功");返回新结果（真，错误);} catch(未知帐户异常e) { System.out.println('登陆出错');错误='用户账户不存在，错误信息：' e . GetMEssage()；}catch(不正确的凭证例外){ System.out.println('用户名和密码不匹配');错误='用户名或密码错误，错误信息：' ex。getmessage()；} catch(AuthenticationException e){ system。出去。println('其他的登陆错误');错误='错误信息：' e . GetMEssage()；}返回新结果（假，错误);}5 .会话

简单说一下我理解的会议和甜饼干的区别吧，会话是保存在服务端的嘿，饼干是保存在客户端的，就是本地会有一个文件夹专门保存饼干。甜饼干主要是为了保存用户状态嘛，因为超文本传送协议(超文本传输协议的缩写)是无状态的连接，每次连接完就不会知道下一次是不是同一个用户。但是保存用户信息在很多应用场景中都是必要的。而会议比甜饼干更加安全，因为会议信息保存在服务端的，不容易被盗用。所以重要登陆信息还是应该保存在会议上。而且服务端能够保存的会议比较大，而单个甜饼干一般不超过两万。

会议是怎么保存用户信息的呢？就是一个用户有一个sessionId，通过便会失效保存用户信息。

会议的使用：

session.setAttribute('key '，' value ')；会话。GetAttribute(' key ')；6.登陆界面