2015年7月9日 星期四

[舊文] 教你如何使用reCAPTCHA驗證圖PHP V2.0之part 2篇

Google的reCAPTCHA驗證碼,分成4篇做說明,keys申請、PHP V1.0、PHP V2.0 ver 1.0.0、PHP V2.0 ver 1.1.2,此篇將說明PHP V2.0 ver 1.1.2部份。

看過教你如何使用reCAPTCHA驗證圖PHP V2.0之part 1篇,瞭解了ver 1.0.0的使用方式,接下來的ver 1.1.2就簡單多了,由於reCAPTCHA還陸續有在更新,所以需要知道,如何下載新版。

ver 1.0.0與ver 1.1.2的差異,ver 1.0.0是使用php物件,ver 1.1.2是使用php空間名稱。

https://developers.google.com/recaptcha/intro 拉至下方,點擊PHP連結。



https://github.com/google/recaptcha 點擊右邊Download ZIP,當然你也可以進入各個文件copy代碼,只是比較麻煩。



PHP V2.0 ver 1.1.2 本篇範例檔下載,在用7-zip之類壓縮軟體解壓

drive.googleonedrive.livedropbox下載教學

請注意一下,裡面各test運行檔,必須換上你的site key及secret key,才能運行。

另一點就是,由於reCAPTCHA還陸續有在更新,本篇範例檔可能已是舊代碼,只能當作參考,如果要使用,記得參考上述連結,至官網下載最新版。


phpex002/v112/test6.php 此方式為div容器,data設置site key值



phpex002/v112/test7.php 和上述一樣,差別在於,div容器設data-theme參數變更外觀,js為非同步延遲調用



phpex002/v112/test8.php 此方式為div容器設id,js可以靈活的設置其他參數及值,給對應的div容器id



phpex002/v112/test9.php 此方式可以取得回應值、重置、取得回應值及提交

當一個頁面,有複數個reCAPTCHA 必需另外給widgetId1、widgetId2之類參數,不然會無法辨認。



https://developers.google.com/recaptcha/docs/display 左側的Displaying the widget使用說明介紹:

JavaScript resource (api.js) parameters 為api.js後面能帶的參數名稱和值。



g-recaptcha tag attributes and grecaptcha.render parameters 為div容器能用的參數名稱、js能用的參數名稱、要給予參數名稱的值、預設值。



JavaScript API 之 Method 就是上述外面,在包一圈Method方法,有取得回應值、重置、提交。



呼●●●,看完一連4篇教學,大家應該,就能明白 Google 的 reCAPTCHA 驗證圖要如何使用了吧,It is so easy so smart。

文章更新 → reCAPTCHA 範例解說:使用 reCAPTCHA V2 類型【圖文教學】

文章更新 → reCAPTCHA 範例解說:使用 Invisible reCAPTCHA 類型【圖文教學】



對上述圖文教學,還不太明白的話,請至下方連結,查看youtube視頻解說。

視頻解說之第一部分:http://youtu.be/MIIWKRs4roQ

視頻解說之第二部分:http://youtu.be/toYXoz01dFI

謝謝大家,抽空觀看,files備份檔名:phpguides 005a 005b

1 則留言:

  1. 大大可以製作Invisible reCAPTCHA的教學嗎?官方的教學看得霧煞煞...

    回覆刪除

留言後,需等待,站長的查看,才會公開;請勿重複留言,謝謝。