前言

C# 是一个古代的、通用的、面向对象的编程语言,它是由微软(Microsoft)开发的,由 Ecma 和 ISO 核准认可的。突发奇想,入手开发一个C#滑动拼图验证码,上面是我开发过程的记录。

筹备工作

本文应用IIS搭建环境,同时确保我的项目运行失常。

目录构造

外围代码

  • noramal.html
<!doctype html><html><head><meta charset="utf-8"><title>凯格行为验证码 - Net C# demo</title><link rel="stylesheet" href="./style/demo.css" /><!--将以下域名替换成你的“应用服务器域名”将以下 appid 替换成你的 AppID服务器域名和appid在你的利用治理中获取示例:<script src="captcha.js?appid=xxx"></script>--><script src="captcha.js?appid=appId"></script><script>kg.captcha({    // 绑定显示区域    bind: "#captchaBox",    // 验证胜利事务处理    success: function (e) {        console.log(e);        // 将验证胜利后的 token 通过暗藏域传递到后端        kg.$("#kgCaptchaToken").value = e["token"];    },    // 验证失败事务处理    failure: function (e) {        console.log(e);    },    // 点击刷新按钮时触发    refresh: function (e) {        console.log(e);    }});// 查看表单提交function check() {    if (kg.$("#kgCaptchaToken").value == "") {        alert("请实现图形验证后提交")        return false;    } else {        return true;    }}</script></head><body>    <form action="demo.aspx?cty=1" method="post" id="form" onsubmit="return check();">        <!-- 将验证胜利后的 token 通过暗藏域传递到后端 -->        <input type="hidden" name="kgCaptchaToken" id="kgCaptchaToken" value="" />        <div class="inputForm">            <input type="text" name="username" placeholder=" 例:填写登录帐号" />            <br/>            <input type="password" name="password" placeholder=" 例:填写登录明码" />        </div>        <!-- 绑定显示区域 -->        <div id="captchaBox"></div>        <input type="submit" value="提  交" class="btn" />    </form></body></html>
  • demo.aspx.cs
using System;using KgCaptchaSDK;public partial class _Default : System.Web.UI.Page{    protected void Page_Load(object sender, EventArgs e) {        // 后端解决        string html, appId, appSecret, Token;        if (Request.Form.ToString().Length > 0){  // 有数据处理            string cty = Request.QueryString["cty"];            // 设置 AppId 及 AppSecret,在利用治理中获取            if (cty == "1"){                appId = "appId";                appSecret = "appSecret";            }            // 填写你的 AppId 和 AppSecret,在利用治理中获取            var request = new kgCaptcha(appId, appSecret);            // 前端验证胜利后颁发的 token,有效期为两分钟            request.token = Request.Form["kgCaptchaToken"];            // 填写应用服务域名,在利用治理中获取            request.appCdn = "appCdn";            // 当安全策略中的防控等级为3时必须填写,个别状况下能够疏忽            // 能够填写用户输出的登录帐号(如:$_POST["username"]),可拦挡同一帐号屡次尝试等行为            request.userId = "kgCaptchaDemo";            // 申请超时工夫,秒            request.connectTimeout = 5;            // 发送验证申请            var requestResult = request.sendRequest();            if (requestResult.code == 0) {                // 验签胜利逻辑解决 ***                // 这里做验证通过后的数据处理                // 如登录/注册场景,这里通常查询数据库、校验明码、进行登录或注册等动作解决                // 如短信场景,这里能够开始向用户发送短信等动作解决                // ...                html = "<script>alert('验证通过');history.back();</script>";            } else {                // 验签失败逻辑解决                html = "<script>alert(\"" + requestResult.msg + " - " + requestResult.code + "\");history.back();</script>";            }            // 输入后果            Response.Write(html);        } else {            Response.Redirect("index.html");        }    }}

成果展现

最初

SDK开源地址:https://github.com/KgCaptcha,顺便做了一个演示:https://www.kgcaptcha.com/demo/