Tạo Form đăng nhập bằng PHP & MySQL

Trong bài trước bạn đã được hướng dẫn tạo Form đăng ký bằng PHP chỉ với 2 file đơn giản. Ngày hôm nay bạn sẽ biết cách tạo Form đăng nhập bằng PHP & MySQL cũng 3 file cực kỳ dễ hiểu.

Trước khi thực hiện cần đảm bảo rằng đã khởi động XAMPP khởi động Apache và MySQL đã nhé!

Hướng dẫn tạo Form đăng nhập sử dụng PHP và MySQL

Bạn cần tạo một thư mục là dangnhap trong htdocs để chứa 4 file tên là login.php, xuly.phpconnect.php, session.php

Bước 1: Copy đoạn code login php sau cho vào file login.php

<!DOCTYPE html> 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<form action='login.php' class="dangnhap" method='POST'>
Tên đăng nhập : <input type='text' name='username' />
Mật khẩu : <input type='password' name='password' />
<input type='submit' class="button" name="dangnhap" value='Đăng nhập' />
<a href='dangky.php' title='Đăng ký'>Đăng ký</a>
<?php require 'xuly.php';?>
<form>
</body>
</html>

Bước 2: Tạo file xuly.php để kiểm tra

<?php
//Khai báo sử dụng session
session_start();
//Khai báo utf-8 để hiển thị được tiếng việt
header('Content-Type: text/html; charset=UTF-8');
//Xử lý đăng nhập
if (isset($_POST['dangnhap']))
{
//Kết nối tới database
include('connect.php');
  
//Lấy dữ liệu nhập vào
$username = addslashes($_POST['username']);
$password = addslashes($_POST['password']);
  
//Kiểm tra đã nhập đủ tên đăng nhập với mật khẩu chưa
if (!$username || !$password) {
echo "Vui lòng nhập đầy đủ tên đăng nhập và mật khẩu. <a href='javascript: history.go(-1)'>Trở lại</a>";
exit;
}
  
// mã hóa pasword
$password = md5($password);
  
//Kiểm tra tên đăng nhập có tồn tại không
$query = mysql_query("SELECT username, password FROM member WHERE username='$username'");
if (mysql_num_rows($query) == 0) {
echo "Tên đăng nhập này không tồn tại. Vui lòng kiểm tra lại. <a href='javascript: history.go(-1)'>Trở lại</a>";
exit;
}
  
//Lấy mật khẩu trong database ra
$row = mysql_fetch_array($query);
  
//So sánh 2 mật khẩu có trùng khớp hay không
if ($password != $row['password']) {
echo "Mật khẩu không đúng. Vui lòng nhập lại. <a href='javascript: history.go(-1)'>Trở lại</a>";
exit;
}
  
//Lưu tên đăng nhập
$_SESSION['username'] = $username;
echo "Xin chào <b>" .$username . "</b>. Bạn đã đăng nhập thành công. <a href=''>Thoát</a>";
die();
}
?>

Bước 3: Tạo file connect.php để kết nối tới cơ sở dữ liệu Database

<?php 
$ketnoi['host'] = 'localhost';
$ketnoi['dbname'] = 'data'; // Tên database
$ketnoi['username'] = 'root'; // Tên user mặc định là root
$ketnoi['password'] = ''; // Password để trống
@mysql_connect( "{$ketnoi['host']}", "{$ketnoi['username']}", "{$ketnoi['password']}") or die("Không thể kết nối database"); @mysql_select_db( "{$ketnoi['dbname']}") or die("Không thể chọn database");
?>

Bước 4: Tạo file session.php để thoát phiên đăng nhập

<?php session_start();
if (isset($_SESSION['username'])){
unset($_SESSION['username']); // xóa session login
}
?>

Bước 5: Thêm file CSS tên là style.css

.dangnhap {
width: 600px;
margin: 10px auto;
}
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
  
.button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
  
.button:hover {
opacity: 0.8;
}

Ok xong rồi đấy!

Để chạy bạn sẽ dán link http://localhost/dangnhap/login.php lên trình duyệt.

Bài viết này khá đơn giản nếu bạn muốn Form đăng nhập thành viên đẹp hơn thì có thể chèn thêm CSS vào.

Trên đây là bài hướng dẫn xây dựng chức năng đăng nhập đơn giản nhất là một phần trong kiến thức lập trình PHP giúp tạo dựng một trang web hoàn chỉnh.

Quách Quỳnh

Xin chào bạn mình là Quách Quỳnh! Chủ nhân của blog Quachquynh.com. Tại đây bạn sẽ tìm thấy những kiến thức về Wordpress, Seo và lập trình.

Hãy để lại bình luận:

Địa chỉ email của bạn sẽ không được công bố. Các trường bắt buộc được đánh dấu *