行為驗證碼的asp.net MVC實現方式 qq521877626

来源:http://www.cnblogs.com/Tom-yi/archive/2017/04/03/6661755.html
-Advertisement-
Play Games

界面http://localhost:你的伺服器/Code/index 實現步驟: 註冊賬號https://www.geetest.com 新增驗證 下載demo (url:http://docs.geetest.com/install/server/csharp/) 找到C#的SDK .dll g ...


界面http://localhost:你的伺服器/Code/index

 

 

 

 

實現步驟:

註冊賬號https://www.geetest.com

 

 

 

 

新增驗證

 

下載demo urlhttp://docs.geetest.com/install/server/csharp/

 

找到C#SDK .dll

 

gt3-dotnet-sdk-master\gt3-dotnet-sdk-master\src\GeetestSDK\GeetestSDK\bin\Debug\GeetestSDK.dll

 

新建mvc項目

 

 

在自己的mvc項目中新建一個文件夾,複製到自己的mvc項目中,添加引用。

 

 

 

 

 

配置公鑰和秘鑰 創建一個類

 

 

類名字都要相同

 

 

對應關係

publicKey  ---ID

privateKey --- KEY

 

創建 controller

 

 

 

 

創建index視圖 (裡面有些代碼是從 demo(gt3-dotnet-sdk-master\gt3-dotnet-sdk-master\demo\index.aspx)copy出來的)

 

 

 

 

 

CODE:

@{

    Layout = null;

}

<!DOCTYPE html>

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>Index</title>

 

    <style>

        body {

            margin: 50px 0;

            text-align: center;

        }

 

        .inp {

            border: 1px solid gray;

            padding: 0 10px;

            width: 200px;

            height: 30px;

            font-size: 18px;

        }

 

        .btn {

            border: 1px solid gray;

            width: 100px;

            height: 30px;

            font-size: 18px;

            cursor: pointer;

        }

 

        #embed-captcha {

            width: 300px;

            margin: 0 auto;

        }

 

        .show {

            display: block;

        }

 

        .hide {

            display: none;

        }

 

        #notice {

            color: red;

        }

 

        #submitBtn {

            margin-top: 30px;

        }

 

        #sb {

            position: absolute;

            color: green;

            top: 670px;

            left: 50%;

            transform: translateX(-50%);

        }

        /* 以下遮罩層為demo.用戶可自行設計實現 */

        #mask {

            display: none;

            position: fixed;

            text-align: center;

            left: 0;

            top: 0;

            width: 100%;

            height: 100%;

            background-color: rgba(0, 0, 0, 0.5);

            overflow: auto;

        }

        /* 可自行設計實現captcha的位置大小 */

        .popup-mobile {

            position: relative;

        }

 

        #popup-captcha-mobile {

            position: fixed;

            display: none;

            left: 50%;

            top: 50%;

            transform: translate(-50%, -50%);

            -webkit-transform: translate(-50%, -50%);

            z-index: 9999;

        }

    </style>

</head>

