فرم ورود به بخش مدیریت بهصورت آجاکس
در این مطلب، کد فرم ایجکس (اجاکس) ورود اعضا با استفاده از php، sql و اجاکس اسکریپت را جهت استفادهی شما عزیزان مهیا نمودهایم.
ویژگیها:
- ورود و بررسی اطلاعات با استفاده از پایگاه داده MySql
- استفاده از کد امنیتی Captcha
- بررسی شناسه و گذرواژه وارد شده بهصورت اجاکس
- بررسی کد امنیتی بهصورت اجاکس
- ورود ایمن (Safe login) با استفاده از session
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <html> <head> <title>بخش مدیریت نرمافزاری مبین سافت</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="css/style.css" media="all" type="text/css" rel="stylesheet"> <script src="http://code.jquery.com/jquery-1.6.4.js"></script> <script language="javascript"> // Developed by Roshan Bhattarai // Visit http://roshanbh.com.np for this script and more. // This notice MUST stay intact for legal use $(document).ready(function() { $("#login_form").submit(function() { //remove all the class add the messagebox classes and start fading $("#msgbox").removeClass().addClass('messagebox').text('در حال بررسی...').fadeIn(1000); $.post("captcha/validate.php",{ Captcha:$('#captcha').val() } ,function(data) { if (data=='no') //if correct login detail { $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox { //add message and change the class of the box and start fading $(this).html('کد امنیتی وارد شده صحیح نیست!').addClass('messageboxerror').fadeTo(900,1); }); } else CheckLogin(); }); //check the username exists or not from ajax return false; //not to post the form physically }); //now call the ajax also focus move from $("#captcha").blur(function() { $("#login_form").trigger('submit'); }); }); function CheckLogin() { $.post("ajax_login.php",{ user_name:$('#username').val(),password:$('#password').val(),rand:Math.random() } ,function(data) { if(data=='yes') //if correct login detail { $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox { //add message and change the class of the box and start fading $(this).html('در حال ورود.....').addClass('messageboxok').fadeTo(900,1, function() { //redirect to secure page document.location='secure.php'; }); }); } else { $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox { //add message and change the class of the box and start fading $(this).html('شناسه یا گذرواژه اشتباه است!').addClass('messageboxerror').fadeTo(900,1); }); } } ); } function refreshCaptcha() { var img = document.images['captchaimg']; img.src = img.src.substring(0,img.src.lastIndexOf("?"))+"?rand="+Math.random()*1000; } </script> </head> <body> <br> <br> <form method="post" action="" id="login_form"> <fieldset> <br> <p style='font-weight:bold; text-align:center'> شناسه: admin<br> گذرواژه: mobin <br><br></p> <div class="top" > شناسه و گذرواژه را وارد نمایید. - <strong><a href="https://www.mobinsoft.net">نرم افزاری مبین سافت</a></strong></div> <div > <br><br> <label for="uName" id="name_label">شناسه: </label> <input name="username" type="text" id="username" value="" maxlength="20" class="text-input" /> <label for="uName" id="name_label">گذرواژه: </label> <input name="password" type="password" id="password" value="" maxlength="20" class="text-input" /> <p align=center > <img src="captcha/captcha_code_file.php?rand=<?php echo rand(); ?>" id='captchaimg' ><br></p> <label for='Captcha' id="captcha_label">کد بالا را وارد نمایید: </label> <input type="text" name="Captcha" id="captcha" size="20" value="" class="text-input" /> <small align=center >اگر قادر به خواندن کد نیستید، <a href='javascript: refreshCaptcha();'>اینجا</a> کلیک کنید.</small> <input name="Submit" type="submit" id="submit" value=" ورود " class="button"/> <span id="msgbox" style="display:none"></span> <br><br> </div> </fieldset> </form> </body> </html>
کد آماده را میتوانید از بخش زیر دانلود نمایید.
ابتدا محتوبات فایل را استخراج نموده و سپس فایل db_mobin را از طریق phpmyadmin درج (Import) نمایید.
ajax login form with captcha (669 دانلود ها )
متخصص امنیتم
همهچیز در حد متوسط امنیتی در این اسکریپت لاگین خوب بود
اما یه چیز اسکریپت های اجاکس در سمت کلاینت کاملا قابل دستکارین
پس درستش اینه که کد کپچا در سرور تست بشه که درسته یا نه
اهان حواسم نبود درسته