关于滑动验证码

标签: C# 滑动验证码
4人阅读 评论(0) 收藏 举报
分类:

滑动验证码,利用图片的X,Y坐标来实现类似于腾讯的滑动验证。

首先前台调用后台接口,获取Y坐标,及裁剪的小图,混淆拼接的图片。X坐标保存到数据库。

 /// <summary>
        /// 返回验证码json
        /// </summary>
        public string GetVerificationCode()
        {
            Random rd = new Random();
            _PositionX = rd.Next(_MinRangeX, _MaxRangeX);//设置X坐标
            _PositionY = rd.Next(_MinRangeY, _MaxRangeY);//设置Y坐标
            string Id = SetSql.Add(_PositionX.ToString());//X坐标插入数据库(Y坐标给前台)
            int[] a = { 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19 };
            int[] array = a.OrderBy(x => Guid.NewGuid()).ToArray();
            Bitmap bmp = new Bitmap(path + (new Random()).Next(0, _ImgNum - 1) + ".jpg");
            string ls_small = "data:image/jpg;base64," + ImgToBase64String(cutImage(bmp, _shearSize, _shearSize, _PositionX, _PositionY));
            Bitmap lb_normal = GetNewBitMap(bmp, _shearSize, _shearSize, _PositionX, _PositionY);
            string ls_confusion = "data:image/jpg;base64," + ImgToBase64String(ConfusionImage(array, lb_normal));
            JObject jObject = new JObject();
            jObject["errcode"] = 0;
            jObject["y"] = _PositionY;//Y坐标
            jObject["array"] = string.Join(",", array);//
            jObject["imgx"] = _ImgWidth;//图片宽
            jObject["imgy"] = _ImgHeight;//图片高
            jObject["small"] = ls_small;//裁剪的小图
            jObject["normal"] = ls_confusion;//裁剪小图后的原图
            jObject["Id"] = Id;
            /* errcode: 状态值 成功为0
             * y:裁剪图片y轴位置
             * small:小图字符串
             * normal:剪切小图后的原图并按无序数组重新排列后的图
             * array:无序数组
             * imgx:原图宽
             * imgy:原图高
             */
            return jObject.ToString();
        }
   /// <summary>
        /// 获取裁剪的小图
        /// </summary>
        /// <param name="sFromBmp">原图</param>
        /// <param name="cutWidth">剪切宽度</param>
        /// <param name="cutHeight">剪切高度</param>
        /// <param name="x">X轴剪切位置</param>
        /// <param name="y">Y轴剪切位置</param>
        private Bitmap cutImage(Bitmap sFromBmp, int cutWidth, int cutHeight, int x, int y)
        {
            //载入底图   
            Image fromImage = sFromBmp;

            //先初始化一个位图对象,来存储截取后的图像
            Bitmap bmpDest = new Bitmap(cutWidth, cutHeight, System.Drawing.Imaging.PixelFormat.Format32bppRgb);

            //这个矩形定义了,你将要在被截取的图像上要截取的图像区域的左顶点位置和截取的大小
            Rectangle rectSource = new Rectangle(x, y, cutWidth, cutHeight);

            //这个矩形定义了,你将要把 截取的图像区域 绘制到初始化的位图的位置和大小
            //我的定义,说明,我将把截取的区域,从位图左顶点开始绘制,绘制截取的区域原来大小
            Rectangle rectDest = new Rectangle(0, 0, cutWidth, cutHeight);

            //第一个参数就是加载你要截取的图像对象,第二个和第三个参数及如上所说定义截取和绘制图像过程中的相关属性,第四个属性定义了属性值所使用的度量单位
            Graphics g = Graphics.FromImage(bmpDest);
            g.DrawImage(fromImage, rectDest, rectSource, GraphicsUnit.Pixel);
            g.Dispose();
            return bmpDest;
        }
  /// <summary>
        /// 获取裁剪小图后的原图
        /// </summary>
        /// <param name="sFromBmp">原图</param>
        /// <param name="cutWidth">剪切宽度</param>
        /// <param name="cutHeight">剪切高度</param>
        /// <param name="spaceX">X轴剪切位置</param>
        /// <param name="spaceY">Y轴剪切位置</param>
        public Bitmap GetNewBitMap(Bitmap sFromBmp, int cutWidth, int cutHeight, int spaceX, int spaceY)
        {
            // 加载原图片 
            Bitmap oldBmp = sFromBmp;
            // 绑定画板 
            Graphics grap = Graphics.FromImage(oldBmp);
            // 加载水印图片 
            Bitmap bt = new Bitmap(cutWidth, cutHeight);
            Graphics g1 = Graphics.FromImage(bt);  //创建b1的Graphics
            g1.FillRectangle(Brushes.Black, new Rectangle(0, 0, cutWidth, cutHeight));   //把b1涂成红色
            bt = PTransparentAdjust(bt, 120);
            // 添加水印 
            grap.DrawImage(bt, spaceX, spaceY, cutWidth, cutHeight);
            grap.Dispose();
            g1.Dispose();
            return oldBmp;
        }

 /// <summary>
        /// 获取混淆拼接的图片
        /// </summary>
        /// <param name="a">无序数组</param>
        /// <param name="bmp">剪切小图后的原图</param>
        public Bitmap ConfusionImage(int[] a, Bitmap cutbmp)
        {
            Bitmap[] bmp = new Bitmap[20];
            for (int i = 0; i < 20; i++)
            {
                int x, y;
                x = a[i] > 9 ? (a[i] - 10) * _CutX : a[i] * _CutX;
                y = a[i] > 9 ? _CutY : 0;
                bmp[i] = cutImage(cutbmp, _CutX, _CutY, x, y);
            }
            Bitmap Img = new Bitmap(_ImgWidth, _ImgHeight);      //创建一张空白图片
            Graphics g = Graphics.FromImage(Img);   //从空白图片创建一个Graphics
            for (int i = 0; i < 20; i++)
            {
                //把图片指定坐标位置并画到空白图片上面
                g.DrawImage(bmp[i], new Point(i > 9 ? (i - 10) * _CutX : i * _CutX, i > 9 ? _CutY : 0));
            }
            g.Dispose();
            return Img;
        }

