极验验证使用-滑动&选字验证码

时间 2019-12-09

标签验证使用滑动选字验证码繁體版

原文原文链接

准备

SDK下载

首先在极验官网下载好SDK，附上官网连接，点此可直接下载python版zip包。html

模块安装

使用该SDK时发现它依赖两个模块，分别是geetest和requests。python

pip install geetest
pip install requests

使用

我这里是在Django环境下测试。jquery

登陆页

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>登录</title>
 6     <!-- 为使用方便，直接使用jquery.js库，如您代码中不须要，能够去掉 -->
 7     <script src="http://code.jquery.com/jquery-1.12.3.min.js"></script>
 8     <!-- 引入封装了failback的接口--initGeetest -->
 9     <script src="http://static.geetest.com/static/tools/gt.js"></script>
10 </head>
11 <body>
12 
13 <div class="popup">
14     <br>
15     <p>
16         <labe>用户名：</labe>
17         <input id="username1" class="inp" type="text" value="admin">
18     </p>
19     <br>
20     <p>
21         <label>密&nbsp;&nbsp;&nbsp;&nbsp;码：</label>
22         <input id="password1" class="inp" type="password" value="123">
23     </p>
24 
25     <br>
26     <input class="btn" id="popup-submit" type="submit" value="提交">
27 
28     <div id="popup-captcha"></div>
29 </div>
30 
31 <script>
32     var handlerPopup = function (captchaObj) {
33         // 成功的回调
34         captchaObj.onSuccess(function () {
35             var validate = captchaObj.getValidate();
36             $.ajax({
37                 url: "/login/", // 进行二次验证
38                 type: "post",
39                 dataType: "json",
40                 data: {
41                     username: $('#username1').val(),
42                     password: $('#password1').val(),
43                     geetest_challenge: validate.geetest_challenge,
44                     geetest_validate: validate.geetest_validate,
45                     geetest_seccode: validate.geetest_seccode
46                 },
47                 success: function (data) {
48                     alert(data.msg)
49                 }
50             });
51         });
52         $("#popup-submit").click(function () {
53             captchaObj.show();
54         });
55         // 将验证码加到id为captcha的元素里
56         captchaObj.appendTo("#popup-captcha");
57         // 更多接口参考：http://www.geetest.com/install/sections/idx-client-sdk.html
58     };
59     // 验证开始须要向网站主后台获取id，challenge，success（是否启用failback）
60     $.ajax({
61         url: "/getcaptcha?t=" + (new Date()).getTime(), // 加随机数防止缓存
62         type: "get",
63         dataType: "json",
64         success: function (data) {
65             // 使用initGeetest接口
66             // 参数1：配置参数
67             // 参数2：回调，回调的第一个参数验证码对象，以后能够使用它作appendTo之类的事件
68             initGeetest({
69                 gt: data.gt,
70                 challenge: data.challenge,
71                 product: "popup", // 产品形式，包括：float，embed，popup。注意只对PC版验证码有效
72                 offline: !data.success // 表示用户后台检测极验服务器是否宕机，通常不须要关注
73                 // 更多配置参数请参见：http://www.geetest.com/install/sections/idx-client-sdk.html#config
74             }, handlerPopup);
75         }
76     });
77 </script>
78 </body>
79 </html>

/templates/login.html

注意：须要引入如下js：git

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

相应接口

 1 from django.shortcuts import render, HttpResponse
 2 from django.http import JsonResponse
 3 from geetest import GeetestLib
 4 
 5 pc_geetest_id = "b46d1900d0a894591916ea94ea91bd2c"
 6 pc_geetest_key = "36fc3fe98530eea08dfc6ce76e3d24c4"
 7 
 8 
 9 def getcaptcha(request):
10     user_id = 'test'
11     gt = GeetestLib(pc_geetest_id, pc_geetest_key)
12     status = gt.pre_process(user_id)
13     request.session[gt.GT_STATUS_SESSION_KEY] = status
14     request.session["user_id"] = user_id
15     response_str = gt.get_response_str()
16     return HttpResponse(response_str)
17 
18 
19 # Create your views here.
20 def login(request):
21     if request.method == "POST":
22         gt = GeetestLib(pc_geetest_id, pc_geetest_key)
23         challenge = request.POST.get(gt.FN_CHALLENGE, '')
24         validate = request.POST.get(gt.FN_VALIDATE, '')
25         seccode = request.POST.get(gt.FN_SECCODE, '')
26         status = request.session[gt.GT_STATUS_SESSION_KEY]
27         user_id = request.session["user_id"]
28         if status:
29             result = gt.success_validate(challenge, validate, seccode, user_id)
30         else:
31             result = gt.failback_validate(challenge, validate, seccode)
32 
33         username = request.POST.get('username')
34         password = request.POST.get('password')
35         if result:
36             # 验证成功
37             if username == 'admin' and password == '123':
38                 result = {'status': 0, 'msg': "登陆成功"}
39             else:
40                 result = {'status': 1, 'msg': "用户名或密码错误"}
41         else:
42             result = {'status': 2, 'msg': "验证失败"}
43         return JsonResponse(result)
44     return render(request, 'login.html')
45 
46 views.py

views.py

运行

配置好路由，运行。访问localhost:8000/login/，点击提交。效果以下图：github

选字验证码

在我测试C#版Demo的时候发现它的验证码是选字验证码，最后发现只要把C#版Demo中的id和key替换上述views.py中的五、6行的id和key，页面就是选字验证码。id和key以下：ajax

pc_geetest_id = "48a6ebac4ebc6642d68c217fca33eb4d"
pc_geetest_key = "4f1c085290bec5afdc54df73535fc361"

以下图：django

完整示例下载

点此下载完整示例json