آمورش PHP: جلسه بیست و پنجم: پروژه ساخت فرم ورود کاربر و صفحه‌ کاربری

حميد شریفی

تعداد کل دانلود ها : 661413

تعداد کل مطالب : 1289

آمورش PHP: جلسه بیست و پنجم: پروژه ساخت فرم ورود کاربر و صفحه‌ کاربری

تعداد دانلود:

تعداد بازدید:

1617

تاریخ:

۱۳۹۵-۱۱-۰۳

دسته بندی:

آموزش PHP

هشتگ ها :

0تومان

افزودن به سبد و خرید

در ادامه‌ی مباحث آموزش برنامه‌نویسی به زبان پی‌اچ‌پی در ملت وب، قصد داریم در این جلسه و نیز چند جلسه‌ی آینده مثال‌هایی عملی از روش‌های ساختن اسکریپت‌های کاربردی تحت وب را به شما آموزش دهیم. در این قسمت می‌خواهیم روش ساخت سیستم ورود کاربران عضو شده را آموزش دهیم. در ادامه‌ با ملت وب همراه باشید.

اگر خاطرتان باشد در جلسات قبل در مورد Session ها صحبت کردیم. سشن‌ها در واقع متغیرهایی هستند که به منظور نگه‌داری اطلاعات شخصی کاربران بر روی سرورهای وب به کار گرفته می‌شوند چراکه در صورتی که از این ویژگی استفاده نشود، وب‌سرور نمی‌تواند تشخیص دهد که کدام کاربر به سمت سرور درخواست ارسال کرده است.

در این جلسه‌ی آموزشی قصد دارید تا با استفاده از Session ها در پی‌اچ‌پی، یک سیستم‌ کاربری ساده که شامل فرم ورود کاربران عضو است را بر اساس درخواست‌های کاربر ایجاد کنیم.

به منظور شروع یک سشن باید از کد زیر استفاده کنیم:

<?php
session_start();
// Do Something
?>

برای ذخیره‌ی مقادیر دلخواه در سشن‌ها می‌توانیم از کدی مثل زیر بهره ببریم:

<?php
session_start();
// Store Session Data
$_SESSION['login_user']= $username;  // Initializing Session with value of PHP Variable

برای خواندن اطلاعات ذخیره شده در سشن‌ها نیز باید از کدی مثل کد زیر استفاده کرد:

<?php
session_start();
// Store Session Data
$_SESSION['login_user']= $username;  // Initializing Session with value of PHP Variable
echo $_SESSION['login_user'];

برای خالی کردن اطلاعات ذخیره شده در یک سشن نیز می‌توان از کد زیر استفاده کرد:

<?php
session_destroy(); // Is Used To Destroy All Sessions
//Or
if(isset($_SESSION['id']))
unset($_SESSION['id']);  //Is Used To Destroy Specified Session

در مثالی که ما آورده‌ایم، یک فرم ورود خواهیم داشت که کاربر باید فیلد‌های آن را پر کرده و سپس روی دکمه‌ی ورود کلیک کند. سپس یک سشن ایجاد شده که در صورتی که کاربر اطلاعات ورود را به درستی وارد کرده باشد، داده‌هایی در این سشن ذخیره شده و به وی اجازه مشاهده صفحه‌ی مخصوص کاربران عضو داده می‌شود.

مثل همیشه پیش از شروع کار، برنامه‌ی Xampp را اجرا کرده و سپس در پوشه‌ی htdocs یک پوشه‌ی دلخواه برای این پروژه بسازید. در ادامه کد کامل فایل‌های مورد نیاز را مشاهده می‌کنید و توضیح در مورد این کدها نیز در ادامه آورده شده است. شما باید تک تک فایل‌هایی که در ادامه آورده شده را ساخته در این فایل‌ها کدهای مربوط را بنویسید.

فایل index.php

کد این فایل در واقع بیشتر HTML است و شامل یک فرم برای ورود اطلاعات کاربر است. این فرم دارای دو فیلد با نام username و password و یک دکمه به نام submit است. فیلد اول برای نام کاربری و فیلد دوم برای رمز عبور است. در ادامه کد این فایل را مشاهده می‌کنید.

<?php
include('login.php'); // Includes Login Script