然后前台返回X坐标,滑动过程特性,来判断是否成功。

   /// <summary>
        /// 校验前端是否通过验证
        /// </summary>
        public void CheckCode(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            string ls_point = context.Request["point"];//完成时x轴对于左上角位置位置
            string datelist = context.Request["datelist"];//滑动过程特征
            string timespan = context.Request["timespan"];//耗时
            string Id = context.Request["Id"];//ID编号,验证X坐标

            string[] result = SetSql.Seach(Id).Split(',');//获取X坐标和错误次数
            string code = result[0];
            string code_errornum = result[1];
            string token = result[2];

            if (code == null)
            { WriteError(context, "发生错误"); return; }
            if (string.IsNullOrEmpty(ls_point))
            { WriteError(context, "未获取到坐标值"); return; }
            int li_old_point = 0, li_now_point = 0;
            try { li_old_point = int.Parse(code); }
            catch { WriteError(context, "发生错误-1"); return; }
            try { li_now_point = int.Parse(ls_point); }
            catch { WriteError(context, "获取到的坐标值不正确"); return; }
            //错误
            if (Math.Abs(li_old_point - li_now_point) > _deviationPx)
            {
                int li_count = 0;
                try
                {
                    li_count = int.Parse(code_errornum);
                }
                catch { li_count = 0; }
                SetSql.AddErrorCount(Id);//增加错误次数
                if (li_count > _MaxErrorNum)
                {
                    //超过最大错误次数后不再校验
                    SetSql.Delete(Id,"false");
                    //HttpContext.Current.Session["code"] = null;
                    Write(context, "{\"state\":-1,\"msg\":" + li_count + "}"); return;
                }
                //返回错误次数
                Write(context, "{\"state\":-1,\"msg\":" + li_count + "}"); return;
            }
            if (SlideFeature(datelist))
            {
                //机器人??
            }
            //校验成功 返回正确坐标
            //HttpContext.Current.Session["isCheck"] = "OK";
            //HttpContext.Current.Session["code_errornum"] = null;
            //HttpContext.Current.Session["code"] = null;
            SetSql.Delete(Id,"true");
            Write(context, "{\"state\":0,\"info\":\"正确\",\"data\":" + li_old_point + ",\"token\":\""+token+"\"}");
        }
源码地址:https://download.csdn.net/download/qq_35513598/10344634

本项目基于GitHub源码修改

源地址:https://github.com/eatage/VerificationCode

查看评论

验证码之算术验证码

-
  • 1970年01月01日 08:00

【Android】仿斗鱼滑动验证码

概述 本篇滑动验证码的代码其实上周四就写好了,结果周末赶上找房子,搬家,累掉了半条命,赶紧写篇博客恢复恢复元气。 另外上次简书莫名其妙封我号,也不给我一个说法,当天又解封了。这个事我也挺不爽的,吐...
  • a214024475
  • a214024475
  • 2016-11-24 14:36:10
  • 619

京东滑动验证码

  • 2018年02月17日 23:59
  • 77KB
  • 下载

滑动验证码的实现

http://www.geetest.com/
  • u011500781
  • u011500781
  • 2016-07-29 16:58:49
  • 2090

图片滑动验证码

1 体验滑动效果 http://www.geetest.com/exp_popup 2 原理:http://www.ifanr.com/603368 3 举例:http://www.thinkph...
  • wabiaozia
  • wabiaozia
  • 2017-03-03 15:05:02
  • 3760

滑动验证码

  • 2015年11月20日 10:58
  • 363KB
  • 下载

python+selenium滑动式验证码解决办法

from selenium.webdriver import ActionChainsaction = ActionChains(driver)source=driver.find_element_b...
  • zha6476003
  • zha6476003
  • 2018-01-08 14:21:50
  • 717

滑动图片验证码demo

  • 2015年08月07日 14:33
  • 531KB
  • 下载

Android 滑动验证码

自定义图片滑动验证控件 传送门
  • q957789074
  • q957789074
  • 2016-12-08 17:43:00
  • 1149

PC手机端和嵌入式滑动拼图验证码三种效果

演示效果参考:http://www.erdangjiade.com/js/1141.html 首先要确认前端使用页面,比如登陆页面  src="http://code.jquery.c...
  • u013032788
  • u013032788
  • 2017-02-15 14:41:02
  • 1206
    个人资料
    持之以恒
    等级:
    访问量: 1431
    积分: 92
    排名: 142万+
    文章分类
    文章存档