Chương 6-Bài 3. Thực hiện Trang Đăng nhập Login

Step 1: bắt đầu sử dụng session

• Hiệu chỉnh file bootstrap.php

<?php
// Load các thư viện (packages) do Composer quản lý vào chương trình
require_once __DIR__.'/vendor/autoload.php';

// Chỉ định thư mục `templates` (nơi Twig sẽ biên dịch cú pháp Twig thành các đoạn code PHP)
$loader = new Twig_Loader_Filesystem(__DIR__.'/templates');

// Khởi tạo Twig
$twig = new Twig_Environment($loader);

// Bắt đầu sử dụng session
session_start();

// Tạo biến global để có thể sử dụng trong tất cả các view được render bởi TWIG
$twig->addGlobal('session', $_SESSION);

Step 2: tạo file xử lý Login

• Tạo file frontend/auth/login.php

<?php
// Include file cấu hình ban đầu của `Twig`
require_once __DIR__ . '/../../bootstrap.php';

// Truy vấn database
// 1. Include file cấu hình kết nối đến database, khởi tạo kết nối $conn
include_once(__DIR__ . '/../../dbconnect.php');

// Đã đăng nhập rồi -> điều hướng về trang chủ
if(isset($_SESSION['email_logged']) && !empty($_SESSION['email_logged'])) {
    echo 'Bạn đã đăng nhập rồi. <a href="/project-nentang/frontend/">Bấm vào đây để quay về trang chủ.</a>';
}
else {
    if(isset($_POST['btnLogin'])) {
        // Kiểm tra đăng nhập...
        $email = $_POST['email'];
        $password = $_POST['password'];

        // Câu lệnh SELECT
        $sqlSelect = <<<EOT
        SELECT *
        FROM khachhang kh
        WHERE kh.kh_email = '$email' AND kh.kh_matkhau = '$password';
EOT;

        // Thực thi SELECT
        $result = mysqli_query($conn, $sqlSelect);

        // Sử dụng hàm `mysqli_num_rows()` để đếm số dòng SELECT được
        // Nếu có bất kỳ dòng dữ liệu nào SELECT được <-> Người dùng có tồn tại và đã đúng thông tin USERNAME, PASSWORD
        if (mysqli_num_rows($result) > 0) {
            echo 'Đăng nhập thành công!';
            // redirect đi đâu đó...
            
            // Lưu thông tin Email user đã đăng nhập
            $_SESSION['email_logged'] = $email;

        } else {
            echo 'Đăng nhập thất bại!';
        }
    } else {
        echo $twig->render('frontend/auth/login.html.twig');
    }
}
?>

Step 3: tạo file giao diện Template Login

• Tạo file templates/frontend/auth/login.html.twig

{# Kế thừa layout frontend #}
{% extends "frontend/layouts/layout.html.twig" %}

{# Nội dung trong block title #}
{% block title %}
Đăng nhập
{% endblock %}
{# End Nội dung trong block title #}

{# Nội dung trong block headline #}
{% block headline %}
Đăng nhập
{% endblock %}
{# End Nội dung trong block headline #}

{# Nội dung trong block content #}
{% block content %}

<form name="frmLogin" id="frmLogin" method="post" action="/frontend/auth/login.php">
    <div class="container mt-4">
        {% if errors %}
        <div id="errors-container" class="alert alert-danger face" role="alert">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
            <ul>
                {% for fields in errors %}
                    {% for field in fields %}
                    <li>{{ field.msg | raw }}</li>
                    {% endfor %}
                {% endfor %}
            </ul>
        </div>
        {% endif %}

        <div class="row justify-content-center">
            <div class="col-md-8">
                <div class="card-group">
                    <div class="card p-4">
                        <div class="card-body">
                            <h1>Đăng nhập</h1>
                            <p class="text-muted">Nhập thông tin Tài khoản</p>
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text">
                                        <i class="icon-user"></i>
                                    </span>
                                </div>
                                <input class="form-control" type="email" name="email" placeholder="Tên đăng nhập">
                            </div>
                            <div class="input-group mb-4">
                                <div class="input-group-prepend">
                                    <span class="input-group-text">
                                        <i class="icon-lock"></i>
                                    </span>
                                </div>
                                <input class="form-control" type="password" name="password" placeholder="Mật khẩu">
                            </div>
                            <div class="row">
                                <div class="col-6">
                                    <button class="btn btn-primary px-4" name="btnLogin">Đăng nhập</button>
                                </div>
                                <div class="col-6 text-right">
                                    <a class="btn btn-link px-0" href="/frontend/auth/forgot-password.php">Quên mật khẩu?</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card text-white bg-primary py-5 d-md-down-none" style="width:44%">
                        <div class="card-body text-center">
                            <div>
                                <h2>Đăng ký</h2>
                                <p>Đăng ký để làm thành viên của Trang web bán hàng. Bạn sẽ được một số quyền lợi nhất
                                    định khi làm thành viên của Chúng tôi.</p>
                                <a class="btn btn-primary active mt-3" href="/frontend/pages/register.php">Đăng
                                    ký ngay!</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
{% endblock %}
{# End Nội dung trong block content #}