为何每次登陆都有烦人的验证码?

1、应用场景

每次登陆系统的时候老是要输入烦人的验证码,那么咱们今天就思考这个问题,为何要有验证码这个功能? 不少伙伴应该都知道:javascript

  • 防止黑客经过接口调用攻击系统,每次登陆系统要输入验证码就防止机器访问。
  • 作限流处理,防止同一时间产生大量用户的涌入,防止系统崩溃。

验证码的种类
css

  • 传统输入式验证码: 用户输入图片中的字母、数字、汉字等进行验证。简单易操做,人机交互性较好。但安全系数低,容易被攻击。
  • 输入式的图形验证码: 有精美图案,识别文本也清晰可认,专一于广告。一种广告位的展示形式。
  • 纯行为验证码: 照要求将备选碎片直线滑动到正确的位置。操做简单,体验好。单一维度,容易被逆向模拟,与移动端页面切换不兼容。
  • 图标选择与行为辅助: 给出一组图片,按要求点击其中一张或者多张。借用万物识别的难度阻挡机器。安全性强。对于图片、图库、技术要求高。
  • 点击式的图文验证与行为辅助: 经过文字提醒用户点击图中相同字的位置进行验证。操做简单,体验良好,单一图片区域较大,被攻击的难度大。
  • 智能验证码: 经过行为特征、设备指纹、数据风控等技术,正经常使用户免验证,异经常使用户强制验证。简单便捷,区分人与机器、人与人、设备与设备。

2、不一样实现

下面以三种不一样的编程语言,经过代码生成验证码。java

2.1 Java语言实现

先看下Java代码是如何生成验证码的。手动建立下面这个类,就能够生成验证码了。代码以下:python

public class GenVerifyCodeUtils {
  private static char mapTable[] = {  '0', '1', '2', '3', '4', '5',  '6', '7', '8', '9', '0', '1',  '2', '3', '4', '5', '6', '7',  '8', '9'};   public static void main(String[] args) {  OutputStream outputStream = new BufferedOutputStream(new ByteArrayOutputStream());  System.out.println(getImageCode(100,80,outputStream ));  }   public static Map<String, Object> getImageCode(int width, int height, OutputStream os) {  Map<String,Object> returnMap = new HashMap<String, Object>();  if (width <= 0) width = 60;  if (height <= 0) height = 20;  BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);  // 获取图形上下文  Graphics g = image.getGraphics();  //生成随机类  Random random = new Random();  // 设定背景色  g.setColor(getRandColor(200, 250));  g.fillRect(0, 0, width, height);  //设定字体  g.setFont(new Font("Times New Roman", Font.PLAIN, 18));  // 随机产生168条干扰线,使图像中的认证码不易被其它程序探测到  g.setColor(getRandColor(160, 200));  for (int i = 0; i < 168; i++) {  int x = random.nextInt(width);  int y = random.nextInt(height);  int xl = random.nextInt(12);  int yl = random.nextInt(12);  g.drawLine(x, y, x + xl, y + yl);  }  //取随机产生的码  String strEnsure = "";  //4表明4位验证码,若是要生成更多位的认证码,则加大数值  for (int i = 0; i < 4; ++i) {  strEnsure += mapTable[(int) (mapTable.length * Math.random())];  // 将认证码显示到图像中  g.setColor(new Color(20 + random.nextInt(110), 20 + random.nextInt(110), 20 + random.nextInt(110)));  // 直接生成  String str = strEnsure.substring(i, i + 1);  // 设置随便码在背景图图片上的位置  g.drawString(str, 13 * i + 20, 25);  }  // 释放图形上下文  g.dispose();  returnMap.put("image",image);  returnMap.put("strEnsure",strEnsure);  return returnMap;  }   static Color getRandColor(int fc, int bc) {  Random random = new Random();  if (fc > 255) fc = 255;  if (bc > 255) bc = 255;  int r = fc + random.nextInt(bc - fc);  int g = fc + random.nextInt(bc - fc);  int b = fc + random.nextInt(bc - fc);  return new Color(r, g, b);  } } 复制代码

2.2 Javascript 实现

这里我也用原生Js写了一个生成验证码的工具,代码以下:web

<form action="#">
 &nbsp;<input type="text" id="input1" onblur="inputBlur()"/>  <input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px;background: #660099"/><br /> </form>  <script language="javascript" type="text/javascript">   var code; //在全局 定义验证码  var code2; //在全局 定义验证码  function createCode() {  code = "";  var checkCode = document.getElementById("checkCode");  function RndNum(n) {  var rnd = "";  for (var i = 0; i < n; i++)  rnd += Math.floor(Math.random() * 10);  return rnd;  }   var num = RndNum(2);  var num2 = RndNum(2);   code = num + "+" + num2 + "=";  code2 = parseInt(num) + parseInt(num2)   if (checkCode) {  checkCode.className = "code";  checkCode.value = code;  }   }  function inputBlur(){  var inputCode = document.getElementById("input1").value;  if (inputCode.length <= 0) {  alert("请输入验证码!");  }  else if (inputCode != code2) {  alert("验证码输入错误!");  createCode();  }  else {  alert("^-^ OK");  }  } </script> <style type="text/css">  .code  {  font-family: Arial;  font-style: italic;  color: Red;  border: 0;  padding: 2px 3px;  letter-spacing: 3px;  font-weight: bolder;  }  .unchanged  {  border: 0;  } </style> 复制代码

效果以下: 编程

2.3 python实现

代码以下:安全

# -*- coding: utf-8 -*
from PIL import Image, ImageDraw, ImageFont, ImageFilter  import random  # 随机字母: def rndChar():  return chr(random.randint(65, 90))  # 随机颜色1: def rndColor():  return (random.randint(64, 255), random.randint(64, 255), random.randint(64, 255))  # 随机颜色2: def rndColor2():  return (random.randint(32, 127), random.randint(32, 127), random.randint(32, 127))  # 240 x 60: width = 60 * 4 height = 60 image = Image.new('RGB', (width, height), (255, 255, 255)) # 建立Font对象: font = ImageFont.truetype('C:\Windows\Fonts\Arial.ttf', 36) # 建立Draw对象: draw = ImageDraw.Draw(image) # 填充每一个像素: for x in range(width):  for y in range(height):  draw.point((x, y), fill=rndColor()) # 输出文字: for t in range(4):  draw.text((60 * t + 10, 10), rndChar(), font=font, fill=rndColor2()) # 模糊: image = image.filter(ImageFilter.BLUR) image.save('code.jpg', 'jpeg') image.show() 复制代码

运行效果以下图: 网络

3、最后

本篇讲了为何会有验证码这个东东,和市面上如今验证码的种类,简单给你们作了一下科普,最后分别以不一样的编程语言,展现了生成验证码的过程。如今网络安全尤其重要,验证码这个功能虽小,可是不可不作!dom

不安分的猿人
孜孜不断的技术分享!
相关文章
相关标签/搜索