快捷導(dǎo)航

Thinkphp極驗(yàn)滑動(dòng)驗(yàn)證碼實(shí)現(xiàn)步驟解析

更新時(shí)間：2020年11月24日 08:37:12 作者：ノGHJ

這篇文章主要介紹了Thinkphp極驗(yàn)滑動(dòng)驗(yàn)證碼實(shí)現(xiàn)步驟解析,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下

對(duì)于建站的筒子們來說；垃圾廣告真是讓人深惡痛絕；

為了清凈；搞個(gè)難以識(shí)別的驗(yàn)證碼吧；又被用戶各種吐槽；

直到后來出現(xiàn)了極驗(yàn)這個(gè)滑動(dòng)的驗(yàn)證碼；這真是一個(gè)體驗(yàn)好安全高的方案；

官網(wǎng)：http://www.geetest.com/ （此處應(yīng)該有廣告費(fèi)）

示例項(xiàng)目：https://github.com/baijunyao/thinkphp-bjyadmin

一：注冊(cè)獲取key

注冊(cè)；創(chuàng)建應(yīng)用；獲取key；

二：導(dǎo)入sdk

/ThinkPHP/Library/Org/Xb/Geetest.class.php

三：生成驗(yàn)證樣式

/tpl/Home/Index/index.html

<div class="box">
  <h4>
    <a target="_blank"  rel="external nofollow" >thinkphp整合系列之極驗(yàn)滑動(dòng)驗(yàn)證碼</a>
  </h4>
  <form id="geetest" action="{:U('Home/Index/geetest_submit_check')}" method="post">
    賬號(hào)：<input type="text" name="username" value="admin">
    密碼：<input type="text" name="password" value="123456">
    <input type="button" value="異步驗(yàn)證登錄" onclick="check_verify()">
    <input type="submit" value="post提交登錄">
    <div id="captcha"></div>
  </form>
</div>
<script src="/Public/statics/js/jquery-1.10.2.min.js"></script>
<script src="http://static.geetest.com/static/tools/gt.js"></script>
<script>
  var handler = function (captchaObj) {
    // 將驗(yàn)證碼加到id為captcha的元素里
    captchaObj.appendTo("#captcha");
   };
  // 獲取驗(yàn)證碼
  $.get("{:U('Home/Index/geetest_show_verify')}", function(data) {
    // 使用initGeetest接口
    // 參數(shù)1：配置參數(shù)，與創(chuàng)建Geetest實(shí)例時(shí)接受的參數(shù)一致
    // 參數(shù)2：回調(diào)，回調(diào)的第一個(gè)參數(shù)驗(yàn)證碼對(duì)象，之后可以使用它做appendTo之類的事件
    initGeetest({
      gt: data.gt,
      challenge: data.challenge,
      product: "float", // 產(chǎn)品形式
      offline: !data.success
    }, handler);
  },'json');
  // 檢測(cè)驗(yàn)證碼
  function check_verify(){
    // 組合驗(yàn)證需要用的數(shù)據(jù)
    var test=$('.geetest_challenge').val();
    var postData={
      geetest_challenge: $('.geetest_challenge').val(),
      geetest_validate: $('.geetest_validate').val(),
      geetest_seccode: $('.geetest_seccode').val()
    }
    // 驗(yàn)證是否通過
    $.post("{:U('Home/Index/geetest_ajax_check')}", postData, function(data) {
      if (data==1) {
        alert('驗(yàn)證成功');
      }else{
        alert('驗(yàn)證失敗');
      }
    });
  }
</script>

HTML

四：驗(yàn)證函數(shù)

/Application/Common/Common/function.php

/**
 * geetest檢測(cè)驗(yàn)證碼
 */
function geetest_chcek_verify($data){
  $geetest_id=C('GEETEST_ID');
  $geetest_key=C('GEETEST_KEY');
  $geetest=new \Org\Xb\Geetest($geetest_id,$geetest_key);
  $user_id=$_SESSION['geetest']['user_id'];
  if ($_SESSION['geetest']['gtserver']==1) {
    $result=$geetest->success_validate($data['geetest_challenge'], $data['geetest_validate'], $data['geetest_seccode'], $user_id);
    if ($result) {
      return true;
    } else{
      return false;
    }
  }else{
    if ($geetest->fail_validate($data['geetest_challenge'],$data['geetest_validate'],$data['geetest_seccode'])) {
      return true;
    }else{
      return false;
    }
  }
}

PHP

多謝香蕉你個(gè)banana 童鞋的提醒；補(bǔ)上驗(yàn)證的函數(shù)；

五：php 生成驗(yàn)證碼并驗(yàn)證

/Application/Home/Controller/IndexController.class.php

/**
 * geetest生成驗(yàn)證碼
 */
public function geetest_show_verify(){
  $geetest_id=C('GEETEST_ID');
  $geetest_key=C('GEETEST_KEY');
  $geetest=new \Org\Xb\Geetest($geetest_id,$geetest_key);
  $user_id = "test";
  $status = $geetest->pre_process($user_id);
  $_SESSION['geetest']=array(
    'gtserver'=>$status,
    'user_id'=>$user_id
    );
  echo $geetest->get_response_str();
}
/**
 * geetest submit 提交驗(yàn)證
 */
public function geetest_submit_check(){
  $data=I('post.');
  if (geetest_chcek_verify($data)) {
    echo '驗(yàn)證成功';
  }else{
    echo '驗(yàn)證失敗';
  }
}
/**
 * geetest ajax 驗(yàn)證
 */
public function geetest_ajax_check(){
  $data=I('post.');
  echo intval(geetest_chcek_verify($data));
}

以上就是本文的全部內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: