拖动图形验证码(极验验证)

1.地址

http://www.geetest.com/ 申请账号

2.样式

3. 前端

<div id="captcha"><div id="loading-tip">加载中，请稍后...</div></div>

4.js 引用<script src="../../js/gt.js"> </script>

生成验证信息

 //极验// 渲染 验证条var handler = function (captchaObj) {captcha = captchaObj;// DOM 准备好后，隐藏 #loading-tip 元素// 仅作示例用，用您适合的方式隐藏即可captchaObj.onReady(function () {document.getElementById('loading-tip').style.display = 'none';// $("#register").attr("disabled",true); ischeck=false;});// 出错啦，可以提醒用户稍后进行重试captchaObj.onError(function () {layer.msg('页面出错，请刷新页面。。。', {icon: 5});});// 验证码成功以后会执行的方法，但不代表验证成功captchaObj.onSuccess(function () {result = captchaObj.getValidate();// $("#register").attr("disabled",false);ischeck=true;// api2 查询验证是否成功/*$.ajax({url: _API+"rbac/api_verif2", //  二次验证的接口地址type: "post",data: {geetest_challenge: result.geetest_challenge,geetest_validate: result.geetest_validate,geetest_seccode: result.geetest_seccode,// 其他服务端需要的数据，比如登录时的用户名和密码},dataType: "json",success: function (data) {console.log(data)if( data.type == 'ok' ){$("#sendSet").attr("disabled",false);}else{layer.msg('验证失败', {icon: 5});captchaObj.reset(); // 调用该接口进行重置}}})*/});// 将验证码加到id为captcha的元素里// 渲染验证条captchaObj.appendTo("#captcha");};// api1 获取流水标识并设置状态码$.ajax({url: _SERVER + "rbac/api_verif1", //  验证码的第一次验证 接口type: "post",dataType: "json",success: function (data) {//请检测data的数据结构， 保证data.gt, data.challenge, data.success有值initGeetest({gt: data.gt,challenge: data.challenge,product: "float", // 产品形式offline: !data.success}, handler); // 参数配置完以后执行上面的handler方法 渲染验证条}});

注册时验证

$.ajax({type: "POST",url: _SERVER + "user/register",data: {"user_string": mobile,"password": passwords,"extension_code": invite_code,"re_password": confirm_password,"type": "mobile","code": code_phone,"card": ids,"pay_password": pay_pwd,"username": username,"area_code":area_code,geetest_challenge: result.geetest_challenge,geetest_validate: result.geetest_validate,geetest_seccode: result.geetest_seccode},dataType: "json",success: function (data) {layer_close()if (data.type == "ok") {layer_msg(data.message);setTimeout(function () {window.location.href = "login.html"}, 1000);} else {layer_msg(data.message)return false;}}});

5.php

接口

Route::any('api/rbac/api_verif1', 'Api\RbacController@apiVerif1');//获取流水标识

