极验验证码示例

官网:https://docs.geetest.com/install/deploy/server/python

 

准备工作:

1、去官网下载相关代码

2、安装geetest模块

 

第一步:将以下代码拷贝到页面的js文件中

注意修改几个地方:

1、第10行,将url改成自己的登陆url。

2、第14-16行,提取自己页面上的数据。

3、第30行,绑定自己的登陆按钮。

4、第34行,在页面中创建一个有这个class的div标签。

 1 <script src="/static/jquery.js"></script>
 2 <script src="/static/bootstrap/js/bootstrap.min.js"></script>
 3 <script src="http://static.geetest.com/static/tools/gt.js"></script>
 4 <script>
 5     var handlerPopup = function (captchaObj) {
 6         // 成功的回调
 7         captchaObj.onSuccess(function () {
 8             var validate = captchaObj.getValidate();
 9             $.ajax({
10                 url: "/login/", // 进行二次验证
11                 type: "post",
12                 dataType: "json",
13                 data: {
14                     username: $('#username').val(),
15                     password: $('#password').val(),
16                     csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val(),
17                     geetest_challenge: validate.geetest_challenge,
18                     geetest_validate: validate.geetest_validate,
19                     geetest_seccode: validate.geetest_seccode
20                 },
21                 success: function (ret) {
22                     if (ret.status) {
23                         location.href = ret.msg;
24                     } else {
25                         $(".login-error").text(ret.msg);
26                     }
27                 }
28             });
29         });
30         $("#login-button").click(function () {
31             captchaObj.show();
32         });
33         // 将验证码加到id为captcha的元素里
34         captchaObj.appendTo("#popup-captcha");
35         // 更多接口参考:http://www.geetest.com/install/sections/idx-client-sdk.html
36     };
37     // 验证开始需要向网站主后台获取id,challenge,success(是否启用failback)
38     $.ajax({
39         url: "/pc-geetest/register?t=" + (new Date()).getTime(), // 加随机数防止缓存
40         type: "get",
41         dataType: "json",
42         success: function (data) {
43             // 使用initGeetest接口
44             // 参数1:配置参数
45             // 参数2:回调,回调的第一个参数验证码对象,之后可以使用它做appendTo之类的事件
46             initGeetest({
47                 gt: data.gt,
48                 challenge: data.challenge,
49                 product: "popup", // 产品形式,包括:float,embed,popup。注意只对PC版验证码有效
50                 offline: !data.success // 表示用户后台检测极验服务器是否宕机,一般不需要关注
51                 // 更多配置参数请参见:http://www.geetest.com/install/sections/idx-client-sdk.html#config
52             }, handlerPopup);
53         }
54     });
55 </scripts>

 

第二步:设置获取验证码的url和视图函数

1、url绑定视图函数

    #获取验证码信息
    path('pc-geetest/register', account.pcgetcaptcha),

2、视图函数

pc_geetest_id = "b46d1900d0a894591916ea94ea91bd2c"
pc_geetest_key = "36fc3fe98530eea08dfc6ce76e3d24c4"

def pcgetcaptcha(request):
    user_id = 'test'
    gt = GeetestLib(pc_geetest_id, pc_geetest_key)
    status = gt.pre_process(user_id)
    request.session[gt.GT_STATUS_SESSION_KEY] = status
    request.session["user_id"] = user_id
    response_str = gt.get_response_str()
    return HttpResponse(response_str)

 

第三步:设置验证码和账号密码校验的函数

def login(request):
    if request.method == "GET":
        return render(request, "login.html")
    # POST请求获取用户名和密码
    username = request.POST.get("username")
    password = request.POST.get("password")

    ret = {"status": False, "msg": None}

    # 验证码相关操作
    gt = GeetestLib(pc_geetest_id, pc_geetest_key)
    challenge = request.POST.get(gt.FN_CHALLENGE, '')
    validate = request.POST.get(gt.FN_VALIDATE, '')
    seccode = request.POST.get(gt.FN_SECCODE, '')
    status = request.session[gt.GT_STATUS_SESSION_KEY]
    user_id = request.session["user_id"]

    if not status:
        # 验证码校验失败
        result = gt.failback_validate(challenge, validate, seccode)
        ret["msg"] = "验证码错误"
    else:
        # 验证码校验成功
        result = gt.success_validate(challenge, validate, seccode, user_id)
        user = auth.authenticate(username=username, password=password)
        if user:
            auth.login(request, user)
            ret["status"] = True
            ret["msg"] = "/index"
        else:
            ret["msg"] = "用户名或密码错误"

    return JsonResponse(ret)

 

posted @ 2019-06-04 17:17  不可思议的猪  阅读(2151)  评论(0编辑  收藏  举报