Tạo Trang Đăng Nhập

Tạo Trang Đăng Nhập

Ở phần này chúng ta sẽ tạo trang đăng nhập sử dụng Form biểu mẫu trong HTML. Trong form này sẽ chứa 2 trường nhập dữ liệu là tên đăng nhập và mật khẩu.

Tạo một file login.php trên thư mục gốc với nội dung như sau:

<html>
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <h3>Trang Đăng Nhập</h3>
        <form method="POST" action="authenticate.php">
            <div>
                <label for="id">ID:</label>
                <input id="id" type="text" name="id" value="">
            </div>

            <div>
                <label for="password">Password:</label>
                <input id="password" type="password" name="password" value="">
            </div>
            <div>
                <input type="submit" value="Đăng nhập">
            </div>
        </form>
    </body>
</html>

Lưu ý: Đối với trang chỉ chứa biểu mẫu như trên thì bạn có thể lưu dưới phần mở rộng .html hoặc .php. Tuy nhiên, nếu phải nhúng mã *PHP* vào trang thì bắt buộc file được lưu phải có phần mở rộng là .php

Ở trên chúng ta sử dụng thẻ <form> để tạo biểu mẫu. Bên trong thẻ mở <form> này, chúng ta có các thuộc tính như method và action.

Thuộc tính method dùng để quy định cách gửi dữ liệu lên trên server. Với phương thức gửi là POST thì chúng ta sẽ có thể ẩn được mật khẩu người dùng và không hiển thị trực tiếp trên địa chỉ trình duyệt. Ngược lại nếu bạn chọn phương thức là GET, các thông tin gửi đi sẽ xuất hiện trên thanh địa chỉ URL của trình duyệt. Ví dụ nếu như bạn chọn phương thức GET sau khi bấm nút gửi thì trên thanh địa chỉ của trình duyệt sẽ hiện kết quả như sau:

http://localhost/authenticate.php?id=admin&password=123456

Thuộc tính action dùng để quy định địa chỉ nào trên server sẽ xử lý dữ liệu gửi tới từ phía client. Ở đây chúng ta sẽ gửi tới địa chỉ file authenticate.php.

Bây giờ nếu bạn mở trình duyệt và truy cập vào địa chỉ http://localhost/hoclaptrinh_org/login.php bạn sẽ thấy kết quả như sau:

Điền thông tin bất kỳ vào 2 ô input chứa thông tin ID và mật khẩu trên và bấm nút gửi. Bạn sẽ thấy trình duyệt sẽ báo lỗi như sau:

Nguyên nhân của lỗi trên là do dữ liệu trong biểu mẫu chúng ta gửi lên server sẽ được chuyển tới file authenticate.php trên server để xử lý. Tuy nhiên, file này chưa được tạo trên server. Phần tiếp theo chúng ta sẽ tạo file authenticate.php để xử lý dữ liệu người dùng gửi lên.

10 bình luận


Đăng bình luận