<?phpnamespace App\Http\Controllers\Api;use Illuminate\Http\Request;use App\GeetestLib;class RbacController extends Controller
{//// 验证码的第一次验证public function apiVerif1(Request $request){// 极验类的库，传入CAPTCHA_ID 和 PRIVATE_KEY// 在极验后台有，写到配置文件中去$GtSdk = new GeetestLib(config('geetest.id'), config('geetest.key'));$data = array("user_id" => uniqid(), # 网站用户id"client_type" => "h5", #web:电脑上的浏览器；h5:手机上的浏览器，包括移动应用内完全内置的web_view；native：通过原生SDK植入APP应用的方式"ip_address" => $request->getClientIp(), # 请在此处传输用户请求验证时所携带的IP);$status = $GtSdk->pre_process($data, 1); // 获取服务器的状态session(['gtserver' => $status]);// 状态存入session中session(['user_id' => $data['user_id']]);// 用户id存入session中echo $GtSdk->get_response_str(); // 传到前台 供initGeetest使用 data.gt, data.challenge, data.success}// 验证码的第二次验证public function apiVerif2(Request $request){$info = $request->all();// 判断服务器是否正常$gtserver = session()->pull('gtserver');// 用户的id  一个随机数$user_id  = session()->pull('user_id');$GtSdk = new GeetestLib(config('geetest.id'), config('geetest.key'));$data = array("user_id" => $user_id, # 网站用户id"client_type" => "h5", #web:电脑上的浏览器；h5:手机上的浏览器，包括移动应用内完全内置的web_view；native：通过原生SDK植入APP应用的方式"ip_address" => $request->getClientIp(), # 请在此处传输用户请求验证时所携带的IP);if ( $gtserver == 1) {   // 服务器正常$result = $GtSdk->success_validate($info['geetest_challenge'], $info['geetest_validate'], $info['geetest_seccode'], $data);if ($result) {return $this->success('验证成功'); // echo '{"status":"success"}';}return $this->error('验证失败');} else {  // 服务器宕机,走failback模式if ($GtSdk->fail_validate($info['geetest_challenge'],$info['geetest_validate'],$info['geetest_seccode'])) {return  $this->success('验证成功');}return $this->error('验证失败');}}// 验证码的第二次验证public function apiVerif3(Request $request){$info = $request->all();// 判断服务器是否正常$gtserver = session()->get('gtserver');// 用户的id  一个随机数$user_id  = session()->get('user_id');$GtSdk = new GeetestLib(config('geetest.id'), config('geetest.key'));$data = array("user_id" => $user_id, # 网站用户id"client_type" => "h5", #web:电脑上的浏览器；h5:手机上的浏览器，包括移动应用内完全内置的web_view；native：通过原生SDK植入APP应用的方式"ip_address" => $request->getClientIp(), # 请在此处传输用户请求验证时所携带的IP);if ( $gtserver == 1) {   // 服务器正常$result = $GtSdk->success_validate($info['geetest_challenge'], $info['geetest_validate'], $info['geetest_seccode'], $data);if ($result) {return true; // echo '{"status":"success"}';}return false;} else {  // 服务器宕机,走failback模式if ($GtSdk->fail_validate($info['geetest_challenge'],$info['geetest_validate'],$info['geetest_seccode'])) {return  true;}return false;}}}

注册接口再次验证

use App\Http\Controllers\Api\RbacController;

//极验$geetest_challenge = Input::get('geetest_challenge','');$geetest_validate = Input::get('geetest_validate','');$geetest_seccode = Input::get('geetest_seccode','');if(!$geetest_challenge or !$geetest_validate or !$geetest_seccode){$error =config('geetest.client_fail_alert');return $this->error($error);}$RbacController = new RbacController();$human_iden = $RbacController->apiVerif3($request);if(!$human_iden){$error = config('geetest.server_fail_alert');return $this->error($error);}

其中引用类

<?php
namespace App;/*** 极验行为式验证安全平台，php 网站主后台包含的库文件** @author Tanxu*/
class GeetestLib {const GT_SDK_VERSION = 'php_3.0.0';public static $connectTimeout = 1;public static $socketTimeout  = 1;private $response;public function __construct($captcha_id, $private_key) {$this->captcha_id  = $captcha_id;$this->private_key = $private_key;$this->domain = "http://api.geetest.com";}/*** 判断极验服务器是否down机** @param array $data* @return int*/public function pre_process($param, $new_captcha=1) {$data = array('gt'=>$this->captcha_id,'new_captcha'=>$new_captcha);$data = array_merge($data,$param);$query = http_build_query($data);$url = $this->domain . "/register.php?" . $query;$challenge = $this->send_request($url);if (strlen($challenge) != 32) {$this->failback_process();return 0;}$this->success_process($challenge);return 1;}/*** @param $challenge*/private function success_process($challenge) {$challenge      = md5($challenge . $this->private_key);$result         = array('success'   => 1,'gt'        => $this->captcha_id,'challenge' => $challenge,'new_captcha'=>1);$this->response = $result;}/****/private function failback_process() {$rnd1           = md5(rand(0, 100));$rnd2           = md5(rand(0, 100));$challenge      = $rnd1 . substr($rnd2, 0, 2);$result         = array('success'   => 0,'gt'        => $this->captcha_id,'challenge' => $challenge,'new_captcha'=>1);$this->response = $result;}/*** @return mixed*/public function get_response_str() {return json_encode($this->response);}/*** 返回数组方便扩展** @return mixed*/public function get_response() {return $this->response;}/*** 正常模式获取验证结果** @param string $challenge* @param string $validate* @param string $seccode* @param array $param* @return int*/public function success_validate($challenge, $validate, $seccode,$param, $json_format=1) {if (!$this->check_validate($challenge, $validate)) {return 0;}$query = array("seccode" => $seccode,"timestamp"=>time(),"challenge"=>$challenge,"captchaid"=>$this->captcha_id,"json_format"=>$json_format,"sdk"     => self::GT_SDK_VERSION);$query = array_merge($query,$param);$url          = $this->domain . "/validate.php";$codevalidate = $this->post_request($url, $query);$obj = json_decode($codevalidate,true);if ($obj === false){return 0;}if ($obj['seccode'] == md5($seccode)) {return 1;} else {return 0;}}/*** 宕机模式获取验证结果** @param $challenge* @param $validate* @param $seccode* @return int*/public function fail_validate($challenge, $validate, $seccode) {if(md5($challenge) == $validate){return 1;}else{return 0;}}/*** @param $challenge* @param $validate* @return bool*/private function check_validate($challenge, $validate) {if (strlen($validate) != 32) {return false;}if (md5($this->private_key . 'geetest' . $challenge) != $validate) {return false;}return true;}/*** GET 请求** @param $url* @return mixed|string*/private function send_request($url) {if (function_exists('curl_exec')) {$ch = curl_init();curl_setopt($ch, CURLOPT_URL, $url);curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, self::$connectTimeout);curl_setopt($ch, CURLOPT_TIMEOUT, self::$socketTimeout);curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);$data = curl_exec($ch);$curl_errno = curl_errno($ch);curl_close($ch);if ($curl_errno >0) {return 0;}else{return $data;}} else {$opts    = array('http' => array('method'  => "GET",'timeout' => self::$connectTimeout + self::$socketTimeout,));$context = stream_context_create($opts);$data    = @file_get_contents($url, false, $context);if($data){ return $data;}else{ return 0;} }}/**** @param       $url* @param array $postdata* @return mixed|string*/private function post_request($url, $postdata = '') {if (!$postdata) {return false;}$data = http_build_query($postdata);if (function_exists('curl_exec')) {$ch = curl_init();curl_setopt($ch, CURLOPT_URL, $url);curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, self::$connectTimeout);curl_setopt($ch, CURLOPT_TIMEOUT, self::$socketTimeout);//不可能执行到的代码if (!$postdata) {curl_setopt($ch, CURLOPT_USERAGENT, $_SERVER['HTTP_USER_AGENT']);} else {curl_setopt($ch, CURLOPT_POST, 1);curl_setopt($ch, CURLOPT_POSTFIELDS, $data);}$data = curl_exec($ch);if (curl_errno($ch)) {$err = sprintf("curl[%s] error[%s]", $url, curl_errno($ch) . ':' . curl_error($ch));$this->triggerError($err);}curl_close($ch);} else {if ($postdata) {$opts    = array('http' => array('method'  => 'POST','header'  => "Content-type: application/x-www-form-urlencoded\r\n" . "Content-Length: " . strlen($data) . "\r\n",'content' => $data,'timeout' => self::$connectTimeout + self::$socketTimeout));$context = stream_context_create($opts);$data    = file_get_contents($url, false, $context);}}return $data;}/*** @param $err*/private function triggerError($err) {trigger_error($err);}
}

