陈义中 李松林

摘要：验证码对提高网站安全尤为重要，通对过一些常见验证码进行比较分析发现，图片验证码更适合大多数系统或网站的验证方式。设计并开发了一种注册登录系统图片验证码，阐述了其设计构思及关键技术实现。

关键词关键词：验证码；图片验证码；信息安全

DOIDOI：10.11907/rjdk.161891

中图分类号：TP319文献标识码：A文章编号文章编号：16727800（2016）007008204

0引言

随着人们网络安全意识的提高，验证码技术越来越受到重视。注册登录系统加载验证码后可以有效避免不良用户恶意连续登录以及黑客的暴力破解与攻击。国内TOP100论坛中，超过80%的论坛在注册、登录或发帖等功能模块中均采用了图形验证码技术。本文比较分析了一些常见验证码，设计开发了一种注册登录系统图片验证码，并详细阐述了其设计构思及关键技术实现。1常见验证码

验证码（CAPTCHA）是“Completely Automated Public Turing test to tell Computers and Humans A-part”，即“全自动区分计算机和人类的图灵测试”。验证码的主要作用是防止一些黑客盗取或恶意破解密码，以及刷票、论坛灌水、刷页等操作，以有效预防某个黑客对某一个特定注册用户用特定程序暴力破解方式进行不断的登陆尝试。随着验证码技术的不断发展，不同种类的验证码相继出现，但其安全性、时效性、交互性都存在一些不足。1.1纯文本式验证码

纯文本式验证码显示信息包含字母、数字或随机的4位字符串等。一旦验证码中的单个字符能被顺利地提取出来，则采用成熟的OCR技术就很容易识别这类验证码。这是最早期的验证码，安全性非常低，形同虚设，目前基本不被采用。1.2图片验证码

图片验证码采用随机生成的若干数字或字母组成一张图像，然后在图像上布满杂点等干扰像素或者是对字母数字进行旋转、变形、扭曲等操作，迫使用户用肉眼辨认出图片中的一串符号并手工输入到文本框，如GIF、PNG、BMP、JPG和XBM格式图片验证码、汉验图片验证码、韩文或日文图片验证码、问题（计算）图片验证码等。目前，大多数系统或网站都采用图片验证码。1.3邮件验证码

当用户在网页指定位置填入用户的电子邮箱后，系统将随机产生的验证码发到用户电子邮箱，用户再登录电子邮箱获取系统发送的验证码，安全性有一定保障。但这种验证方式较为繁琐，且耗时较长。1.4手机验证码

手机验证码需要用户在网页中输入手机号码来接收验证码，是比较有效的验证码，但这种方式涉及用户个人隐私，用户很排斥，只有少数安全级别要求非常高的行业采用，如银行、民航等。

综上所述，图片验证码是一种大多数网站或系统较为适用的验证方式。本文考虑设计一种图片验证码，其显示信息是由一组图片组成（如动植昆虫类、食品果蔬类等），从图片信息认知上提高图片验证码的识别难度，从而提高图片验证码的安全性。

2图片验证码设计与实现

2.1设计思路

在服务端新建一个图片文件夹，然后从该图片文件夹里找出8张图片，再将这8张图片合成一张大图，并在这8张小图里面随机生成一个要用户验证的图片分类，如小狗、啤酒等。当用户访问登录页面时，将图片加载上去，用户选择提示所需图片，当用户点登陆时，根据用户选择的所有坐标判断所选的图片是否为实际上的验证图。验证流程如图1所示。

2.2具体实现

2.2.1文件夹建立

在服务端新建一个图片文件夹，图片文件结构如图2所示。文件夹的结构及分类要便于后面生成用户要选择的Key图片以及取出8张小图合并成大图。

2.2.2图片选取

从新建的图片文件夹中选取图片，每次选择8张图片，并在选取图片时采用递归算法，保存选取的每一个图片的Path，再进行图片去重，保证选取的图片不重复。核心代码如下：

2.2.3图片分类

将选取的8张图片进行分类，并保存在一个数组中，然后用随机数从分类中选取一个分类作为Key分类，也即用户要选择的所有图片。因为数组是有序的，可以遍历数组中的元素，获取每个key分类图片的位置，在用户点击登录时，进行验证匹配。核心代码如下：

2.2.4图片合并

从图片文件夹中选取不重复的8张图片后，再将选取到的这8张图片合成一张大图。8张图片合成效果如图3所示。

核心代码如下：

2.2.5分类保存

在Controller层中，先将Key分类保存到Session中，为用户选择图片分类作提示，并为图片验证作判断，然后将图片流输出到Response中，就可以生成验证图片。验证码效果如图4所示。

在jsp中，为用户的点击生成小图片标记。当用户点图片击时，在父div上添加一个子div标签，并且将它定位为relative， 并且设置zIndex，然后在这个div上添加一个img标签，定位为absolute。在用户点击时，可以获取点击事件，根据点击事件获取点击坐标，然后减去父div的坐标，就可以获取相对坐标。可以根据自己的喜好定坐标原点，这里的坐标原点是第8个图片的右下角。点击图片标记效果如图5所示。

核心代码如下：

2.2.7图片判断验证

用户根据图片的提示信息，选择并点击验证码图片后，再点击登录按钮，服务器端会加载先前保存的Key分类与用户选择并点击的图片进行坐标比对判断，如果一致，验证登录成功，否则需要用户根据提示信息重新选择认为正确的验证码图片，或者点击刷新后，按新的提示信息重新选择。

2.2.8图片刷新

用户根据图片提示信息选择验证码图片时，对当前显示的8张图片不认识或没把握确认时，或者点击验证登录失败，都可以点击刷新按钮，系统会重新加载8张图片，刷新功能有利于用户正确选择判断。当点击刷新生成新的图片时，由于ajax不支持二进制流，可以自己用原生的xmlHttpRequest对象加html5的blob来完成。核心代码如下：

3结语

这种注册登录系统图片验证码中的图片来源可以设计得非常丰富，具有信息量大、排列组合多等特点，可在一定程度上有效防止程序自动攻击和人为破坏，从而提高系统的安全性。并且，这种带游戏性质的验证交互方式，也为用户带来了更有趣的验证过程，提升了用户的交互体验。此外，在验证图片中植入广告，可起到不错的宣传作用并带来一定的经济效益

参考文献：

袁芳.基于ASP.NET 的验证码生成技术研究[J].科技广场，2013（2）：4043.

李志云.基于ASP.NET的汉字验证码的研究与实现[J].数字技术与应用，2013（3）：117118.

李德平.一种彩色图形验证码在WEB开发中的应用研究[J].清远职业技术学院学报，2014，7（3）：