Trong hướng dẫn xác thực Codeigniter này, chúng tôi sẽ chỉ cho bạn cách tạo một hệ thống xác thực đơn giản với các chức năng đăng nhập và đăng ký. Chúng tôi sẽ sử dụng phiên Codeigniter để lưu trạng thái của người dùng được xác thực.
Đăng nhập là quá trình mà người dùng đăng nhập vào ứng dụng của bạn bằng email và mật khẩu đã đăng ký trước đó. Sau khi đăng nhập thành công vào ứng dụng, người dùng có thể truy cập các tài nguyên khác của ứng dụng.
Ngược lại, đăng ký là khi người dùng tự đăng ký bằng các thuộc tính tên, email và mật khẩu.
Ví dụ về hệ thống Codeigniter 4 Auth (Đăng nhập và Đăng ký)
- Bước 1: Tạo dự án Codeigniter
- Bước 2: Hiển thị lỗi
- Bước 3: Tạo bảng vào cơ sở dữ liệu
- Bước 4: Kết nối CI với Cơ sở dữ liệu
- Bước 5: Tạo và cập nhật Mô hình người dùng
- Bước 6: Đăng ký bộ điều khiển Auth
- Bước 7: Tạo chế độ xem xác thực
- Bước 8: Bảo vệ tuyến đường bằng bộ lọc
- Bước 9: Chạy ứng dụng CI
Tạo dự án Codeigniter
Có hai phương pháp để tải xuống ứng dụng codeigniter.
Bạn có thể gọi lệnh để tải xuống ứng dụng Codeigniter, tuy nhiên bạn phải cấu hình Composer trong hệ thống của mình trước.
composer create-project codeigniter4/appstarter
Phương pháp thứ hai thì đơn giản, bạn chỉ cần truy cập trang web Codeigniter tại đây và tải xuống ứng dụng Codeigniter.
Hiển thị lỗi
Bạn có thể bật tính năng hiển thị lỗi bằng cách đi đến app/Config/Boot/production.php và thay đổi giá trị thuộc tính display_errors từ 0 thành 1.
ini_set('display_errors', '1');
Tạo Bảng trong Cơ sở dữ liệu
Mẫu nguyên mẫu chính của bảng xác thực chứa bảng người dùng trong cơ sở dữ liệu với các thuộc tính như tên, email, mật khẩu và created_at. Hãy vào PHPMyAdmin, nhập truy vấn SQL được cung cấp và nhấn enter.
CREATE TABLE users (
id INT PRIMARY KEY AUTO_INCREMENT,
name VARCHAR(150),
email VARCHAR(150),
password VARCHAR(150),
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
) ENGINE=INNODB;
Kết nối CI với cơ sở dữ liệu
Bước hiện tại, mô tả cách bạn có thể kết nối ứng dụng CI với cơ sở dữ liệu, đó là một quá trình vô cùng đơn giản, chỉ cần thêm tên cơ sở dữ liệu, tên người dùng và mật khẩu trong app/Config/Database.php.
public $default = [
'DSN' => '',
'hostname' => 'localhost',
'username' => 'root',
'password' => '',
'database' => 'codeigniter_db',
'DBDriver' => 'MySQLi',
'DBPrefix' => '',
'pConnect' => false,
'DBDebug' => (ENVIRONMENT !== 'development'),
'cacheOn' => false,
'cacheDir' => '',
'charset' => 'utf8',
'DBCollat' => 'utf8_general_ci',
'swapPre' => '',
'encrypt' => false,
'compress' => false,
'strictOn' => false,
'failover' => [],
'port' => 3306,
];
Tạo và Cập nhật User Model
Tiếp theo, tạo một tệp model mới và xác định tên bảng người dùng và các giá trị trong $table và $allowedFields. Tạo tệp UserModel.php trong thư mục app/Models sau đó cập nhật mã được cung cấp trong tệp app/Models/UserModel.php.
namespace App\Models;
use CodeIgniter\Model;
class UserModel extends Model{
protected $table = 'users';
protected $allowedFields = [
'name',
'email',
'password',
'created_at'
];
}
Đăng ký các Controller Auth
Một bộ điều khiển (controller) là một tệp chứa các hàm và phương thức được sử dụng để xử lý logic kinh doanh của ứng dụng. Trong bước này, bạn phải tạo các tệp điều khiển Đăng ký và Đăng nhập.
Tạo tệp SignupController.php trong thư mục app/Controllers, sau đó chèn mã sau vào tệp app/Controllers/SignupController.php.
namespace App\Controllers;
use CodeIgniter\Controller;
use App\Models\UserModel;
class SignupController extends Controller
{
public function index()
{
helper(['form']);
$data = [];
echo view('signup', $data);
}
public function store()
{
helper(['form']);
$rules = [
'name' => 'required|min_length[2]|max_length[50]',
'email' => 'required|min_length[4]|max_length[100]|valid_email|is_unique[users.email]',
'password' => 'required|min_length[4]|max_length[50]',
'confirmpassword' => 'matches[password]'
];
if($this->validate($rules)){
$userModel = new UserModel();
$data = [
'name' => $this->request->getVar('name'),
'email' => $this->request->getVar('email'),
'password' => password_hash($this->request->getVar('password'), PASSWORD_DEFAULT)
];
$userModel->save($data);
return redirect()->to('/signin');
}else{
$data['validation'] = $this->validator;
echo view('signup', $data);
}
}
}
Sau đó, tạo tệp ProfileController.php trong thư mục app/Controllers, và đặt mã được đề xuất vào tệp app/Controllers/ProfileController.php.
namespace App\Controllers;
use CodeIgniter\Controller;
class ProfileController extends Controller
{
public function index()
{
$session = session();
echo "Hello : ".$session->get('name');
}
}
Cuối cùng, tạo tệp SigninController.php trong thư mục app/Controllers, sau đó chèn mã sau vào tệp app/Controllers/SigninController.php.
namespace App\Controllers;
use CodeIgniter\Controller;
use App\Models\UserModel;
class SigninController extends Controller
{
public function index()
{
helper(['form']);
echo view('signin');
}
public function loginAuth()
{
$session = session();
$userModel = new UserModel();
$email = $this->request->getVar('email');
$password = $this->request->getVar('password');
$data = $userModel->where('email', $email)->first();
if($data){
$pass = $data['password'];
$authenticatePassword = password_verify($password, $pass);
if($authenticatePassword){
$ses_data = [
'id' => $data['id'],
'name' => $data['name'],
'email' => $data['email'],
'isLoggedIn' => TRUE
];
$session->set($ses_data);
return redirect()->to('/profile');
}else{
$session->setFlashdata('msg', 'Password is incorrect.');
return redirect()->to('/signin');
}
}else{
$session->setFlashdata('msg', 'Email does not exist.');
return redirect()->to('/signin');
}
}
}
Tạo templates auth
Đến nay, chúng ta đã làm theo mọi hướng dẫn để phát triển ví dụ hệ thống xác thực Codeigniter này, và bây giờ chúng ta phải định nghĩa các tệp xem (view files).
Hãy đảm bảo rằng bạn vào trong thư mục app/Views và tạo các tệp signin.php và signup.php; các tệp này sẽ được sử dụng cho đăng nhập và đăng ký người dùng trong Codeigniter.
Tạo biểu mẫu đăng ký người dùng bằng Bootstrap 5 và kết nối với phương thức để xử lý đăng ký người dùng, mở và đặt mã trong tệp app/View/signup.php.
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
<title>Codeigniter Auth User Registration Exampletitle>
head>
<body>
<div class="container mt-5">
<div class="row justify-content-md-center">
<div class="col-5">
<h2>Register Userh2>
if(isset($validation)):?>
<div class="alert alert-warning">
$validation->listErrors() ?>
div>
endif;?>
<form action=" echo base_url(); ?>/SignupController/store" method="post">
<div class="form-group mb-3">
<input type="text" name="name" placeholder="Name" value=" set_value('name') ?>" class="form-control" >
div>
<div class="form-group mb-3">
<input type="email" name="email" placeholder="Email" value=" set_value('email') ?>" class="form-control" >
div>
<div class="form-group mb-3">
<input type="password" name="password" placeholder="Password" class="form-control" >
div>
<div class="form-group mb-3">
<input type="password" name="confirmpassword" placeholder="Confirm Password" class="form-control" >
div>
<div class="d-grid">
<button type="submit" class="btn btn-dark">Signupbutton>
div>
form>
div>
div>
div>
body>
html>
Tiếp theo, cải thiện tính thẩm mỹ của mẫu xem đăng nhập, do đó Mở và đặt mã vào tệp app/View/signin.php.
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
<title>Codeigniter Login with Email/Password Exampletitle>
head>
<body>
<div class="container">
<div class="row justify-content-md-center">
<div class="col-5">
<h2>Login inh2>
if(session()->getFlashdata('msg')):?>
<div class="alert alert-warning">
session()->getFlashdata('msg') ?>
div>
endif;?>
<form action=" echo base_url(); ?>/SigninController/loginAuth" method="post">
<div class="form-group mb-3">
<input type="email" name="email" placeholder="Email" value=" set_value('email') ?>" class="form-control" >
div>
<div class="form-group mb-3">
<input type="password" name="password" placeholder="Password" class="form-control" >
div>
<div class="d-grid">
<button type="submit" class="btn btn-success">Signinbutton>
div>
form>
div>
div>
div>
body>
html>
Cài đặt và bảo vệ Routes bằng Filters
Trong bước tiếp theo, hãy truy cập vào tệp app/Config/Filters.php, tìm mảng $aliases và thay toàn bộ mảng đó bằng mã được đề xuất. Mã này sẽ giúp bạn đăng ký bộ lọc và bảo vệ các tuyến đường của ứng dụng.
/**
* Configures aliases for Filter classes to
* make reading things nicer and simpler.
*
*/
public $aliases = [
'csrf' => \CodeIgniter\Filters\CSRF::class,
'toolbar' => \CodeIgniter\Filters\DebugToolbar::class,
'honeypot' => \CodeIgniter\Filters\Honeypot::class,
'authGuard' => \App\Filters\AuthGuard::class,
];
Ở bước tiếp theo, bạn cần tạo một tệp AuthGuard.php trong thư mục Filters của ứng dụng. Tệp này sẽ kiểm tra xem người dùng đã đăng nhập chưa và chuyển hướng đến trang đăng nhập nếu người dùng chưa đăng nhập.
Mở và thêm mã vào tệp app/Filters/AuthGuard.php.
namespace App\Filters;
use CodeIgniter\HTTP\RequestInterface;
use CodeIgniter\HTTP\ResponseInterface;
use CodeIgniter\Filters\FilterInterface;
class AuthGuard implements FilterInterface
{
public function before(RequestInterface $request, $arguments = null)
{
if (!session()->get('isLoggedIn'))
{
return redirect()
->to('/signin');
}
}
public function after(RequestInterface $request, ResponseInterface $response, $arguments = null)
{
}
}
Cuối cùng, tiếp tục đến file routes để tạo các route, chúng ta cần thiết lập các route để thực thi các hàm của controller. Tương tự, bảo vệ route profile, chỉ cho phép người dùng đã xác thực truy cập.
Mở file app/Config/Routes.php và định nghĩa các route được đưa ra dưới đây vào file.
/*
* --------------------------------------------------------------------
* Route Definitions
* --------------------------------------------------------------------
*/
$routes->get('/', 'SignupController::index');
$routes->get('/signup', 'SignupController::index');
$routes->match(['get', 'post'], 'SignupController/store', 'SignupController::store');
$routes->match(['get', 'post'], 'SigninController/loginAuth', 'SigninController::loginAuth');
$routes->get('/signin', 'SigninController::index');
$routes->get('/profile', 'ProfileController::index',['filter' => 'authGuard']);
Bạn phải nhớ một điều, tìm đến đoạn router sau đây ở phía dưới phần "Route Definitions", đảm bảo loại bỏ hoặc comment đi route sau đây; nếu không, trang sai sẽ được tải khi bạn khởi động ứng dụng.
// $routes->get('/', 'Home::index');
Chạy ứng dụng CI
Cuối cùng, bây giờ bạn đã đến phần cuối cùng của hướng dẫn này và chúng tôi khuyên bạn nên sử dụng lệnh đã cho để chạy ứng dụng CI.
php spark serve
Bạn đã sẵn sàng đăng ký Codeigniter, hãy tiếp tục và sử dụng url được cung cấp.
http://localhost:8080/signup
Kết thúc hành trình này, bạn đã đi cùng chúng tôi và đi qua những khía cạnh tinh tế mà có ý nghĩa quan trọng trong việc triển khai hoặc xây dựng hệ thống xác thực (auth system) trong Codeigniter 4.
Chúng ta đã học cách tạo tính năng đăng nhập (login) và đăng ký (signup) trong ứng dụng Codeigniter.
Tuy nhiên, đây chỉ là bước đầu tiên của ví dụ đăng nhập và đăng ký trong Codeigniter; bạn có thể mở rộng và thêm các thành phần khác nếu cần thiết trong ứng dụng Codeigniter.
Bạn có thể tải mã nguồn đầy đủ của bài hướng dẫn này tại @GitHub.