if(isset($_SESSION['login_user'])){
header("location: profile.php");
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Login Form in PHP with Session</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="main">
<h1>PHP Login - Mellatweb</h1>
<div id="login">
<h2>Login Form</h2>
<form action="" method="post">
<label>UserName :</label>
<input id="name" name="username" placeholder="username" type="text">
<label>Password :</label>
<input id="password" name="password" placeholder="**********" type="password">
<input name="submit" type="submit" value=" Login ">
<span><?php echo $error; ?></span>
</form>
</div>
</div>
</body>
</html>

همانطور که در کد بالا مشاهده می‌کنید ابتدا با دستور include فایل login.php که در مرحله‌ی بعد آن را می‌سازیم به صفحه‌ی index.php اضافه شده است. سپس با دستور شرطی if بررسی می‌کنیم که آیا سشنی به نام login_user قبلا ست شده یا خیر. اگر مقدار این سشن خالی نباشد با دستور header، کاربر را به صفحه‌ای به نام profile.php منتقل می‌کنیم. در غیر این صورت کد اچ‌تی‌ام‌ال که در ادامه‌ی فایل نوشته شده اجرا خواهد شد و فرم ورود به کاربر نمایش داده می‌شود. دقت کنید که خاصیت action این فرم login.php است و این یعنی اطلاعات فرم یاد شده به فایلی به نام login.php ارسال خواهند شد.

در کد بالا خط echo $error باعث می‌شود تا مقدار متغیر error$ که در فایل login.php مقدار دهی می‌شود چاپ شود.

فایل login.php

این فایل شامل اسکریپت‌های پی‌اچ‌پی لازم برای بررسی ورود کاربر است. کد این فایل نیز به صورت زیر خواهد بود.

<?php
session_start(); // Starting Session
$error=''; // Variable To Store Error Message
if (isset($_POST['submit'])) {
if (empty($_POST['username']) || empty($_POST['password'])) {
$error = "Username or Password is invalid";
}
else
{
// Define $username and $password
$username=$_POST['username'];
$password=$_POST['password'];
// Establishing Connection with Server by passing server_name, user_id and password as a parameter
$connection = mysql_connect("localhost", "root", "");
// To protect MySQL injection for Security purpose
$username = stripslashes($username);
$password = stripslashes($password);
$username = mysql_real_escape_string($username);
$password = mysql_real_escape_string($password);
// Selecting Database
$db = mysql_select_db("company", $connection);
// SQL query to fetch information of registerd users and finds user match.
$query = mysql_query("select * from login where password='$password' AND username='$username'", $connection);
$rows = mysql_num_rows($query);
if ($rows == 1) {
$_SESSION['login_user']=$username; // Initializing Session
header("location: profile.php"); // Redirecting To Other Page
} else {
$error = "Username or Password is invalid";
}
mysql_close($connection); // Closing Connection
}
}
?>

در این فایل نیز ابتدا با دستور session_start سشن را آغاز می‌کنیم تا بتوانیم از آن در این فایل استفاده کنیم. دقت کنید که در هر فایلی که قصد کار کردن با سشن‌ها را داشته باشید ترجیحا در خطوط اولیه صفحه باید این دستور را بنویسیم.

سپس در این فایل یک متغیر به نام error$ ایجاد کرده‌ایم و مقدار آن را خالی گذاشته‌ایم. این متغیر برای نگه‌داری خطاهای احتمالی که طی فرایند ورود کاربر ایجاد می‌شوند مورد استفاده واقع می‌شوند.

در خط بعدی با استفاده از دستور isset همانطور که در بخش فرم‌ها به شما آموزش داده بودیم بررسی می‌کنیم که آیا کاربر اطلاعات مورد نیاز را وارد کرده یا خیر. اگر فیلد‌های نام کاربری و رمزعبور خالی باشند، مقدار متغیر error برابر با Username or Password is invalid خواهد شد. در غیر این صورت ادامه‌ی کد یعنی کدهای بعد از else اجرا خواهند شد. حال اگر کاربر نام کاربری و رمزعبور را وارد کرده باشد، مقادیر وارد شده توسط وی در دو متغیر به نام username و password ذخیره می‌شوند.

در مرحله‌ی بعد به بانک اطلاعاتی‌ که اطلاعات کاربران در آن ذخیره شده (در ادامه کد ساختن این بانک اطلاعاتی نیز آورده شده است) متصل شده‌ایم. سپس نام کاربری و رمزعبور دریافتی را با استفاده از توابع stripslashes و mysql_real_escape_string، داده‌های ورودی کاربر را از نظر امنیتی، به داده‌هایی امن مبدل می‌کنیم. در جلسات آینده در این مورد به صورت مفصل‌تر صحبت می‌کنیم. نام بانک اطلاعاتی ما در اینجا company است و همانطور که پیش‌تر در جلسات آموزش اتصال به MySQL گفته بودیم این جدول را انتخاب می‌کنیم.

در مرحله‌ی بعد درست همانند روش گرفتن اطلاعات، با یک کوئری (mysql_query) در بانک‌ اطلاعاتی یاد شده و در جدولی به نام login به دنبال رکوردی می‌گردیم که فیلد username و password آن دقیقا برابر با نام کاربری و رمزعبور وارد شده توسط کاربر باشد. نتیجه‌ی اجرای این کوئری در متغیری به نام query$ ذخیره شده و سپس با استفاده از تابع mysql_num_rows تعداد رکورد‌هایی که توسط کوئری یاد شده بدست آمده را در متغیر دیگری به نام rows$ ذخیره کرده‌ایم. در اینجا اگر رکوردی به مشخصات وارد شده‌ی کاربر در جدول یاد شده وجود داشته باشد، مقدار متغیر rows$ بیشتر از صفر خواهد شد.

حال با دستور شرطی if بررسی می‌کنیم که اگر مقدار rows$ برابر با عدد یک بود (یعنی چنین کاربری با این مشخصات وجود دارد) سشن login_user را با نام کاربری کاربر مقداردهی می‌کنیم. سپس کاربر را به صفحه‌ی profile.php منتقل می‌کنیم. همچنین اگر مقدار متغیر rows$ برابر با ۱ نباشد، یعنی اطلاعات وارد شده توسط کاربر در بانک اطلاعاتی موجود نبوده و بنابراین کاربر اجازه ورود نخواهد داشت و در این شرایط پیغام Username or Password is invalid را در متغیر error$ ذخیره می‌کنیم. در نهایت نیز ارتباط با بانک اطلاعات را با دستور mysql_close خاتمه می‌دهیم تا از ایجاد فشار بیشتر روی سرور جلوگیری شود و در واقع منابع سرور بیهوده هدر نرود.

فایل profile.php

این صفحه در واقع صفحه‌ی پروفایل کاربر محسوب می‌شود که در صورت درست وارد کردن اطلاعات کاربری، افراد به این صفحه منتقل خواهند شد. در اصل باید گفت مجوز دسترسی و مشاهده این صفحه فقط برای کاربرانی که اهراز هویت شده‌اند وجود خواهد داشت.

کد این فایل نیز به صورت زیر است:

<?php
include('session.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>Your Home Page</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="profile">
<b id="welcome">Welcome : <i><?php echo $login_session; ?></i></b>
<b id="logout"><a href="logout.php">Log Out</a></b>
</div>
</body>
</html>

همانطور که می‌بینید در این صفحه نیز ابتدا فایلی به نام session.php که در مرحله‌ی بعد آن را می‌سازیم با دستور include، به فایل profile,.php اضافه شده است. این صفحه پروفایل کاربر بوده و بیشتر کد آن html است. همچنین در این صفحه مقدار سشن login_session که نام کاربری کاربر را در خود دارد چاپ شده است. همچنین یک لینک به صفحه‌ی logout.php در این صفحه وجود دارد که به منظور خروج از صفحه‌ی کاربری است.

فایل session.php

در این صفحه، اطلاعات مخصوص به هر کاربری که به درستی لاگین کرده باشد، تنظیم می‌شود.

کد این صفحه‌ نیز به صورت زیر است.

<?php
// Establishing Connection with Server by passing server_name, user_id and password as a parameter
$connection = mysql_connect("localhost", "root", "");
// Selecting Database
$db = mysql_select_db("company", $connection);
session_start();// Starting Session
// Storing Session
$user_check=$_SESSION['login_user'];
// SQL Query To Fetch Complete Information Of User
$ses_sql=mysql_query("select username from login where username='$user_check'", $connection);
$row = mysql_fetch_assoc($ses_sql);
$login_session =$row['username'];
if(!isset($login_session)){
mysql_close($connection); // Closing Connection
header('Location: index.php'); // Redirecting To Home Page
}
?>

در این صفحه، ابتدا به بانک اطلاعاتی متصل می‌شویم و سپس جدول مورد نظرمان که در اینجا company نام دارد را انتخاب می‌کنیم. سپس با دستور session_start به پی‌اچ‌پی اعلام می‌کنیم که در این صفحه قصد استفاده از سشن‌ها را داریم. سپس مقدار سشن login_user را در متغیری به نام user_check$ ذخیره می‌کنیم. حال با یک کوئری بررسی می‌کنیم که آیا کاربری با نام کاربری ذخیره شده در سشن یاد شده در جدول login بانک اطلاعاتی ما وجود دارد یا خیر. با دستور mysql_fetch_assoc مقدار بازگشتی کوئری را در متغیری به صورت آرایه در ses$ قرار می‌دهیم. حال همانطور که در بخش آرایه‌ها یاد گرفتید، عضوی از آرایه که نام آن username است را در متغیری به نام login_session قرار می‌دهیم.

در نهایت با دستور شرطی if بررسی می‌کنیم که آیا مقداری در login_session تظیم شده یا نه. اگر این مقدار خالی باشد کاربر به صفحه‌ی index.php منتقل خواهد شد. این کار باعث می‌شود تا در شرایطی که افراد قصد دسترسی مستقیم به صفحه‌ی profile.php را دارند، نتوانند بدون اهراز هویت آن را مشاهده کنند.

فایل logout.php

برای از بین بردن سشن‌ها باید از کدی همانند زیر استفاده کنیم. هنگامی که کاربر بخواهد از حساب کاربری خود خارج شود باید سشن ایجاد شده‌ی مخصوص وی را از بین برده و او را به صفحه‌ی اصلی منتقل کنیم.

<?php
session_start();
if(session_destroy()) // Destroying All Sessions
{
header("Location: index.php"); // Redirecting To Home Page
}
?>

همانطور که گفتیم از آنجا که قصد داریم در این صفحه نیز از سشن‌ها استفاده کنیم باید ابتدا با دستور session_start این موضوع را به پی‌اچ‌پی اعلام کنیم زیرا در غیر این صورت اجرای این کد با خطای پی‌اچ‌پی مواجه خواهد شد.

و اما کد ساخت جدول در بانک اطلاعاتی MySQL نیز به شکل زیر است. شما باید یک بانک اطلاعاتی جدید در phpmyadmin ایجاد کنید. اگر این مورد را نمی‌دانید ابتدا به جلسات آموزش اتصال به بانک داده‌ MySQL در ملت وب مراجعه کنید. سپس کد زیر را در بخش Query جدول وارد کنید تا ساختار مورد نظر و جداول و فیلد‌ها و نیز اطلاعات اولیه به صورت خودکار ایجاد شوند.

CREATE DATABASE company;
CREATE TABLE login(
id int(10) NOT NULL AUTO_INCREMENT,
username varchar(255) NOT NULL,
password varchar(255) NOT NULL,
PRIMARY KEY (id)
)

فایل style.css

این فایل برای ایجاد نمایی زیباتر در کنار کدهای اچ‌تی‌ام‌ال است که در کدهای مربوطه در بالا آن را به صفحاتی که اچ‌تی‌ام‌ال دارند اضافه کرده‌ایم تا ظاهر پروژه نیز بهتر و کاربرپسند‌تر شوند. این فایل را نیز ایجاد کرده و کد زیر را در آن قرار دهید.

@import http://fonts.googleapis.com/css?family=Raleway;
/*----------------------------------------------
CSS Settings For HTML Div ExactCenter
------------------------------------------------*/
#main {
width:960px;
margin:50px auto;
font-family:raleway
}
span {
color:red
}
h2 {
background-color:#FEFFED;
text-align:center;
border-radius:10px 10px 0 0;
margin:-10px -40px;
padding:15px
}
hr {
border:0;
border-bottom:1px solid #ccc;
margin:10px -40px;
margin-bottom:30px
}
#login {
width:300px;
float:left;
border-radius:10px;
font-family:raleway;
border:2px solid #ccc;
padding:10px 40px 25px;
margin-top:70px
}
input[type=text],input[type=password] {
width:99.5%;
padding:10px;
margin-top:8px;
border:1px solid #ccc;
padding-left:5px;
font-size:16px;
font-family:raleway
}
input[type=submit] {
width:100%;
background-color:#FFBC00;
color:#fff;
border:2px solid #FFCB00;
padding:10px;
font-size:20px;
cursor:pointer;
border-radius:5px;
margin-bottom:15px
}
#profile {
padding:50px;
border:1px dashed grey;
font-size:20px;
background-color:#DCE6F7
}
#logout {
float:right;
padding:5px;
border:dashed 1px gray
}
a {
text-decoration:none;
color:#6495ed
}
i {
color:#6495ed
}
 نتیجه:

ایجاد فرم‌های ورود و خروج کاربر و نیز سیستم‌ ثبت نام و ... با استفاده از سشن‌ها در پی‌اچ‌پی بسیار آسان است. پیشنهاد می‌کنیم در صورتی که مطالب ارائه شده در این جلسه را به طور کامل درک نکرده‌اید خودتان مرحله به مرحله در ضمن خواندن، کدها را نوشته و نتیجه را تست کنید. به یاد داشته باشید که در صورتی مفاهیم برنامه‌نویسی را به خوبی فرا خواهید گرفت که به صورت عملی تمرین‌های آن را انجام دهید. در پی‌اچ‌پی سه مورد برای یادگیری مفاهیم ضروری است و این سه مورد تمرین و تمرین و تمرین هستند.