其中引用js

拖动图形验证码(极验验证)相关推荐

Spring Boot 极验验证滑动验证码
概要基于极验验证官网 java版gt3-java-sdk改编,使用Spring Boot 整合的极验滑动验证,包含form表单登录和ajax登录两种情况. 目录注册账户获取ID和KEY Demo源 ...
乱序图片极验_极验验证吴渊：传统图片验证方式已经无效了！
吴渊,极意网络CEO 黑五月频发的宕机门告诉我们:数据安全,所有创业者都应该关注! 让我们来听听IDG资本的两位投资人大佬的深刻分析,以及5家创业公司CEO/CTO大拿的深切呼吁吧!--这里不止有干货 ...
极验验证简介(待续)
百度百科介绍: 极验验证是一种在计算机领域用于区分自然人和机器人的,通过简单集成的方式,为开发者提供安全.便捷的云端验证服务. 与以往传统验证码不同的是,极验通过分析用户完成拼图过程中的行为特征,通过 ...
极验验证--滑块验证
极验验证–滑块验证本文通过通过模拟登录极验网站,完成滑块验证所用语言和相关模块 python3.6 selenium requests` PIL 极验验证码特点分析极验验证是一种在计算机领域用于 ...
iOS实现简书的登录验证方式(极验验证)
开篇我们登录简书的时候就会看到如下类似的验证方式,个人还是很喜欢这种验证方式的,想着如果把它自如自己设计的软件中还是不错的,但是我们要怎么实现这种验证效果呢,今天就来介绍一下. 图形验证码.gif ...
极验验证滑块破解，canvas
前言请勿用于商务用途哦,仅限于学习,否则后果自负哦有两篇关于极验验证滑块破解的文章,在此分享一下: https://www.jianshu.com/p/c8df1194b514 https://w ...
Android极验验证集成【滑块+文字验证】
前言: 先复制一段官网介绍产品介绍极验「行为验证」是一项可以帮助你的网站与APP识别与拦截机器程序批量自动化操作的SaaS应用.它是由极验开发的新一代人机验证产品,它不基于传统"问题-答 ...
【源码分析】极验验证官方SDK源码分析和实现思路
前言 2016年就这么来了,新的一年,继续努力~ 最近,除了12306的验证码火起来以后,还有一个在界面上拖拽的验证码,也火了起来,就是这次要说的极验验证,在这个万众创新的时代,工具类产品能做到这样, ...
极验接入教程纯html,VUE接入腾讯验证码,极验验证码
VUE接入腾讯验证码,极验验证码安装 $ npm install vue-social-captcha -S 使用在 main.js 文件中引入插件并注册 # main.js import ca ...

拖动图形验证码(极验验证)

拖动图形验证码(极验验证)相关推荐

最新文章

热门文章