<body>

    <h1 class="h1">極驗驗證SDKDemo</h1>

   

    <!-- 為使用方便,直接使用jquery.js庫,如您代碼中不需要,可以去掉 -->

    <script src="http://code.jquery.com/jquery-1.12.3.min.js"></script>

    <!-- 引入封裝了failback的介面--initGeetest -->

    <script src="http://static.geetest.com/static/tools/gt.js"></script>

    <!-- 若是https,使用以下介面 -->

    <!-- <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script> -->

    <!-- <script src="https://static.geetest.com/static/tools/gt.js"></script> -->

    <div> 

        <br><br>

        <form  id="form2" action="/Code/submitBtn_ClickMethod"  method="post" style="margin-top:100px;">

            <h2>Demo,使用ajax形式提交二次驗證所需的驗證結果值</h2>

            <br>

            <p>

                <label for="username2">用戶名:</label>

                <input class="inp " id="username2" name="userName" type="text" value="極驗驗證">

            </p>

            <br>

            <p>

                <label for="password2">密  碼:</label>

                <input class="inp" name="password" id="password2" type="password" value="123456">

            </p>

 

            <div id="embed-captcha"></div>

            <p id="wait" class="show">正在載入驗證碼......</p>

            <p id="notice" class="hide">請先拖動驗證碼到相應位置</p>

 

            <div class="row">

                <input type="button" class="btn btn-primary" id="submitBtn" onclick="submitBtn_Click()" value="登 錄" />

            </div>

        </form>

    </div>

    <script>

    var handlerEmbed = function (captchaObj) {

        $("#embed-submit").click(function (e) {

            var validate = captchaObj.getValidate();

            if (!validate) {

                $("#notice")[0].className = "show";

                setTimeout(function () {

                    $("#notice")[0].className = "hide";

                }, 2000);

                e.preventDefault();

            }

        });

        // 將驗證碼加到id為captcha的元素里,同時會有三個input的值:geetest_challenge, geetest_validate, geetest_seccode

        captchaObj.appendTo("#embed-captcha");

        captchaObj.onReady(function () {

            $("#wait")[0].className = "hide";

        });

        // 更多介面參考:http://www.geetest.com/install/sections/idx-client-sdk.html

        };

        /*點擊登錄時ajax請求控制器,把相關數據發送到伺服器*/

        var submitBtn_Click = function () {

            $.ajax({

                // 獲取id,challenge,success(是否啟用failback)

                // url: "/getcaptcha.aspx?t=" + (new Date()).getTime(), // 加隨機數防止緩存

                url: "/Code/submitBtn_ClickMethod",

                type: "post",

                data: $("#form2").serialize(),

                dataType: "json",

                success: function (data) { alert(data);},

                error: function (data) {

                    alert(data);

                }

            });

        };

       

    $.ajax({

        // 獲取id,challenge,success(是否啟用failback)

       // url: "/getcaptcha.aspx?t=" + (new Date()).getTime(), // 加隨機數防止緩存

        url:"/Code/GetCaptcha",

        type: "post",

        dataType: "json",

        success: function (data) {

            // 使用initGeetest介面

            // 參數1:配置參數

            // 參數2:回調,回調的第一個參數驗證碼對象,之後可以使用它做appendTo之類的事件

            data = eval('(' + data + ')');

            initGeetest({

                gt: data.gt,

                challenge: data.challenge,

                product: "embed", // 產品形式,包括:float,embed,popup。註意只對PC版驗證碼有效

                offline: !data.success, // 表示用戶後臺檢測極驗伺服器是否宕機,一般不需要關註

                new_captcha: data.new_captcha

                // 更多配置參數請參見:http://www.geetest.com/install/sections/idx-client-sdk.html#config

            }, handlerEmbed);

        }

    });

    </script>

</body>

</html>

 

