生成验证码图片
在登录页面,有时候需要用到验证码,所以给大家分享一下如何生成验证码的仔细操作,代码来自我学习的代码:
首先是创建一个目录存放公共静态,写好需要用到的方法,不需要每次用的时候都去创建和命名,这样比较麻烦,所以需要用的时候可以直接添加引用。
然后就是静态的方法,获得随机字符串,接收到随机数的长度(验证码的位数),一般我们接触到的验证码是4-5位随机数。然后创建并命名一个随机类,Random一种随机数生成器。for循环4-5次,验证码有多少位就循环多少次,但是由于随机产生的是数字,所以我们要把它转化为字符。声明一个字符,然后返回一个非负随机整数0-正无穷。
根据当前随机数来确定字符串,如果非负随机整数除以3的余数等于0,那么0x十六进制的30,就加上产生的非负随机整数除以10取余数,然后强制转换char,产生数字;再如果非负随机整数除以3的余数等于1,位数就产生大写字母,A的键码为65,用0x41来代替大写A,加上非负随机整数除以0x1a,除以26位大写字母。同样的否则就产生小写字母a-z。然后把随机字符拼接起来转换为字符串,直接返回。
接着是根据字符串创建验证码图片的方法,但是因为返回的图片是二进制数组,所以方法上我们也是一个数组的类型。然后就是创建命名一个图片相当于空纸,并设置上字符串的长度。我们还需要一个绘图图面,从指定的照片创建图面。然后Clear清除整个绘图面并以指定背景色填充,给图片绘上白色的背景色。然后创建定义一个单色画笔。DrawString绘制字符串的方法,在图面g上进行绘制需要的字符串,文字样式,画笔,图面的xy轴。计算机的话原点在左上角。
验证码的作用是什么呢,是为了避免不是人为的登录。在图片上不能仅仅的绘制文字和数字,所以我们要绘制干扰线,新实例一个随机数生成器,绘制10条干扰线,多了我们看不清楚。然后就遍历循环,我们要绘制一条线,线是两个点来决定的,所以就需要随机两个坐标(x,y),同时线不能超出图片,所以x轴不能超出图片的宽度,y轴不能超出图片的高度。就需要用到随机数生成器的一个Next方法,返回一个小于指定最大值的非负随机整数。所以x,y的值只能小于最大值,不能等于或者超过。DrawLine绘制一条连接由坐标对指定的两个点的线条,在绘制图面上用一个单色的画笔对两个坐标的一个点进行连接形成一条线。
画干扰线可能还不太够,再画一些干扰点,点多一点不碍事,一个点需要一个随机坐标(x,y)。和画干扰线的操作略有不同,在图片上设置一个像素点,随机产生一个颜色。
然后就是最外面的边框,DrawRectangle绘制一个矩形,用蓝色的笔去绘制,坐标,还有图片的宽高度。图片完成后将它以jpeg图片格式保存到内存流MemoryStream中。最后流内容写入byte数组直接返回。
然后就是生成验证码图片,引用相应目录后,就可以添加静态文件。生成5位验证码字符串,根据生成的验证码字符串生成验证码图片的一个byte数组。再将验证码字符串存进session中,最后以一个二进制数组,照片的格式返回到视图。
在验证码的图片img源代码中写上路径,并写上点击事件。当我进行登录验证,验证码不清晰点击更换图片的时候,在下面第一种写法上是没有任何图片更换效果。为什么没有进行更换验证码字符串的操作,事实上点击事件是有在执行的。但是在浏览器的一个缓存机制中,产生一个图片的时候,浏览器也缓存了一份下来,当你点击进行更换验证码,发送了相同的路径,浏览器就把缓存下来的图片发送过来。所以当我们清除缓存的时候,就有一次的更换效果,但是不可能每点击一次验证码图片就清除一次缓存,这样太麻烦了。
如果路径不同,就可以防止缓存,但是路径不能直接改变,我们就改变参数,添加当前的时间作为参数发送过去,时间精确到毫秒,所以每次产生的路径都不一样。因此每次点击都能更换不同的验证码。详细的操作基本给大家分享完了,希望分享的内容对你们有用。
如果哪里分析不够恰当或者不清晰的地方请海涵,还可以在评论下面进行点评和指正~