最近对前端注册和登录的验证码感兴趣,研究了一下;
开始研究时候主要有以下几个问题;
1,前端的验证码图片是怎么生成的(jQuery/js前端直接生成还是通过java,swing绘图而刷到前端的)
2,如果是jQuery的话,生成了验证码图片,是怎么把这个生成的字符刷到后台,而进行验证的;
3,如果是java swing 绘图生成图片,是怎么把这个图片刷到前端的,后端又是怎么判断的;
带着这几个问题开始了研究:
1:首先是利用java swing的绘图工具在服务端绘图输出的工作原理:
前端设置一个img标签,绑定一个onclick事件,图片的src地址(第一次加载的时候就会显示),是项目名加这个servlet,也就是说当点击事件发生后servlet收到请求,并把绘制的图片响应出去,当然onclick事件里面的函数也是一个同样一个src,每次点击则重新加载一次src,需要注意的是:浏览器会判定是否重复提交链接,如果重复提交的话,则不发出请求,所以,要在后面加上一个每次都会变的值(获取当前事件,或者用math的random方法生成一个随机数),来激发servlet的每次校验运行,这样的一个小技巧能够实现局部刷新;
服务端的变化是:通过java swing一个servlet生成一个图片,谁请求这个servlet,就利用此servlet里面的响应函数,把图片响应出去,响应的前端则是一个利用一个img标签的src链接请求到这个servlet;请求收到后,则通过字节输出流输出到前端的img标签,浏览器在响应的img标签的位置解析到图片,则一次请求响应完成;
这个方式是增加了服务器的压力,但安全性高,把生成的验证码可以存到session会话里面进行验证
2:利用jQuery方式自动生成验证码,把验证码请求到后台的方式;
jQuery:验证码一套功能包主要包括:
a.点击图片,局部刷新
b.失去焦点验证:是否为空都给出响应的提示
c.前端验证码进行校验,成功则可以进行提交,失败则不能提交
当然我们研究的核心是怎么对这种blackbox,放到我们想用他们的地方;
是用img标签进行绘图显示吗,点击刷新绑定onclick事件的话怎么把这两个事件绑定到一起?
这种方式虽然服务器压力小了,但是相对于服务器校验安全性较低,可以进行模拟浏览器进行诱骗提交(绕过前端验证,直接对相应的服务层进行数据提交),进行暴力密码破解;所以用这种方式进行校验的话,最好在服务器端进行账号登录错误次数限制,更改密码后当日恢复登录限制;