In this tutorial I will explain on how to create PHP Login page with $_SESSION array, do you know PHP $_SESSION?, well, $_SESSION is one of the best way to store information temporally (because it will remove when you left your website. If you need a permanent storage you may want to store the data in a database.), I will try explain also on creating database which is MySQL and how things work, this is very useful for PHP beginner specially those who want to learn more on PHP and of course this is very helpful for school project and for custom site functionality.
Demo
PHP and MySQL Login Page
Database
Table structure for table ‘users’.
MySQL
1
2
3
4
5
6
7
|
CREATE TABLE IF NOT EXISTS ‘users’ (
’id’ int(11) NOT NULL AUTO_INCREMENT,
’user’ varchar(225) NOT NULL,
’pass’ varchar(225) NOT NULL,
PRIMARY KEY (‘id’)
UNIQUE KEY ‘user’ (‘user’)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;
|
config.php
Database configuration file
PHP
1
2
3
4
5
6
7
8
9
|
<?php
$host=’localhost’;
$user = ‘mysqluser’;
$pass = ‘mysqlpass’;
$db=’database’;
$con = mysql_connect($host, $user, $pass) or die(‘Error Connecting’.mysql_error());
mysql_select_db($db, $con) or die(‘Database not selected ::’. mysql_error());
?>
|
index.php
XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
|
<div class=”container”>
<?php
include_once(‘config.php’);
session_start();
$errs = ”;
if(isset($_POST['task'])) {
$username = mysql_real_escape_string($_POST['username']);
$password = mysql_real_escape_string($_POST['password']);
if( $username == “” || $password == “”) {
$errs = ‘<p>Fields are required.</p>’;
} else {
$sql = “SELECT * FROM users WHERE users=’$username’ AND pass=’$password’ “;
$qry = mysql_query( $sql );
$num_row = mysql_num_rows( $qry );
$r = mysql_fetch_object( $qry );
if( $num_row > 0 ) {
if( $username == $r->user && $password == $r->pass ) {
$_SESSION['username'] = $r->user;
$_SESSION['password'] = $r->pass;
$_SESSION['stats'] = 1;
header(‘Location:success.php’);
}
} else {
$errs = ‘<p>Invalid Username or Password.</p>’;
}
}
}
?>
<form method=”post” action=”index.php”>
<fieldset>
<input type=”hidden” name=”task” value=”login” />
<table border=”0″ cellpadding=”2″ cellspacing=”2″>
<tr>
<td colspan=”2″ class=”heading”>PHP Login Page</td>
</tr>
<tr>
<td colspan=”2″>
<div><?php echo $errs; ?></div>
<div><?php echo (isset($_GET['log']) ? ‘<p>You are now logged out.</p>’ : ”); ?></div>
</td>
</tr>
<tr>
<td><label for=”username”>Username:</label></td>
<td><input type=”text” name=”username” /></td>
</tr>
<tr>
<td><label for=”password”>Password:</label></td>
<td><input type=”password” name=”password” /></td>
</tr>
<tr>
<td><input type=”submit” value=”Log in” /></td>
</tr>
</table>
</fieldset>
</form>
</div>
|
success.php
This contain success message if you access the login page.
PHP
1
2
3
4
5
6
7
8
9
10
|
<?php
session_start();
if(isset($_SESSION['stat']) == 1) :
echo ‘<p>Welcome <strong>’. $_SESSION['username'] .’</strong></p>’;
echo ‘<p><a href=”logout.php”>Logout</a></p>’;
else:
echo ‘<p>This page is protected.</p>’;
header(‘Refresh:2; URL=index.php’);
endif;
?>
|
logout.php
Log out this will destroy SESSION value that store temporally
PHP
1
2
3
4
5
|
<?php
session_start();
session_destroy();
header(‘Location:index.php?log=true’);
?>
|
style.css
To look our Log In page alive we need some touches
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
body{ font: normal 14px Tahoma;}
fieldset, img { border: 0;}
input[type="text"], input[type="password"]{ width: 200px;}
table {
background: #F9F9F9;
border: 1px solid #ccc;
padding: 8px;
}
table tr td label{
font: bold 12px Tahoma;
color: #666666;
}
.heading {
font-weight: bold;
background: #DADADA;
padding: 10px 2px;
}
p.error {
background: #FFEBE8;
border: 1px solid #DD3C10;
font: normal 12px Tahoma;
padding: 8px;
color: #DF2839;
}
p.success {
background: #FFFFE0;
border: 1px solid #E6DB55;
font: normal 12px Tahoma;
padding: 8px;
color: #000;
}
|
NOTE
Happy coding ^_^
0 comments:
Post a Comment