controller裡面action方法(gt3-dotnet-sdk-master\gt3-dotnet-sdk-master\demo裡面尋找的 進行修改)

  public class CodeController : Controller

    {

        // GET: Code

        public ActionResult Index()

        {

            return View();

        }

        /// <summary>

        /// 獲取到驗證碼,把驗證碼存到Session中

        /// </summary>

        /// <returns></returns>

        public ActionResult GetCaptcha()

        {

            GeetestLib geetest = new GeetestLib(GeetestConfig.publicKey, GeetestConfig.privateKey);

            String userID = "haiyiTest";//CommonHelper.CalcMD5("haiyiTest")

            Byte gtServerStatus = geetest.preProcess(userID, "web", "127.0.0.1");

            Session[GeetestLib.gtServerStatusSessionKey] = gtServerStatus;

            Session["userID"] = userID;

            string captChaString = geetest.getResponseStr();

             return Json((object)captChaString);

        }

 

 

        public ActionResult submitBtn_ClickMethod(string userName,string password,string geetest_challenge,string geetest_validate,string geetest_seccode)

        {

            GeetestLib geetest = new GeetestLib(GeetestConfig.publicKey, GeetestConfig.privateKey);

            Byte gt_server_status_code = (Byte)Session[GeetestLib.gtServerStatusSessionKey];

            String userID = (String)Session["userID"];

            int result = 0;

            //String challenge = Request.Form.Get(GeetestLib.fnGeetestChallenge);

            //String validate = Request.Form.Get(GeetestLib.fnGeetestValidate);

            //String seccode = Request.Form.Get(GeetestLib.fnGeetestSeccode);

 

            String challenge = geetest_challenge;

            String validate = geetest_validate;

            String seccode = geetest_seccode;

 

 

            if (gt_server_status_code == 1)

            {

                result =

                    geetest.enhencedValidateRequest(challenge, validate, seccode, userID);

            }

            else {

                result =

                    geetest.failbackValidateRequest(challenge, validate, seccode);

            }

            if (result == 1) {

                // return Content("<div id='sb'><h1>success<h1></div>");

                //Response.Write("<div id='sb'>success</div>");

                return Json("登錄成功");

            }

            else {

                // return Content(" ");

                //Response.Write(" ");

                return Json("登錄失敗");

            }

        }

    }

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 開發工具:VS2010,MVC4.0,SQLSERVER2008 伺服器:Windows server 2012,IIS8,SQLSERVER2012 一、發佈後,每個頁面第一次打開都很卡,50秒或更長,第二次打開就很快了 估計原因:編譯速度慢,但在有VS環境的機器上發佈沒有這麼卡 解決辦法: 使用... ...
  • ElasticSearch NEST Client 操作Index var indexName="twitter"; var deleteIndexResponse = client.DeleteIndex(indexName); var createIndexResponse = client.C ...
  • 值類型:int double char bool decimal struct enum 值存儲在記憶體的棧上 引用類型: string 數組 自定義類 介面 委托 值存儲在堆中 值傳遞:把值類型作為參數傳遞,傳遞的是值本身 註:ref可以把值傳遞改變為引用傳遞 引用傳遞:把引用類型的值作為參數傳遞, ...
  • 設計模式(Design pattern):指的是一種大多數人反覆使用的代碼設計經驗。 作用:代碼復用、易讀性、保證代碼可靠性。 一、簡單工廠模式 用法:創建一個工廠類(命名習慣以Factiory結尾),一個靜態的帶參數(根據不同的參數返回不同的子類對象)的父類類型的方法。 public class ...
  • 記錄點點滴滴知識,為了更好的服務後來者! 一、為什麼使用AutoFac? 之前介紹了Unity和Ninject兩個IOC容器,但是發現園子里用AutoFac的貌似更為普遍,於是捯飭了兩天,發現這個東東確實是個高大上的IOC容器~ Autofac是.NET領域最為流行的IOC框架之一,傳說是速度最快的 ...
  • 1.看到標題首先要想到三層架構是什麼? 三層架構其實為: ①表示層:負責接收用戶的輸入,將輸出呈現給用戶, 以及訪問安全性驗證,並對輸入的數據的正確性、 有效性及呈現樣式負責,但對輸出的數據的正確性 不負責。 ②業務邏輯性:負責系統領域業務的處理,負責邏輯性數據的生產、 處理及轉換。對所輸入的邏輯性 ...
  • (一)概述 數組的大小是固定的。如果元素個數是動態的,就應使用集合類。 List<T>是與數組相當的集合類。還有其它類型的集合:隊列、棧、鏈表、字典和集。 (二)列表 1、創建列表 調用預設的構造函數,就可以創建列表對象。在泛型類List<T>中,必須為聲明為列表的值指定類型。使用預設構造函數創建一 ...
  • 概念引入 ●什麼是介面? 介面是包含一組虛方法的抽象類型,其中每一種方法都有其名稱、參數和返回值。介面方法不能包含任何實現,CLR允許介面可以包含事件、屬性、索引 器、靜態方法、靜態欄位、靜態構造函數以及常數。但是註意:C#中不能包含任何靜態成員。一個類可以實現多個介面,當一個類繼承某個介面時,它不 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...