在AspNetCore中使用極驗做行為認證

先上效果圖

極驗的流程

極驗官方文檔地址 https://docs.geetest.com/install/deploy/server/csharp

簡單說明一下極驗的驗證流程

引用官方的圖片

• 向服務器發送請求獲取驗證參數
• 客戶端sdk完成驗證
• 由客戶端sdk驗證數據提交服務器二次驗證

在netcore中使用極驗

在我查看官方的sdk過后,發現不是特別好用，根據極驗的流程寫了一套適用於netcore的極驗sdk 開源地址 已經發了nuget包 搜索sharpplug.geetest即可

使用方式很簡單，下面通過一個例子來進行講解

使用命令dotnet new mvc創建一個mvc項目

下一步使用命令dotnet add package sharpplug.geetest安裝nuget包

打開startup文件在ConfigureServices中配置geetest服務
我在極驗申請了一個測試用的id和key 大家可以直接測試使用

public void ConfigureServices(IServiceCollection services)
{
    services.Configure<CookiePolicyOptions>(options =>
    {
        // This lambda determines whether user consent for non-essential cookies is needed for a given request.
        options.CheckConsentNeeded = context => true;
        options.MinimumSameSitePolicy = SameSiteMode.None;
    });

    // GeetestOptions中配置id 與 key
    services.AddGeetest(opt=>{
               opt.Id = "e2697c763685a34be93a7d255ee06b59";
               opt.Key = "7882a2d954106041a731f5e10038982a";
            });

    services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_1);
}

完成獲取驗證參數與二次驗證的類是GeetestManager,它主要有兩個方法

獲取驗證參數方法是Register,它主要有三個參數 userid（用戶標識） clientType(客戶端類型) 與 ipaddress(客戶端ip) 關於參數的細節大家可以去參閱極驗文檔

Task<GeeTestRegisterResult> Register(string userId = null, string clientType = "unknown", string ipAddress = "unknown")

二次驗證方法 Validate 參數為

• offline 是否離線驗證（獲取驗證參數失敗時）
• UserId 用戶標識
• Challenge
• Seccode
• Validate

Task<bool> Validate(GeetestValidateInput input)

下面打開HomeController添加獲取驗證參數方法,記得注入GeetestManager

private readonly GeetestManager _geetestManager;

public HomeController(GeetestManager geetestManager)
{
    _geetestManager = geetestManager;
}

public async Task<GeeTestRegisterResult> GeetestRegister()
{
    return await _geetestManager.Register(clientType: "web", ipAddress: "127.0.0.1");
}

下面在HomeController中加入二次驗證

public async Task<bool> GeetestValidate(GeetestValidateInput input)
{
    return await _geetestManager.Validate(input);
}

服務端部分已經完成,下面打開index.cshtml先引用gt.js

<script type="text/javascript" src="https://static.geetest.com/static/tools/gt.js"></script>

然后添加html元素

<h2>Getest</h2>
<div id="geetestform">
    <input type="hidden" name="geetest_challenge" id="geetest_challenge">
    <input type="hidden" name="geetest_validate" id="geetest_validate">
    <input type="hidden" name="geetest_seccode" id="geetest_seccode">
</div>
<button class="form-control btn-default" id="validate">點我驗證</button>

極驗有一個初始化的過程,先調用獲取驗證參數api進行初始化極驗

$(function() {
    $.ajax({
        url: "/home/GeetestRegister",
        type: "get",
        dataType: "json",
        success: function(data) {
            // 使用offline判斷是否是離線驗證
            offline = !data.success;
            initGeetest({
                // 以下配置參數來自服務端 SDK
                gt: data.gt,
                challenge: data.challenge,
                offline: !data.success,
                new_captcha: true,
                product: "float",
                width: "100%"
            },function(){
                // 初始化元素
                captchaObj.appendTo(document.getElementById('geetestform'));
            })
        }
    });

});

這時運行項目已經可以看到極驗的驗證表單了並且已經可以進行驗證,但是還需要添加點擊按鈕事件進行二次驗證

$("#validate").click(() => {
    var validate = captchaObj.getValidate();
    if (validate === undefined || !validate) {
        alert("請進行驗證");
        return;
    }

    $.ajax({
        url: "/home/GeetestValidate",
        method:"post",
        data: {
            offline: offline,
            challenge: validate.geetest_challenge,
            validate: validate.geetest_validate,
            seccode: validate.geetest_seccode
        },
        success: function(res) {
            if (res) {
                alert("二次校驗狀態成功! 重置驗證狀態");
                captchaObj.reset();
            } else {
                alert("二次校驗狀態返回失敗! 重置驗證狀態");
                captchaObj.reset();
            }
        }
    });
});

這時功能已經全部完成了,大家可以運行項目查看效果了,關於gt.js的更多用法可以參閱極驗的官方文檔