Talk is Cheap, Show me the Code! <<网站首页文章列表

前言这里只讨论验证码的实现方法，不对验证码的用户体验进行探讨。下面就是今天要讨论的验证码样子：从上图可以看出，这个验证码分为两部分：+ 点击区域（包含文字“猎技公网上科络”，其实就是猎上网络科技）。+ 下方提示区域（包含文字“猎上网络”），提示用户要在点击区域按顺序点击哪些文字。 -------- 点击区域的原始文字分布通过CSS定位，将点击区域的图片展示给用户，通过JS让用户可以在该区域的文字上进行点击和取消点击。 随机定位该区域文字是通过程序进行了随机定位，目的就是打乱顺序，提高识别词组的难度。 随机缩放对所有文字进行了随机的缩放，为了肉眼可辨认，缩放值在一定范围内，再次提高文字识别难度。缩放的原则就是人眼可以快速识别，但是干扰了机器识别。 随机旋转对所有文字在一定角度内进行了旋转，进一步提高识别难度。变形的原则就是，人眼快速识别，但是干扰机器识别。可以进一步对文字进行扭曲等等。 随机颜色对所有文字进行文字前景色的随机，结合背景色的混淆，进一步提高识别难度。 文字识别的干扰还可以对文字区域进行背景图片填充，通过增加像素点的颜色干扰提示识别难度。有时候增加背景图之后，背景图会与随机的文字颜色进行融合，不仅提高了机器识别难度，更增加了肉眼识别难度。因此可以在文字的同坐标下，增加一个与之同缩放同旋转的大一号的浅色相同的文字，作为文字描边。这个描边是在目标文字之下的，所以不会是一个完全描边，但是大大降低了肉眼识别难度。---- 目标文字分布通过CSS定位，将提示区域的图片展示给用户，并在图片前方提示用户“按顺序