相信用過Xoops架站的朋友最怕就是遇到機器人了,每天都來註冊產生一大推的垃圾帳號,刪到手都酸了還刪不完,所想以說在佈景中寫一個js+php+ajax的防機器人驗證機制來阻擋垃圾帳號的建立,解決註冊機器人出亂的問題。
範例網站:http://demoweb.neodw.com/themesdemo/modules/profile/register.php
防機器運作方式是這樣,先由js建立10位數的隨機碼,然後透過js建構一個name='verification'欄位取得隨機碼值,另外再透過ajax吧隨機碼值存入$_SESSION['profile_post']中,當user送出表單時所建構的欄位name='verification'會吧數值post到註冊表單的第二頁,然後php會讀取ajax的$_SESSION['profile_post']數值與post過來的$verification核對,如果數值相符則進行後續的註冊流程,若不相符或是$_SESSION['profile_post']為空值則返回首頁顯示【本站不歡迎機器人註冊】的文字,所以就算機器人使用的瀏覽器沒啟用javascript也一樣無法送出註冊會員表單,在第二頁就會被阻擋,資料不會被寫入資料庫中。
製作註冊表單防機器人方法如下(請先安裝profile會員管理模組):
1、於Xoops佈景根目錄中建立一個js資料夾(佈景最頂層目錄),然後建立一個anti-robot.js檔,並貼入以下的code
/*==========註冊頁面防機器人設置==============*/
/*================產生亂數==================*/
var chars = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];
function generateMixed(n) {
var res = "";
for(var i = 0; i < n ; i ++) {
var id = Math.ceil(Math.random()*35);
res += chars[id];
}
return res;
}
var $randomvalue=generateMixed(10);
$(window).load(function() {
$('#profile-form-regform .odd .formButton').attr('disabled', true);
$('#regform #step').attr('disabled', true);
$("#profile-form-regform .odd .formButton").before("<input type='checkbox' id='notarobot' /><label>"+$notarobot+"</label><br /><br />");
$("#profile-form-regform .odd .formButton").after("<input class='verification' type='hidden' disabled='disabled' name='verification' value='"+$randomvalue+"'>");
$("#notarobot").click(function(){
$('#notarobot').attr('disabled', true);
$('#regform #step').attr('disabled', false);
$('.verification').attr('disabled', false);
$('#profile-form-regform .odd .formButton').attr('disabled', false);
$.ajax({
url: $ajaxurl+'/ajax.php',
type: 'POST',
data: {id: '1',random: $randomvalue},
})
});
2、於Xoops樣板<head></head>之間貼上以下的引入js語法連結及代入變數
<{*防機器人*}>
<{if $xoops_dirname eq profile}>
<script>
var $ajaxurl="<{$xoops_imageurl}>program";
var $notarobot="<{$smarty.const._MD_IMNOTAROBOT}>";
</script>
<script type="text/javascript" src="<{$xoops_imageurl}>js/anti-robot.js"></script>
<{/if}>
3、於Xoops佈景根目錄中建立一個program資料夾(佈景最頂層目錄),於program資料夾中建立一個ajax.php檔,用筆記本打開,貼入一下的code
<?php
include "../../../mainfile.php";
$random=(empty($_REQUEST['random']))?"":$_REQUEST['random'];
$id=(empty($_REQUEST['id']))?"":$_REQUEST['id'];
if($id==1){
$_SESSION['profile_post']["random"]=$random;
}
?>
4、於Xoops佈景的language資料夾中找到tchinese_utf8/main.php,用筆記本打開,貼上以下的code:
/*===註冊表單防機器人========*/
define('_MD_NOTWELCOME','機器人請勿註冊');
define('_MD_IMNOTAROBOT','我不是機器人(請勾選)');
5、於xoops佈景根目錄中建立一個modules資料夾,然後在其中在建立一個profile資料夾,於profile資料夾中建立一個profile_form.tpl檔,用筆記本打開並貼上以下的code
<{php}>
$step=$_POST['step'];
$verification=$_POST['verification'];
if($step==1 and ($verification!=$_SESSION['profile_post']["random"] or $_SESSION['profile_post']["random"]==NULL)){
redirect_header(XOOPS_URL,0 , _MD_NOTWELCOME);
}
<{/php}>
<{$xoForm.javascript}>
<form id="<{$xoForm.name}>" name="<{$xoForm.name}>" action="<{$xoForm.action}>" method="<{$xoForm.method}>" <{$xoForm.extra}> >
<table class="table table-striped profile-form" id="profile-form-<{$xoForm.name}>">
<{foreach item=element from=$xoForm.elements}>
<{if !$element.hidden}>
<tr>
<td class="head">
<div class='xoops-form-element-caption<{if $element.required}>-required<{/if}>'>
<span class='caption-text'><{$element.caption}></span>
<span class='caption-marker'>*</span>
</div>
<{if $element.description != ""}>
<div class='xoops-form-element-help'><{$element.description}></div>
<{/if}>
</td>
<td class="<{cycle values='odd, even'}>">
<{$element.body}>
</td>
</tr>
<{/if}>
<{/foreach}>
</table>
<{foreach item=element from=$xoForm.elements}>
<{if $element.hidden}>
<{$element.body}>
<{/if}>
<{/foreach}>
</form>
6、清除xoops暫存檔,就完成註冊表單防機器人的建置工作了!
暫存檔清除路徑
xoops_data\caches\smarty_cache
xoops_data\caches\smarty_compile
xoops_data\caches\xoops_cache
備註:neilambilight2.5版後的佈景都會配置此項功能
教學撰寫:徐嘉裕 neil hsu
範例網站:http://demoweb.neodw.com/themesdemo/modules/profile/register.php
防機器運作方式是這樣,先由js建立10位數的隨機碼,然後透過js建構一個name='verification'欄位取得隨機碼值,另外再透過ajax吧隨機碼值存入$_SESSION['profile_post']中,當user送出表單時所建構的欄位name='verification'會吧數值post到註冊表單的第二頁,然後php會讀取ajax的$_SESSION['profile_post']數值與post過來的$verification核對,如果數值相符則進行後續的註冊流程,若不相符或是$_SESSION['profile_post']為空值則返回首頁顯示【本站不歡迎機器人註冊】的文字,所以就算機器人使用的瀏覽器沒啟用javascript也一樣無法送出註冊會員表單,在第二頁就會被阻擋,資料不會被寫入資料庫中。
製作註冊表單防機器人方法如下(請先安裝profile會員管理模組):
1、於Xoops佈景根目錄中建立一個js資料夾(佈景最頂層目錄),然後建立一個anti-robot.js檔,並貼入以下的code
/*==========註冊頁面防機器人設置==============*/
/*================產生亂數==================*/
var chars = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];
function generateMixed(n) {
var res = "";
for(var i = 0; i < n ; i ++) {
var id = Math.ceil(Math.random()*35);
res += chars[id];
}
return res;
}
var $randomvalue=generateMixed(10);
$(window).load(function() {
$('#profile-form-regform .odd .formButton').attr('disabled', true);
$('#regform #step').attr('disabled', true);
$("#profile-form-regform .odd .formButton").before("<input type='checkbox' id='notarobot' /><label>"+$notarobot+"</label><br /><br />");
$("#profile-form-regform .odd .formButton").after("<input class='verification' type='hidden' disabled='disabled' name='verification' value='"+$randomvalue+"'>");
$("#notarobot").click(function(){
$('#notarobot').attr('disabled', true);
$('#regform #step').attr('disabled', false);
$('.verification').attr('disabled', false);
$('#profile-form-regform .odd .formButton').attr('disabled', false);
$.ajax({
url: $ajaxurl+'/ajax.php',
type: 'POST',
data: {id: '1',random: $randomvalue},
})
});
2、於Xoops樣板<head></head>之間貼上以下的引入js語法連結及代入變數
<{*防機器人*}>
<{if $xoops_dirname eq profile}>
<script>
var $ajaxurl="<{$xoops_imageurl}>program";
var $notarobot="<{$smarty.const._MD_IMNOTAROBOT}>";
</script>
<script type="text/javascript" src="<{$xoops_imageurl}>js/anti-robot.js"></script>
<{/if}>
3、於Xoops佈景根目錄中建立一個program資料夾(佈景最頂層目錄),於program資料夾中建立一個ajax.php檔,用筆記本打開,貼入一下的code
<?php
include "../../../mainfile.php";
$random=(empty($_REQUEST['random']))?"":$_REQUEST['random'];
$id=(empty($_REQUEST['id']))?"":$_REQUEST['id'];
if($id==1){
$_SESSION['profile_post']["random"]=$random;
}
?>
4、於Xoops佈景的language資料夾中找到tchinese_utf8/main.php,用筆記本打開,貼上以下的code:
/*===註冊表單防機器人========*/
define('_MD_NOTWELCOME','機器人請勿註冊');
define('_MD_IMNOTAROBOT','我不是機器人(請勾選)');
5、於xoops佈景根目錄中建立一個modules資料夾,然後在其中在建立一個profile資料夾,於profile資料夾中建立一個profile_form.tpl檔,用筆記本打開並貼上以下的code
<{php}>
$step=$_POST['step'];
$verification=$_POST['verification'];
if($step==1 and ($verification!=$_SESSION['profile_post']["random"] or $_SESSION['profile_post']["random"]==NULL)){
redirect_header(XOOPS_URL,0 , _MD_NOTWELCOME);
}
<{/php}>
<{$xoForm.javascript}>
<form id="<{$xoForm.name}>" name="<{$xoForm.name}>" action="<{$xoForm.action}>" method="<{$xoForm.method}>" <{$xoForm.extra}> >
<table class="table table-striped profile-form" id="profile-form-<{$xoForm.name}>">
<{foreach item=element from=$xoForm.elements}>
<{if !$element.hidden}>
<tr>
<td class="head">
<div class='xoops-form-element-caption<{if $element.required}>-required<{/if}>'>
<span class='caption-text'><{$element.caption}></span>
<span class='caption-marker'>*</span>
</div>
<{if $element.description != ""}>
<div class='xoops-form-element-help'><{$element.description}></div>
<{/if}>
</td>
<td class="<{cycle values='odd, even'}>">
<{$element.body}>
</td>
</tr>
<{/if}>
<{/foreach}>
</table>
<{foreach item=element from=$xoForm.elements}>
<{if $element.hidden}>
<{$element.body}>
<{/if}>
<{/foreach}>
</form>
6、清除xoops暫存檔,就完成註冊表單防機器人的建置工作了!
暫存檔清除路徑
xoops_data\caches\smarty_cache
xoops_data\caches\smarty_compile
xoops_data\caches\xoops_cache
備註:neilambilight2.5版後的佈景都會配置此項功能
教學撰寫:徐嘉裕 neil hsu
留言
張貼留言