/*十有三博客*/
  • 首页
  • 关于本站
  • 网站地图
  • RSS订阅

ASP.NET 验证码插件 BotDetect CAPTCHA

2017-05-12 十有三 1 浏览:1万+ .NET技术 ASP.NET | 插件工具

以前开发ASP.NET项目的验证码功能,都是自己用GDI+去绘制。现在都是使用质量比较高的插件,除了省时省力,安全性也比自己瞎搞的高,我自己个人项目中比较常用的是BotDetect CAPTCHA这个插件,当然还有其他十分优秀的验证码插件,感兴趣的可以网上找找。

演示项目下载地址(使用VS2017开发):

  • 百度网盘
  • GitHub

BotDetect CAPTCHA依然属于传统字符验证码,这几年很多大型网站都开始用滑动验证码/滑动行为验证码,也有点击行为验证码,还有类似12306那种图形验证码。虽然种类繁多但是还是得根据自己的需求来选择。

在开始使用BotDetect CAPTCHA插件之前,需要知道这个插件有分免费版和付费版(全功能版),一般自用就用免费版的,免费版的一些功能和设置选项比付费版少,而且验证码会带有外链,不过基本上能满足个人项目的需求,更详细的功能对比还是去官网查看比较好。

关于这个插件的使用,官方的文档真的非常详细,建议耐心看完,而且也有详细的案例和演示,包括ASP.NET MVC各个版本和ASP.NET WebForm,另外插件也支持多种语言。这里我根据自己的项目经验,讲下几点需要注意的地方(我自己的项目是用ASP.NET MVC5开发的)。


第一步安装插件,建议使用NuGet,神兵利器不用多说,搜索CAPTCHA或者BotDetect CAPTCHA就可以找到插件安装包。


第二步设置Web.config,插件安装好后项目会自动引用相关的DLL,另外配置文件也会自动添加。这里需要注意下,配置文件里的插件配置可以根据自己的需求进行更改。如果是和我一样用免费版的,建议botDetect节点的配置参考我的:

<botDetect helpLinkEnabled="true" helpLinkMode="text"  soundEnabled="false"/>

helpLinkEnabled="true" helpLinkMode="text",主要是设置插件帮助链接为文本模式,会在验证码图片下方单独放一个链接,不然默认情况下点击验证码会调整到帮助链接(其实就是插件的外链)。除非使用付费版的才可以关闭,否则你设置helpLinkEnabled="false"也没用,只能投机取巧的通过设置来防止习惯性点击验证码图片刷新,导致跳转到其他页面。刷新功能插件是有额外提供一个刷新按钮。soundEnabled="false" 是关闭语音播放功能,因为是自己用所以就关闭了。

验证码图片样式

另外在sessionState的节点中,插件默认设置cookieless="AutoDetect",这里建议取消cookieless设置(不设置等于使用默认的),AutoDetect模式的效果是如果用户浏览器不支持cookie,那么会在URL后面添加一个小尾巴(标识符)。这里可以看下MSDN文档:

关于AutoDetect的MSDN文档截图

我是这样设置的:

<sessionState mode="InProc" timeout="20" sessionIDManagerType="BotDetect.Web.CustomSessionIdManager, BotDetect" />

第三步设置并修改下RouteConfig.cs文件,在路由注册方法的添加如下代码:

routes.IgnoreRoute("{*botdetect}", new { botdetect = @"(.*)BotDetectCaptcha\.ashx" });

主要是忽略掉对BotDetectCaptcha.ashx这个一般处理程序的路由处理,毕竟这个插件就靠这个一般处理程序来操作验证码了,不设置RouteConfig会导致插件无法生效。


第四步修改视图页面,在视图页面中一共需要四步操作:

  1. 需要引入BotDetect.Web.Mvc命名空间;
  2. 引入BotDetect插件样式
  3. 通过插件扩展的Html Helper类生成验证码图片
  4. 添加验证码输入框和验证结果消息

View代码:

