标签:csr challenge label 形式 生成 eth code ffline url
一、自己生成验证码
二、极验科技互动验证码
使用前步骤:下载官网文件——pip install geetest——引入其封装的js模块
代码分为三段:生成验证码——显示验证码——验证验证码、
1 from django.shortcuts import render,HttpResponse 2 from django.http import JsonResponse 3 from django.contrib import auth 4 from geetest import GeetestLib 5 6 # Create your views here. 7 8 #使用极验滑动验证码的登陆 9 def login(request): 10 if request.method == "POST": 11 print("1") 12 #初始化一个返回给ajax的字典 13 ret = {"status":0,"msg":""} 14 #从提交的数据中获取用户名和密码 15 username = request.POST.get("username") 16 password = request.POST.get("password") 17 #获取验证码相关数据 18 gt = GeetestLib(pc_geetest_id, pc_geetest_key) 19 challenge = request.POST.get(gt.FN_CHALLENGE, ‘‘) 20 validate = request.POST.get(gt.FN_VALIDATE, ‘‘) 21 seccode = request.POST.get(gt.FN_SECCODE, ‘‘) 22 status = request.session[gt.GT_STATUS_SESSION_KEY] 23 user_id = request.session["user_id"] 24 25 if status: 26 result = gt.success_validate(challenge, validate, seccode, user_id) 27 else: 28 result = gt.failback_validate(challenge, validate, seccode) 29 30 #如果result有值,则验证成功,利用auth做验证 31 if result: 32 user = auth.authenticate(username=username,password=password) 33 if user: 34 #如果用户名密码正确 35 auth.login(request,user) 36 ret["msg"] = "/index/" 37 else: 38 ret["status"] = 1 39 ret["msg"] = "用户名密码错误" 40 else: 41 #如果验证吗错误 42 ret["status"] = 1 43 ret["msg"] = "验证码错误" 44 return JsonResponse(ret) 45 return render(request,"login.html",locals()) 46 47 48 #请在官网申请ID使用,示例ID不可使用 49 pc_geetest_id = "b46d1900d0a894591916ea94ea91bd2c" 50 pc_geetest_key = "36fc3fe98530eea08dfc6ce76e3d24c4" 51 #获取滑动验证码 52 def get_geetest(request): 53 user_id = ‘test‘ 54 gt = GeetestLib(pc_geetest_id, pc_geetest_key) 55 status = gt.pre_process(user_id) 56 request.session[gt.GT_STATUS_SESSION_KEY] = status 57 request.session["user_id"] = user_id 58 response_str = gt.get_response_str() 59 return HttpResponse(response_str) 60 61 62 def index(request): 63 return render(request,"index.html",locals())
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css"> 7 <link rel="stylesheet" href="/static/css/mystyle.css"> 8 </head> 9 <body> 10 11 <div class="container"> 12 <div class="row"> 13 <form class="form-horizontal col-md-6 col-md-offset-3 login-form"> 14 {% csrf_token %} 15 <div class="form-group"> 16 <label for="username" class="col-sm-2 control-label">用户名</label> 17 <div class="col-sm-10"> 18 <input type="text" class="form-control" id="username" name="username" placeholder="用户名"> 19 </div> 20 </div> 21 <div class="form-group"> 22 <label for="password" class="col-sm-2 control-label">密码</label> 23 <div class="col-sm-10"> 24 <input type="password" class="form-control" id="password" name="password" placeholder="密码"> 25 </div> 26 </div> 27 <div class="form-group"> 28 <div id="popup-captcha"></div> 29 </div> 30 <div class="form-group"> 31 <div class="col-sm-offset-2 col-sm-10"> 32 <button type="button" class="btn btn-default" id="login-button">登录</button> 33 <span class="login-error"></span> 34 </div> 35 </div> 36 </form> 37 </div> 38 </div> 39 40 41 <script src="/static/jquery.js"></script> 42 <script src="/static/bootstrap/js/bootstrap.min.js"></script> 43 <!-- 引入封装了failback的接口--initGeetest --> 44 <script src="http://static.geetest.com/static/tools/gt.js"></script> 45 <script> 46 //发送数据 47 var handlerPopup = function (captchaObj) { 48 // 成功的回调 49 captchaObj.onSuccess(function () { 50 var validate = captchaObj.getValidate(); 51 var username = $("#username").val(); 52 var password = $("#password").val(); 53 $.ajax({ 54 url: "/login/", // 进行二次验证 55 type: "post", 56 dataType: "json", 57 data: { 58 username: username, 59 password: password, 60 csrfmiddlewaretoken: $("[name=‘csrfmiddlewaretoken‘]").val(), 61 geetest_challenge: validate.geetest_challenge, 62 geetest_validate: validate.geetest_validate, 63 geetest_seccode: validate.geetest_seccode 64 }, 65 success: function (data) { 66 if(data.status){ 67 $(".login-error").text(data.msg); 68 }else{ 69 location.href = data.msg; 70 } 71 } 72 }); 73 }); 74 75 //绑定事件显示滑动验证码 76 $("#login-button").click(function () { 77 captchaObj.show(); 78 }); 79 // 将验证码加到id为captcha的元素里 80 captchaObj.appendTo("#popup-captcha"); 81 // 更多接口参考:http://www.geetest.com/install/sections/idx-client-sdk.html 82 }; 83 // 验证开始需要向网站主后台获取id,challenge,success(是否启用failback) 84 $.ajax({ 85 url: "/pc-geetest/register?t=" + (new Date()).getTime(), // 加随机数防止缓存 86 type: "get", 87 dataType: "json", 88 success: function (data) { 89 // 使用initGeetest接口 90 // 参数1:配置参数 91 // 参数2:回调,回调的第一个参数验证码对象,之后可以使用它做appendTo之类的事件 92 initGeetest({ 93 gt: data.gt, 94 challenge: data.challenge, 95 product: "popup", // 产品形式,包括:float,embed,popup。注意只对PC版验证码有效 96 offline: !data.success // 表示用户后台检测极验服务器是否宕机,一般不需要关注 97 // 更多配置参数请参见:http://www.geetest.com/install/sections/idx-client-sdk.html#config 98 }, handlerPopup); 99 } 100 }); 101 102 103 </script> 104 </body> 105 </html>
标签:csr challenge label 形式 生成 eth code ffline url
原文地址:https://www.cnblogs.com/yinwenjie/p/10329660.html