专栏首页不安分的猿人为什么每次登录系统都有烦人的验证码?

为什么每次登录系统都有烦人的验证码?

一、应用场景

每次登录系统的时候总是要输入烦人的验证码,那么我们今天就思考这个问题,为什么要有验证码这个功能?很多伙伴应该都知道:

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

验证码的种类

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

二、不同实现

下面以三种不同的编程语言,通过代码生成验证码。

2.1 Java语言实现

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

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写了一个生成验证码的工具,代码如下:

<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()

运行效果如下图:

三、最后

本篇讲了为什么会有验证码这个东东,和市面上现在验证码的种类,简单给大家做了一下科普,最后分别以不同的编程语言,展示了生成验证码的过程。现在网络安全尤为重要,验证码这个功能虽小,但是不可不做!

本文分享自微信公众号 - 不安分的猿人(Restless-man),作者:不安分的猿人

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2020-06-08

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 大数据时代-可视化数据分析平台必不可少

    支持多数据源的管理,系统默认自带了MySQL、Oracle、PostgreSQL、SQL Server部分版本数据库的驱动程序,支持自定义扩展数据源。

    不安分的猿人
  • 轻松搭建--融云Android聊天工具

    融云支持客户端的二次开发,Android和ios两个版本,安卓是Java开发的,所以我就尝试构建一把。ios端的项目构建也在尝试中。前两天安卓客户端打包成功,基...

    不安分的猿人
  • 重新学Java系列之Java简介

    Java 是1991年由 Sun Microsystems 的 James Gosling 创建的一种编程语言。Java 的目标是编写一次程序,然后在多个操作系...

    不安分的猿人
  • Spring Security 如何添加登录验证码?松哥手把手教你给微人事添加登录验证码

    登录添加验证码是一个非常常见的需求,网上也有非常成熟的解决方案。在传统的登录流程中加入一个登录验证码也不是难事,但是如何在 Spring Security 中添...

    江南一点雨
  • 网站安全检测之图片验证码

    在对网站安全进行整体的安全检测的时候,用户登陆以及用户留言,评论,设置支付密码,以及一些网站功能方面都会用到图片验证码,针对于验证码我们SINE安全对其进行了详...

    网站安全专家
  • 烦人的验证码有什么用?技术难题全靠它!

    你是不是要经常输入验证码?登录网站时输完密码,要输入一个单词或者几个歪歪扭扭不怎么好辨认的字母,这个场景一定不陌生?有没有思考为什么要输入验证码?验证码有什么作...

    问题先森
  • 验证码安全那些事

    前言 最近在研究验证码安全,本文主要分析四种流行的验证码(图形,短信,语音和滑动)进行分析,写这篇文章的出发点并非是绕过或破解验证码,而是根据自身业务情况来选择...

    FB客服
  • 再见了,打码平台:对抗打码平台的验证码思路

    某日,一朋友深夜微信上问我,如果打码平台盯上了你,你该咋整? 政治正确的回答方式是:加强风控策略,多维度判断使用者意图,减低对验证码的依赖。 显然这不是我或者朋...

    FB客服
  • 写给爬虫工程师的验证码识别教程

    但是对于一个爬虫工程师来说,去学习 机器学习相关知识可能成本太高了.(当然有空的话,还是要好好学的)

    爬虫
  • 登录注册表单渗透

    大家在甲方授权的渗透测试中,经常会遇到各种表单:登录、注册、密码修改、密码找回等表单,本技术稿着重介绍关于各种表单的渗透经验,抛砖引玉,欢迎大家交流互动。

    FB客服

扫码关注云+社区

领取腾讯云代金券