跳到主要內容

於Xoops佈景中製作一個profile模組註冊頁面的防機器人機制(js+php+ajax)-教學撰寫:徐嘉裕Neil hsu

相信用過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



留言

這個網誌中的熱門文章

好用的windows備份檔案dos指令XCOPY-教學撰寫:徐嘉裕Neil hsu

要快速的備份某個硬碟全部資料到備份硬碟中,雖然是可以用windows內建的備份與還原,但如果重灌windows可會有key不同而無法還原的問題,還要改一堆設定煩死了,直接用dos指令XCOPY來做檔案的複製就很快了,資料也不會丟失,好朋友可以參考看看!! 首先開啟windows所有程式->附屬應用程式->開啟命令提示字元! 然後輸入以下指令 XCOPY C:\xxx   F:\xxx /s 藍字的 C:\xxx  為複製檔案來源位置例如要複製整個C槽就輸入 C:\ 綠色的   F:\xxx 為複製目的位置,例如要放到F槽的備份資料夾,就輸入  F:\ 備份 紅字的 S 為複製類型參數,可以自行修改為以下的參數設定: ================================================================= /A    只複製設定成保存屬性的檔案,不要改變屬性的設定。 /M    只複製設定成保存屬性的檔案,並清除保存屬性。 /D:m-d-y  複製指定日期當天或之後變更的檔案。如果沒給日期,只複製那些來源檔案日期比目的檔案日期為新的檔案。 /EXCLUDE:file1[+file2][+file3]...         指定檔案清單字串。每個字串應在不同行。如果有字串對應到要進行複製的檔案絕         對路徑的任何部分,這個檔案會被排除複製。例如,指定字串         \obj\ 或 .obj 的話,會排除所有在 obj 目錄下副檔名是.obj 的檔案複製。 /P    在建立每個目的檔案時顯示提示。 /S    複製每個目錄及其包含的子目錄,不複製空目錄。 /E    複製每個目錄及其包含的子目錄,也複製空目錄。/S 與 /E相同,能夠用來修改 /T。 /V    驗證每個新檔案。 /W    在複製之前提示您按鍵繼續。 /C    如果錯誤發生時也繼續複製。 /I    如果目的不存在且複製一個以上的檔案的話,就假設指定的目的一定是目錄。 /Q    在複製時不要顯示檔名。 /F    在複製時顯示來源及

jQuery取得下拉選單selected中數值與內容的方法

假設選單狀態為: <select id='selectname '> <option value='v1' data-id="d1">選單A</option> <option value='v2' data-id="d2">選單B</option> <option value='v3' data-id="d3">選單C</option> </select> 以jQuery取得選單數值與內容方法如下: 1、取得下拉選單 value 數值的方法 $selectname=$('#selectname').val(); alert($selectname); //顯示選單中 selected 狀態的value數值v1 or  v2  or  v3。 2、取得下拉選單中 data-id 數值的方法 $data-id= $(this).find(':selected').attr('data-id'); alert($data-id); //顯示選單中 selected 狀態的data-id數值d1 or  d2 or  d3。 3、取得下拉選單中 文字 的方法 $selecttext=$(this).find(':selected').text(); alert($selecttext); //顯示選單中 selected 狀態的文字內容,如選單A or  選單B or 選單C。 教學撰寫:徐嘉裕 Neil hsu

CentOS7啟用ssh的設定方法-教學撰寫:徐嘉裕Neil hsu

安裝好CentOS7後可以在圖形化介面中點選右鍵->開啟服務器修改設定後啟用SSH設定,方法如下: 1、先安裝openssh套件 sudo yum install openssh* 2、用 gedit 開啟sshd_config編輯 (不要用vi很難編輯的) sudo gedit /etc/ssh/sshd_config 3、增加可連線SSH帳號 AllowUsers admin (此欄位需要自行新增) 4、修改PORT吧 # 註解拿掉 (可以改成8022PORT或其他PORT都可以) Port 22 搜尋PermitRootLogin吧 # 註解拿掉 PermitRootLogin no 再來把這兩行的 # 註解拿掉 PermitEmptyPasswords no PasswordAuthentication yes 搜尋Protocol設定使用SSHv2連線 Protocol 2 sudo systemctl restart sshd.service    重新啟動service sudo systemctl enable sshd.service    設定開機啟動SSH sudo semanage port -a -t ssh_port_t -p tcp 22      防火牆允許22 PORT 或 sudo firewall-cmd --permanent --zone=public --add-port=22/tcp 重新載入防火牆設定 sudo firewall-cmd --reload sudo  netstat -ant | grep :22 查看 22PORT 查詢現在SELinux設定清單中的SSH服務有哪些Port sudo semanage port -l | grep ssh ssh_port_t tcp 8022, 22 怎麼測試? 格式:登入帳號@IP或主機名稱 指令:-p SSH服務Port號 sudo ssh -p 22 admin@192.168.1.100 如設定的Port在清單中 ,那就表示SSH設定完成防火牆也開啟列外了,之後再用遠端的PuTTY輸入 IP/Port 連線,然後輸入 帳號/密碼,就能用SSH連線進入主機了, 在透