@{ 
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@using BotDetect.Web.Mvc;

@section styles{    
    <link href="@BotDetect.Web.CaptchaUrls.Absolute.LayoutStyleSheetUrl" rel="stylesheet" type="text/css" />
}

<div>
    @using (Html.BeginForm("Index", "Home", FormMethod.Post))
    {
        MvcCaptcha exampleCaptcha = new MvcCaptcha("exampleCaptchaId");        
        <div>
            @Html.Captcha(exampleCaptcha)
        </div>
        <div>
            <label>验证码:</label>
            @Html.TextBox("captchaCode")
        </div>      
        <div>
            <input type="submit" value="提交验证码" />
        </div>
        <div>
            <label>错误信息:</label>
            <span style="color:#a94442;font-weight:700;">
                @Html.ValidationMessage("captchaCode")
            </span>
        </div>        
    }
</div>

通过Html.Captcha生成验证码图片需要实例化一个MvcCaptcha类作为对象参数传入。另外要注意下验证码图片的ID和MvcCaptcha类对象的ID,要和后面控制台代码对应!


第五步修改后台控制器代码,这里需要三个步骤:

  1. 引入插件命名空间
  2. 在需要的操作方法(Action)上方添加插件的验证属性CaptchaValidation
  3. 判断验证码是否通过并根据自己情况做下一步操作,返回对应的 ActionResult

关键代码如下:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using BotDetect.Web.Mvc;

namespace BotDetect_CAPTCHA_Demo.Controllers
{
    public class HomeController : Controller
    {        
        public ActionResult Index()
        {
            return View();
        }
        [HttpPost]
        [AllowAnonymous]
        [CaptchaValidation("captchaCode", "exampleCaptchaId", "验证码输入错误!!!")]
        public ActionResult Index(string captchaCode)
        {

            if (ModelState.IsValid)
            {
                //验证码验证成功
                //如果之前验证码输入错误并显示信息,会自动隐藏错误信息
                //注意:验证码只要输入正确,结果会进行缓存
                //之后重复提交验证码会发现就算输入错误也会成功通过,因为已经缓存了通过的结果
            }
            else
            {
                //验证码验证失败
                //视图界面需要调用@Html.ValidationMessage("对应输入框name"),才能显示属性中定义的错误信息
                //或者自己做处理
            }

            return View();
        }
    }
}

关于CaptchaValidationAttribute,主要参数如下:

  1. string inputfield,验证码输入框ID,注意和视图上对应
  2. string captchaId,MvcCaptcha实例化的对象ID,注意和视图上对应
  3. string errorMessage,验证失败的错误信息,在视图界面上要通过@Html.ValidationMessage(string inputfield)才能显示错误信息。

注意事项,在验证码输入正确后会有如下情况:

  1. 如果之前验证码输入错误并显示错误信息,输入正确后会自动隐藏错误信息。
  2. 验证码只要输入正确,验证结果会进行缓存,之后重新提交验证码会发现,就算输入错误也会成功通过,因为已经缓存了正确的记录。

其实这些步骤官方文档说的很详细,只是我自己再用自己的语言总结下。总的来说使用起来不是太困难,比起自己重复造轮子,用这些插件也比较方便。

另外经常上博客园的朋友可以留意下如果有印象,博客园早期的注册页面,验证码也是用BotDetect CAPTCHA这个插件: 

使用插件的网站截图


作者:十有三

出处:https://shiyousan.com/post/636301845793899289

版权声明:本文采用知识共享许可协议:署名-相同方式共享 4.0 国际(CC BY-SA 4.0)。欢迎转载本文,转载请声明出处或保留此段声明。


  • 上一篇: 解决向日葵远程控制软件Shift无法多选文本内容和代码的问题
  • 下一篇: 解决Win10微软拼音输入法与Visual Studio冲突-弹出表情包和无法在文件中查找

相关文章
  • 解决特殊字符引发的错误:应用程序配置文件"App.config/Web.config"无效。分析EntityName时出错
  • JSON劫持漏洞(详细讲解利用JSON从而进行数据劫持的漏洞攻防策略)
  • 从 datetime2 数据类型到 datetime 数据类型的转换产生一个超出范围的值
  • C# String.Substring(Int32, Int32)超出长度是否会出错
  • ASP.NET MVC 如何防御CSRF攻击(跨站请求伪造)
  • 翻译:Changes to the language setting will not take effect until the environment is restarted.

文章分类

.NET技术 123 数据库 24 Web前端 21 网站建设运维 37 操作系统与应用 66 程序猿日常 11 开发工具 12 其他随笔 13

文章标签

ASP.NET ASP.NET MVC C# CSS HTML IIS Javascript Linux MongoDB MySql SQL SQL Server Visual Studio Windows系统 版本控制系统 插件工具 服务器 搞笑娱乐 好文分享 软件应用 生活知识 手机问题 随笔 网络知识 网站设计优化 网站维护 养生保健 异常处理 硬件设备 游戏攻略

热门文章

  • IIS8如何安装和使用URL重写工具-URL Rewrite
  • 林蛋大与楚中天,朱肚皮与朱月坡
  • 解决IE11安装升级失败和在安装前需要更新的问题
  • Windows Server 2012无法安装 .NET3.5-安装角色或功能失败,找不到源文件
  • VS重构重命名的快捷键

推荐文章

  • SQL 获取下一条数据
  • 解决ASP.NET MVC AllowAnonymous属性无效导致无法匿名访问控制器的问题
  • 随笔:阿里绿网方便但是有点小敏感
  • IE11无法运行JS脚本代码
  • ASP.NET 在.aspx页面中使用<script runat="server"></script>标记

友情链接

  • Passingwind的博客
  • 码友网

知识共享许可协议 CC BY-SA 4.0本站作品采用知识共享许可协议:署名-相同方式共享 4.0 国际(CC BY-SA 4.0)。
闽ICP备15003702号
闽公网安备 35020302035102号