سلام به تمامی شما عزیزان. در این قسمت قصد دارم در مورد صفحه login کاربر (یا همان فایل customer_login.php ) صحبت کنم. در این صفحه اگر کاربر email و password را به درستی وارد کند و ضمنا قبلا ایمیل خود را تایید کرده باشد، می تواند وارد سایت شود و در غیر اینصورت با نمایش پیام های درست او (مشتری) را راهنمایی می کنیم.
توجه داشته باشید که دوره آموزش ساخت فروشگاه اینترنتی به صورت متن محور (Text) بوده و به صورت کاملا رایگان توسط وب سایت روکسو منتشر شده است. برای دستیابی به تمام بخش های این دوره لطفا به انتهای همین صفحه مراجعه کنید.
دقت کنید در فلوچارت زیر تمامی اقداماتی که باید صورت دهیم را به صورت تصویری خدمت شما نمایش داده ام.
حالا که با فلوچارت این قسمت آشنا شدید، می رویم سراغ برنامه نویسی و کدهایی که باید با هم بنویسیم.
در ابتدا ما باید به سراغ فایل customer_login.php برویم. به همین خاطر به آدرس C:\wamp\www\ecommerce رفته و مانند تصویر زیر آن را با استفاده از Notepad++ باز کنید.
حالا همه کدهای موجود در فایل customer_login.php را پاک کنید و کدهای زیر را به جای آنها قرار دهید.
<?php include('includes/db.php'); ?> <div> <form method="post" action="" > <table width="100%" align="center" bgcolor="#EBBCE5"> <tr align="center" > <th colspan="3"> <h2>کاربر گرامی لطفا لاگین کنید و سپس خرید<br/><br/> های خود را ثبت نهایی کنید!</h2> </th> </tr> <tr> <td colspan="2" align="left"> <b style="color:#440522;">ایمیل:</b> </td> <td> <input type="text" name="email" placeholder="لطفا ایمیل خودتان را وارد کنید...." size="50" > </td> </tr> <tr> <td colspan="2" align="left"> <b style="color:#440522;">پسورد:</b> </td> <td> <input type="password" name="pass" placeholder="لطفا پسورد خودتان را وارد کنید...." size="50" > </td> </tr> <tr> <td colspan="3" align="center"> <input name="send_U_P" type="submit" value="وارد می شوم!" /> </td> </tr> </table> </form> <?php if(isset($_POST['send_U_P'])) { // receive email value from the form $c_email_no_empty = mysqli_real_escape_string($con ,$_POST['email']); // receive password value from the form $c_password_1_validate=mysqli_real_escape_string($con ,$_POST['pass']); if (empty($c_email_no_empty)) { if (empty($c_password_1_validate)) { echo "<script>alert('ایمیل و پسورد خود را وارد نکرده اید!!! آنها را وارد کنید!!!.')</script>"; }else{ echo "<script>alert('ایمیل خود را وارد نکرده ایید !!! آن را وارد نمایید.')</script>"; } }else{ if (empty($c_password_1_validate)){ echo "<script>alert('پسورد خود را وارد نکرده ایید آن را وارد نمایید!!!')</script>"; }else{ $c_email_validate=$c_email_no_empty; if(filter_var($c_email_validate,FILTER_VALIDATE_EMAIL) == true){ if(preg_match("/^(?=.*[A-z])(?=.*[0-9])(?=.*[$@])\S{6,12}$/", $c_password_1_validate)) { // email is valid $c_email=$c_email_validate; // password is valid $c_pass = $c_password_1_validate; }else{ echo "<script>alert('پسورد شما طبق الگو نمی باشد!!! پسورد صحیحی وارد نمایید.')</script>"; } }else{ echo "<script>alert('ایمیل شما صحیح نیست !!! یک ایمیل صحیح وارد کنید!')</script>"; } } } if( (isset($c_pass)) and (isset($c_email)) ) { $sel_c = "select * from customers where `customer_pass`='$c_pass' AND `customer_email`='$c_email' "; $run_c = mysqli_query($con,"SET NAMES utf8"); $run_c = mysqli_query($con,"SET CHARACTER SET utf8"); $run_c = mysqli_query($con,$sel_c); $check_customer = mysqli_num_rows($run_c); if($check_customer==0) { echo "<script>alert('نام کاربری و یا رمز عبور خود را اشتباه وارد کرده اید ، لطفا دوباره امتحان کنید!')</script>"; }else{ $sel_login = "select * from customers where `customer_email`='$c_email' "; $run_login = mysqli_query($con,"SET NAMES utf8"); $run_login = mysqli_query($con,"SET CHARACTER SET utf8"); $run_login = mysqli_query($con,$sel_login); while($run_customer_login=@mysqli_fetch_array($run_login)) { $customer_login_name = $run_customer_login['customer_name']; $customer_login_lastname = $run_customer_login['customer_lastname']; $customer_confirmed = $run_customer_login['confirmed']; } if($customer_confirmed==1){ //creating or using cookie if(isset($_COOKIE["ipUserEcommerce"])) { $ip = $_COOKIE["ipUserEcommerce"]; }else{ $ip=getIp(); setcookie('ipUserEcommerce',$ip,time()+1206900); } $sel_cart = "select * from cart where ip_add='$ip'"; $run_cart = mysqli_query($con,$sel_cart); $check_cart = mysqli_num_rows($run_cart); if($check_cart==0){ $_SESSION['customer_email'] = $c_email; echo "<script>alert('$customer_login_name $customer_login_lastname خوش آمدید، لاگین شما با موفقیت انجام شد. اکنون به صفحه پروفایل خود خواهید رفت!!!')</script>"; echo "<script>window.open('customer/my_account.php','_self')</script>"; }else{ $_SESSION['customer_email'] = $c_email; echo "<script>alert('$customer_login_name $customer_login_lastname خوش آمدید، لاگین شما با موفقیت انجام شد. اکنون برای پرداخت صورت حساب خود به درگاه زرین پال متصل خواهید شد!!!')</script>"; echo "<script>window.open('checkout.php','_self')</script>"; } }else{ echo "<script>alert('$customer_login_name $customer_login_lastname چرا ایمیل خودت را تایید نکرده ایی؟ به ایمیل خودت مراجعه کن و لینک ثبت نام را تایید کن!!!')</script>"; } } } } ?> <a class="new_account" href="customer_register.php">جدیدی؟ خب از اینجا ثبت نام کن.</a> <a class="forget_button" href="checkout.php?forgot_pass">پسورد خود را فراموش کرده اید؟</a> </div>
دقت کنید بعد از انجام این تغییر، یک تغییر کوچک نیز باید در فایل style.css اعمال کنیم. حالا به آدرس C:\wamp\www\ecommerce بروید و فایل style.css را با استفاده از notepad++ باز کنید و به انتهای آن کدهای زیر را اضافه نمایید.
/********** style for forget button and new account button in the customer_login page */ .new_account , .forget_button{ font-size: 16px; padding: 8px 14px 9px; font-weight: bold; line-height: 1; text-shadow: 0 -1px 1px rgba(0,0,0,0.25); color: #FFF !important; text-decoration: none !important; cursor: pointer; } .new_account{ float:right; background-color: #e22092; } .forget_button{ float:left; background-color: #91bd09; }
حالا مرورگر خود را باز کنید و به آدرس http://localhost/ecommerce/checkout.php می رویم. باید تصویر زیر برای شما به نمایش در بیایید.
خب حالا که این صفحه برای شما نمایان شد، در ادامه به شما توضیح می دهم که کدهای درون فایل customer_login.php چه بوده است.
در ابتدای فایل customer_login.php، کد زیر را با هم می بینیم.
<?php include('includes/db.php'); ?>
این کد برای اتصال به پایگاه داده مورد استفاده قرار می گیرد. در ادامه کدهای زیر را با هم می بینیم.
<div> <form method="post" action="" > <table width="100%" align="center" bgcolor="#EBBCE5"> <tr align="center" > <th colspan="3"> <h2>کاربر گرامی لطفا لاگین کنید و سپس خرید<br/><br/> های خود را ثبت نهایی کنید!</h2> </th> </tr> <tr> <td colspan="2" align="left"> <b style="color:#440522;">ایمیل:</b> </td> <td> <input type="text" name="email" placeholder="لطفا ایمیل خودتان را وارد کنید...." size="50" > </td> </tr> <tr> <td colspan="2" align="left"> <b style="color:#440522;">پسورد:</b> </td> <td> <input type="password" name="pass" placeholder="لطفا پسورد خودتان را وارد کنید...." size="50" > </td> </tr> <tr> <td colspan="3" align="center"> <input name="send_U_P" type="submit" value="وارد می شوم!" /> </td> </tr> </table> </form>
این کدها در واقع کدهای HTML هستند و درک آنها بسیار آسان است؛ در واقع فرمی که در تصویر زیر مشاهده می کنید را برای ما می سازند.
حالا نوبت به کدهای اصلی می رسد که ما با آنها داده های ورودی را پردازش خواهیم کرد.
بعد از ایجاد فرم ورود کاربر با HTML، به کدهای زیر می رسیم.
<?php if(isset($_POST['send_U_P'])) {
این کدها به ما می گویند اگر دکمه "وارد می شوم!" توسط کاربر فشار داده شد؛ بلوک زیر آن به اجرا درآید.
خب بیایید ببینیم وقتی بر روی دکمه "وارد می شوم!" فشار دادیم، چه اتفاقی روی می دهد. کدهای زیر را مشاهده کنید.
// receive email value from the form $c_email_no_empty = mysqli_real_escape_string($con ,$_POST['email']); // receive password value from the form $c_password_1_validate=mysqli_real_escape_string($con ,$_POST['pass']); if (empty($c_email_no_empty)) { if (empty($c_password_1_validate)) { echo "<script>alert('ایمیل و پسورد خود را وارد نکرده اید!!! آنها را وارد کنید!!!.')</script>"; }else{ echo "<script>alert('ایمیل خود را وارد نکرده ایید !!! آن را وارد نمایید.')</script>"; } }else{ if (empty($c_password_1_validate)){ echo "<script>alert('پسورد خود را وارد نکرده ایید آن را وارد نمایید!!!')</script>"; }else{ $c_email_validate=$c_email_no_empty; if(filter_var($c_email_validate,FILTER_VALIDATE_EMAIL) == true){ if(preg_match("/^(?=.*[A-z])(?=.*[0-9])(?=.*[$@])\S{6,12}$/", $c_password_1_validate)) { // email is valid $c_email=$c_email_validate; // password is valid $c_pass = $c_password_1_validate; }else{ echo "<script>alert('پسورد شما طبق الگو نمی باشد!!! پسورد صحیحی وارد نمایید.')</script>"; } }else{ echo "<script>alert('ایمیل شما صحیح نیست !!! یک ایمیل صحیح وارد کنید!')</script>"; } } }
اصلا نگران نباشید، کار خاصی در این کدها انجام نمی شود. فقط ایمیل و پسوردی که توسط کاربر وارد شده است، را ابتدا باید تایید کنیم ( باید ببینیم آیا کاربر آنها را پر کرده است و یا قصد حمله به سایت را نداشته باشد). برای درک کدهای بالا بهتر است قسمت های " اعتبارسنجی رمز عبور یا پسورد (Password) در PHP " و " اعتبارسنجی ایمیل در PHP (به همراه ورودی های شهرستان و استان) " را یکبار دیگر مرور کنید. من در فلوچارت زیر به راحتی برای شما نشان داده ام، کدها چه می گویند.
ببینید که در فلوچارت هر کدام از سوالات همان if هایی هستند که در کدها دیده می شوند. و هر کدام از پیام ها نیز نشان دهنده ی alert() های جاوااسکریپت می باشند.
بعد از کدهای بالا (تایید ایمیل و پسورد وارد شده) حالا به کدهای زیر می رسیم.
if( (isset($c_pass)) and (isset($c_email)) ) { $sel_c = "select * from customers where `customer_pass`='$c_pass' AND `customer_email`='$c_email' "; $run_c = mysqli_query($con,"SET NAMES utf8"); $run_c = mysqli_query($con,"SET CHARACTER SET utf8"); $run_c = mysqli_query($con,$sel_c); $check_customer = mysqli_num_rows($run_c); if($check_customer==0) { echo "<script>alert('نام کاربری و یا رمز عبور خود را اشتباه وارد کرده اید ، لطفا دوباره امتحان کنید!')</script>"; }else{
در این کدها همانگونه که مشاهده می نمایید، ابتدا با دستور شرطی if( (isset($c_pass)) and (isset($c_email)) )
نگاه می کنیم ببینیم آیا متغییر های $c_pass
و $c_email
وجود دارند یا خیر؟ اگر وجود داشتند، در خطهای بعد به پایگاه داده و جدول داده ایی customers
متصل می شویم و با استفاده از دستور SQL که مشاهده می کنید به دنبال رکوردی می گردیم که ایمیل و پسوردش برابر با متغییر های $c_email
و $c_pass
باشد. و سپس با استفاده از تابع mysqli_num_rows()
تعداد این رکورد ها (رکوردهایی که در شرایط دستور SQL صدق می کنند) را می شماریم.
در خط بعدی و در دستور شرطی if($check_customer==0)
اگر این تعداد برابر صفر باشد (یعنی اصلا رکوردی پیدا نشود یا بهتر است بگویم که چنین کاربری تا اکنون ثبت نام نکرده باشد.) یک پیام تحت عنوان "نام کاربری و یا رمز عبور خود را اشتباه وارد کرده اید، لطفا دوباره امتحان کنید!"
برای کاربر به نمایش در خواهد آمد.
حالا به کدهای زیر می رسیم.
$sel_login = "select * from customers where `customer_email`='$c_email' "; $run_login = mysqli_query($con,"SET NAMES utf8"); $run_login = mysqli_query($con,"SET CHARACTER SET utf8"); $run_login = mysqli_query($con,$sel_login); while($run_customer_login=@mysqli_fetch_array($run_login)) { $customer_login_name = $run_customer_login['customer_name']; $customer_login_lastname = $run_customer_login['customer_lastname']; $customer_confirmed = $run_customer_login['confirmed']; }
همانطور که مشاهده می کنید با استفاده از یک دستور SQL ما ابتدا ایمیل را در جدول داده ایی customers پیدا می کنیم. و در ادامه کد تایید (یا همان فیلد confirmed )، بعلاوه اسم و فامیل کاربر را از دیتابیس بیرون می آوریم و در متغییر های مشخص شده قرار می دهیم.
اگر یادتان باشد، زمانی کاربر ایمیل خود را تایید کرده است که فیلد confirmed دارای مقدار یک باشد. این موضوع در ادامه و در کد زیر به عنوان یک دستور شرطی آورده شده است.
if($customer_confirmed==1){
حالا اگر دستور بالا درست باشد کدهای زیر اجرا می شوند.
//creating or using cookie if(isset($_COOKIE["ipUserEcommerce"])) { $ip = $_COOKIE["ipUserEcommerce"]; }else{ $ip=getIp(); setcookie('ipUserEcommerce',$ip,time()+1206900); } $sel_cart = "select * from cart where ip_add='$ip'"; $run_cart = mysqli_query($con,$sel_cart); $check_cart = mysqli_num_rows($run_cart); if($check_cart==0){ $_SESSION['customer_email'] = $c_email; echo "<script>alert('$customer_login_name $customer_login_lastname خوش آمدید، لاگین شما با موفقیت انجام شد. اکنون به صفحه پروفایل خود خواهید رفت!!!')</script>"; echo "<script>window.open('customer/my_account.php','_self')</script>"; }else{ $_SESSION['customer_email'] = $c_email; echo "<script>alert('$customer_login_name $customer_login_lastname خوش آمدید، لاگین شما با موفقیت انجام شد. اکنون برای پرداخت صورت حساب خود به درگاه زرین پال متصل خواهید شد!!!')</script>"; echo "<script>window.open('checkout.php','_self')</script>"; } }else{ echo "<script>alert('$customer_login_name $customer_login_lastname چرا ایمیل خودت را تایید نکرده ایی؟ به ایمیل خودت مراجعه کن و لینک ثبت نام را تایید کن!!!')</script>"; }
در این کدها ابتدا ip این کاربر را به دست می آوریم. سپس با استفاده از همین ip در جدول داده ایی cart به دنبال خریدهای کاربر می گردیم تا تعداد خرید های این مشتری را بشماریم (باز هم از تابع mysqli_num_rows()
برای اینکار استفاده می کنیم) و سپس این تعداد خرید را در متغییر $check_cart
ذخیره می کنیم.
حالا در دستور شرطی if($check_cart==0)
اگر تعداد خریدهای مشتری صفر باشد (یعنی کاربر از سایت هیچ محصولی نخریده باشد)؛ او را به حساب کاربری اش هدایت می کنیم (که همان فایل my_account.php
خواهد شد و انشاالله در قسمت های بعدی آن را با هم خواهیم ساخت). در غیر اینصورت (یعنی مشتری از سایت خریدی انجام داده است.) کاربر را به درگاه پرداخت زرین پال هدایت خواهیم کرد. (دقت کنید که ابتدا به فابل checkout.php و از آنجا به فایل payment.php و در نهایت به صفحه پرداخت زرین پال خواهد رفت.)
در ادامه به کدهای زیر می رسیم.
}else{ echo "<script>alert('$customer_login_name $customer_login_lastname چرا ایمیل خودت را تایید نکرده ایی؟ به ایمیل خودت مراجعه کن و لینک ثبت نام را تایید کن!!!')</script>"; }
زمانی این کدها اجرا می شوند که دستور شرطی if($customer_confirmed==1)
برقرار نباشد ( یعنی کاربر لینک تایید ایمیل خودش را تایید نکرده است). در این حالت یک پیام تذکر تحت عنوان " $customer_login_name $customer_login_lastname چرا ایمیل خودت را تایید نکرده ایی؟ به ایمیل خودت مراجعه کن و لینک ثبت نام را تایید کن
" برای او به نمایش داده می شود. دقت کنید در این پیام متغییر $customer_login_name
نام کاربر و متغییر $customer_login_lastname
فامیل آن کاربر می باشد.
در ادامه کدها به دو خط زیر می رسیم.
<a class="new_account" href="customer_register.php">جدیدی؟ خب از اینجا ثبت نام کن.</a> <a class="forget_button" href="checkout.php?forgot_pass">پسورد خود را فراموش کرده اید؟</a>
در واقع این دو خط ، دو لینک هستند، که کاربر را صفحاتی که من قبلا در موردشان صحبت کرده ام هدایت می کنند.(دقت کنید در قسمت آینده در مورد حالتی که کاربر رمز خود را فراموش می کند با هم صحبت خواهیم کرد.) که در تصویر زیر آنها را برای شما به نمایش درآورده ام.
حالا بیایید با همدیگر کدهایی را که نوشتیم را در حالت های مختلف تست کنیم.
حالت اول وقتی هست که کاربر هیچ کدام از ورودی ها را پر نکرده و بر روی دکمه "وارد می شوم!" فشار دهد. در اینصورت پیام زیر برای او نمایش داده می شود.
حالت دوم وقتی است که کاربر، ایمیل (یا هر چیزی غیر از ایمیل) وارد کرده باشد ولی پسورد را وارد نکرده باشد. در اینصورت پیام زیر برای او به نمایش داده می شود.
حالت سوم وقتی است که کاربر، ایمیل و پسورد را وارد کرده باشد؛ ولی ایمیل وارد شده، از لحاظ استاندارد، یک ایمیل نباشد. در اینصورت پیام زیر برای او نمایش داده می می شود.
حالت چهارم وقتی است که کاربر، ایمی و پسورد را وارد کرده باشد؛ ولی پسورد وارد شده، از لحاظ استاندارد سایت، یک پسورد معتبر نباشد سپس بر روی دکمه "وارد می شوم!" فشار دهد. در اینصورت پیام زیر برای او نمایش داده می شود
حالت پنجم وقتی است که کاربر، ایمیل و پسورد را وارد کرده باشد؛ و هر دو نیز استاندارد های لازم را رعایت کرده باشند اما قبلا در سایت ثبت نام کرده باشد. در اینصورت پیام زیر برای او نمایش داده می شود.
حالت ششم وقتی است که کاربر، ایمیل و پسورد را وارد کرده باشد؛ و هر دو نیز استانداردهای لازم را داشته باشند و از طرفی کاربر قبلا در سایت نیز ثبت نام کرده است اما لینک تاییدی که برای ایمیل او ارسال شده است را تایید نکرده است و حالا بر روی دکمه "وارد می شوم!" فشار می دهد. در اینصورت پیام زیر برای او نمایش داده می شود.
حالت هفتم وقتی است که کاربر، ایمیل و پسورد را وارد کرده باشد؛ و هر دو نیز استاندارد های لازم را رعایت کرده باشند و از طرفی کاربر قبلا در سایت نیز ثبت نام کرده است و لینک تاییدی که برای ایمیل او ارسال شده است را نیز تایید کرده است و حالا بر روی دکمه "وارد می شوم!" فشار می دهد. در اینصورت پیام زیر برای او نمایش داده می شود. (دقت کنید که جهانگیر پچکم محصولی را خریداری نکرده است، بنابراین به صفحه پروفایل خودش می رود.)
خوب دوستان گلم به انتهای این قسمت آموزشی رسیدیم. در قسمت آینده در مورد حالتی که در آن، کاربر رمز عبور خودش رو فراموش می کند با هم صحبت خواهیم کرد. تا قسمت آینده شما رو به خداوند بزرگ و بخشنده می سپارم. موفق باشید.
در این قسمت، به پرسشهای تخصصی شما دربارهی محتوای مقاله پاسخ داده نمیشود. سوالات خود را اینجا بپرسید.
در این قسمت، به پرسشهای تخصصی شما دربارهی محتوای مقاله پاسخ داده نمیشود. سوالات خود را اینجا بپرسید.
در این قسمت، به پرسشهای تخصصی شما دربارهی محتوای مقاله پاسخ داده نمیشود. سوالات خود را اینجا بپرسید.
در این قسمت، به پرسشهای تخصصی شما دربارهی محتوای مقاله پاسخ داده نمیشود. سوالات خود را اینجا بپرسید.
در این قسمت، به پرسشهای تخصصی شما دربارهی محتوای مقاله پاسخ داده نمیشود. سوالات خود را اینجا بپرسید.
در این قسمت، به پرسشهای تخصصی شما دربارهی محتوای مقاله پاسخ داده نمیشود. سوالات خود را اینجا بپرسید.
در این قسمت، به پرسشهای تخصصی شما دربارهی محتوای مقاله پاسخ داده نمیشود. سوالات خود را اینجا بپرسید.
در این قسمت، به پرسشهای تخصصی شما دربارهی محتوای مقاله پاسخ داده نمیشود. سوالات خود را اینجا بپرسید.
در این قسمت، به پرسشهای تخصصی شما دربارهی محتوای مقاله پاسخ داده نمیشود. سوالات خود را اینجا بپرسید.