thinkphp3.2點擊重新整理產生驗證碼

來源:互聯網
上載者:User
再介紹thinkphp3.2驗證碼的使用方法之前,先為大家詳細介紹ThinkPHP 驗證碼,具體內容如下

ThinkPHP 內建了驗證碼的支援,可以直接使用。要使用驗證碼,需要匯入擴充類庫中的 ORG.Util.Image 類庫和 ORG.Util.String 類庫。
驗證碼方法
我們通過在在模組類中增加一個 verify 方法來用於顯示驗證碼,最簡單的例子:

Public function verify(){  // 匯入Image類庫  import("ORG.Util.Image");  Image::buildImageVerify();}

import 方法是 ThinkPHP 內建的類庫和檔案匯入方法,上例匯入的檔案為 ThinkPHP 系統目錄下 Lib/ORG/Util/Image.class.php 檔案。如果已經將 Image 類庫拷貝到了當前項目下,如 Lib/ORG 下,則可以以:

import("@.Util.Image");

import 方法是 ThinkPHP 內建的類庫和檔案匯入方法,上例匯入的檔案為 ThinkPHP 系統目錄下 Lib/ORG/Util/Image.class.php 檔案。
訪問驗證碼
可以直接在瀏覽器裡訪問該驗證碼方法以確定驗證碼是否能正常顯示:
http://127.0.0.1/index.php/Public/verify
如果一切正常,顯示驗證碼如下所示:

表單中使用驗證碼
在表單頁面中使用驗證碼,是以 html img標籤 來調用:

<input type="text" name="verify"><img id="verifyImg" src="-Article-verify" onClick="changeVerify()" title="點擊重新整理驗證碼" />

src 屬性值即為驗證碼方法訪問地址,視實際情況不同而不同。
驗證碼重新整理
當點擊驗證碼圖片時,觸發 JavaScript changeVerify() 函數重新讀取驗證碼,從而實現驗證碼重新整理。該函數參考如下:

<script language="JavaScript">function changeVerify(){ var timenow = new Date().getTime(); document.getElementById('verifyImg').src='-Article/verify/'+timenow;}</script>

驗證碼驗證
在調用驗證碼 verify 的時候,buildImageVerify 會記錄本次驗證碼的 MD5 資訊。在表單驗證操作裡,以如下方法來檢查驗證碼是否正確:

if($_SESSION['verify'] != md5($_POST['verify'])) {  $this->error('驗證碼錯誤!');}

其中 $_SESSION['verify'] 中的 verify 名稱為 buildImageVerify 方法預設 SESSION 註冊名稱,具體見 buildImageVerify 文法。
上面例子示範了最簡單的 ThinkPHP 驗證碼的使用方法。上面的例子驗證碼是 4 位元字,如果想使用更多風格的驗證碼以及中文驗證碼,參見本節其餘部分內容:《ThinkPHP 使用不同風格及中文的驗證碼》。
驗證碼不顯示原因
如下發現無法顯示驗證碼,可能的原因如下:
1、PHP 是否已經安裝 GD 庫支援。
2、輸出之前是否有任何的輸出(尤其是 UTF8 的 BOM 頭資訊輸出)。
3、Image 類庫是否正確匯入。
4、如果是表單頁面,請查看是否正確調用了驗證碼顯示方法。

下面就為大家介紹 thinkphp3.2 驗證碼產生和點擊重新整理驗證碼的實現方法,具體內容如下

一、執行個體化產生驗證碼的類(該方法放到IndexController裡面便於訪問)

/** * * 驗證碼產生 */public function verify_c(){  $Verify = new \Think\Verify();  $Verify->fontSize = 18;  $Verify->length  = 4;  $Verify->useNoise = false;  $Verify->codeSet = '0123456789';  $Verify->imageW = 130;  $Verify->imageH = 50;  //$Verify->expire = 600;  $Verify->entry();}

二、前台需要產生驗證碼的圖片src屬性指向

<p class="top15 captcha" id="captcha-container"> <input name="verify" width="50%" height="50" class="captcha-text" placeholder="驗證碼" type="text">         <img width="30%" class="left15" height="50" alt="驗證碼" src="{:U('Home/Index/verify_c',array())}" title="點擊重新整理"></p>

三、寫完上面的後,頁面初始化的驗證碼就可以出現了,下面要寫的就是點擊驗證碼圖片後,重新整理出新的驗證碼圖片(通過jquery修改圖片的src屬性來完成,請求的處理函數一樣,只是在請求後加一個隨機數,區別上一張圖片的請求)

// 驗證碼產生var captcha_img = $('#captcha-container').find('img')var verifyimg = captcha_img.attr("src");captcha_img.attr('title', '點擊重新整理');captcha_img.click(function(){  if( verifyimg.indexOf('?')>0){    $(this).attr("src", verifyimg+'&random='+Math.random());  }else{    $(this).attr("src", verifyimg.replace(/\?.*$/,'')+'?'+Math.random());  }});

四、校正驗證碼輸入是否正確
a.在common目錄下的function.php裡加入全域函數

/** * 驗證碼檢查 */function check_verify($code, $id = ""){  $verify = new \Think\Verify();  return $verify->check($code, $id);}

b.在表單提交的controller對應的處理方法裡添加檢查代碼

// 檢查驗證碼$verify = I('param.verify','');if(!check_verify($verify)){  $this->error("親,驗證碼輸錯了哦!",$this->site_url,9);}

到此tp3.2驗證碼的使用就可以了。
補充:我在寫的時候將四的b步驟放到一個ajax裡驗證,返回一次檢驗結果。然後再依據返回結果確定是否要提交表單,但是在驗證碼通過第一次的校正後,第二次的就不可以了,目前還沒想明白原因。

這就是本文的全部內容,文章最後還有一個小小的疑問,希望大家可以想出解決辦法,也希望本文對大家的學習有所協助。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.