一、原理

　　1.在webservice服务端，新建一个Bitmap对象，将验证码字符串、干扰线和干扰点绘制到此Bitmap上——>转换为字节数组——>Base64字符串

　　2.<img src="data:image/jpeg;base64,此处base64字符串"/>

二、生成验证码图片字节数据　　

  public byte[] CreateValidateGraphic(string validateCode)

        {

            var image = new Bitmap((int)Math.Ceiling(validateCode.Length * 12.0), );

            var g = Graphics.FromImage(image);

            try

            {

                //生成随机生成器

                var random = new Random();

                //清空图片背景色

                g.Clear(Color.White);

                //画图片的干扰线

                for (int i = ; i < ; i++)

                {

                    var x1 = random.Next(image.Width);

                    var x2 = random.Next(image.Width);

                    var y1 = random.Next(image.Height);

                    var y2 = random.Next(image.Height);

                    g.DrawLine(new Pen(Color.Silver), x1, y1, x2, y2);

                }

                //Font font = new Font("Arial", 12, (FontStyle.Bold | FontStyle.Italic));

                string[] fontName = { "华文新魏", "宋体", "圆体", "黑体", "隶书" };

                var font = new Font(fontName[new Random().Next(, validateCode.Length)], , (FontStyle.Bold | FontStyle.Italic));

                var brush = new LinearGradientBrush(new Rectangle(, , image.Width, image.Height),

                Color.Blue, Color.DarkRed, 1.2f, true);

                g.DrawString(validateCode, font, brush, , );

                //画图片的前景干扰点

                for (var i = ; i < ; i++)

                {

                    var x = random.Next(image.Width);

                    var y = random.Next(image.Height);

                    image.SetPixel(x, y, Color.FromArgb(random.Next()));

                }

                //画图片的边框线

                g.DrawRectangle(new Pen(Color.Silver), , , image.Width - , image.Height - );

                //保存图片数据

                var stream = new MemoryStream();

                image.Save(stream, ImageFormat.Jpeg);

                //输出图片流

                return stream.ToArray();

            }

            finally

            {

                g.Dispose();

                image.Dispose();

            }

        }

三、字节转base64

Convert.ToBase64String(CreateValidateGraphic("123T"));

四、在html标签<img/>中显示baser64字符串表示的图片

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="VerificationCodePage.aspx.cs" Inherits="VerificationCode.Pages.VerificationCodePage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>

</head>

<body>

    <div>

     <img  id="verification" src="" style="width:200px;height:100px;" />

    </div>

    <script type="text/javascript">

        var CreatVerificationCode = function () {

            var number = Math.floor(Math.random() * 8999) + 1000;

            $.ajax({

                type: "post",

                url: "../WebService/VerificationCodeWebService.asmx/GetValidateCode",

                data: '{ number: ' + number + '}',

                dataType: "json",

                contentType: "application/json;charset=utf8",

                success: function (data) {

                    $("#verification").attr("src", "data:image/jpeg;base64," + data.d);

                },

                error: function (data) {

                    alert(data);

                }

            });

        }

        $("#verification").click(CreatVerificationCode);

        CreatVerificationCode();

    </script>

</body>

</html>

工程VerificationCode验证码.rar下载地址：链接: http://pan.baidu.com/s/1i5lmYGX 密码: unjr

html验证码的更多相关文章

  1. .net点选验证码实现思路分享

    哈哈好久没冒泡了,最进看见点选验证码有点意思,所以想自己写一个. 先上效果图 如果你被这个效果吸引了就请继续看下去. 贴代码前先说点思路: 1.要有一个汉字库,并按字形分类.(我在数据库里是安部首分类 ...

  2. 【探索】无形验证码 —— PoW 算力验证

    先来思考一个问题:如何写一个能消耗对方时间的程序? 消耗时间还不简单,休眠一下就可以了: Sleep(1000) 这确实消耗了时间,但并没有消耗 CPU.如果对方开了变速齿轮,这瞬间就能完成. 不过要 ...

  3. TODO：Laravel增加验证码

    TODO:Laravel增加验证码1. 先聊聊验证码是什么,有什么作用?验证码(CAPTCHA)是"Completely Automated Public Turing test to te ...

  4. PHP-解析验证码类--学习笔记

    1.开始 在 网上看到使用PHP写的ValidateCode生成验证码码类,感觉不错,特拿来分析学习一下. 2.类图 3.验证码类部分代码 3.1  定义变量 //随机因子 private $char ...

  5. 随手记_C#验证码

    前言 最近在网上偶然看见一个验证码,觉得很有意思,于是搜了下,是使用第三方实现的,先看效果: 总体来说效果还是可以的,官方提供的SDK也比较详细,可配置性很高.在这里在简单啰嗦几句使用方式: 使用步骤 ...

  6. WPF做12306验证码点击效果

    一.效果 和12306是一样的,运行一张图上点击多个位置,横线以上和左边框还有有边框位置不允许点击,点击按钮输出坐标集合,也就是12306登陆的时候,需要向后台传递的参数. 二.实现思路 1.获取验证 ...

  7. 零OCR基础6行代码实现C#验证码识别

    这两天因为工作需要,要到某个网站采集信息,一是要模拟登陆,二是要破解验证码,本想用第三方付费打码,但是想想网上免费的代码也挺多的,于是乎准备从网上撸点代码下来,谁知道,撸了好多个都不行,本人以前也没接 ...

  8. ASP.NET中画图形验证码

    context.Response.ContentType = "image/jpeg"; //生成随机的中文验证码 string yzm = "人口手大小多少上中下男女天 ...

  9. asp.net mvc 验证码

    效果图 验证码类 namespace QJW.VerifyCode { //用法: //public FileContentResult CreateValidate() //{ // Validat ...

  10. ecshop验证码

    <?php //仿制ecshop验证码(四位大写字母和数字.背景) //处理码值(四位大写字母和数字组成) //所有的可能的字符集合 $chars = 'ABCDEFGHIJKLMNOPQRST ...

随机推荐

  1. 交叉编译安装ARM平台上的Qt

    一.宿主机环境搭建: 编译需要x11库的支持,在Ubuntu下安装命令: sudo apt-get install libx11-dev libxext-dev libxtst-dev 二.下载源码包 ...

  2. HTML5视频

    <video>标签用于定义视频. 案例1: <!DOCTYPE html><html><head lang="en"> <me ...

  3. oracle 数据库用户登录相关

    oracle 数据库的安装 : 一: 安装的时候可以设定解锁的用户  一般默认是解锁soctt用户和hr用户  : oracle的超级用户是sysdba这个用户在安装的时候也可以设置密码,一 般自己使 ...

  4. Identify Smith Numbers

    Link: https://www.hackerrank.com/challenges/identify-smith-numbers def sum_digits(n): return sum(int ...

  5. Liunx+C编程一站式学习

    Liunx+C编程一站式学习这本书有什么特点?面向什么样的读者?这本书最初是为某培训班的嵌入式系统Linux工程师就业班课程量身定做的教材之一.该课程是为期四个月的全日制职业培训,要求学员毕业时具备非 ...

  6. 使用StreamReader与StreamWriter进行文本文件读写

    namespace filetest { class FileUtil { public static void WriteFile(string file) { using (FileStream ...

  7. JAVA实现实用的ZIP压缩与解压

    http://blog.csdn.net/z69183787/article/details/38555913

  8. hdu 1535 Invitation Cards

    http://acm.hdu.edu.cn/showproblem.php?pid=1535 这道题两遍spfa,第一遍sfpa之后,重新建图,所有的边逆向建边,再一次spfa就可以了. #inclu ...

  9. Inorder Successor in BST 解答

    Question Given a binary search tree and a node in it, find the in-order successor of that node in th ...

  10. [转载]Vertica “ERROR: Too many ROS containers exist”

    最近在用Vertica的时候碰到一个问题,Vertica在运行了一段时间后总是出现类似下面的错误 1: java.sql.SQLException: [Vertica][VJDBC](5065) 2: ...