BÀI TIỂU LUẬN Môn học Lập trình Web TMĐT. ĐỀ TÀI Tìm hiểu về module xác thực

Module sẽ giúp người dùng có thể đăng nhập/ đăng ký tài khoản vàowebsite từ đó tối ưu hóa trải nghiệm của người dùng.. Tuy nhiên, việc thiếu vắng cơ sở dữ liệu sẽ khiến cả quá trình

TRƯỜNG CAO ĐẲNG CÔNG NGHỆ BÁCH KHOA HÀ NỘI

KHOA CÔNG NGHỆ THÔNG TIN

BÀI TIỂU LUẬN

Môn học/Mô đun:Lập trình Web TMĐT.

<TÊN ĐỀ TÀI: Tìm hiểu về module xác thực>

TRƯỜNG CAO ĐẲNG

CÔNG NGHỆ BÁCH KHOA HÀ NỘI

KHOA CÔNG NGHỆ THÔNG TIN

CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM

Độc lập – Tự do – Hạnh phúc

ĐỀ TÀI BÀI TIỂU LUẬN Môn học/Mô đun: Lập trình Web TMĐT

Họ và tên: Lộc Quang Sơn.

Mã số sinh viên: 20012030398

Lớp: K20.PR3.03 Ngành: Lập trình

Khoa: Công nghệ thông tin

I Đề tài: Module Xác thực

II Nội dung thực hiện:

1 ………

2 ………

3 ………

4. ………

5. ………

III Ngày giao đề tài: 28/02/2022

IV Ngày hoàn thành: 22/04/2022

Hà Nội, ngày … tháng… năm 20

TRƯỜNG CAO ĐẲNG

CÔNG NGHỆ BÁCH KHOA HÀ NỘI

KHOA ………

CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự do – Hạnh phúc PHIẾU ĐÁNH GIÁ NỘI DUNG BÀI TIỂU LUẬN Môn học/Mô đun: Lập trình web TMĐT 1 Họ và tên sinh viên: Lộc Quang Sơn. MSSV: 20012030398 Ngành: Lập trình. 2 Tên đề tài: Tìm hiểu module xác thực 3 Nhận xét: ………

………

………

………

………

………

………

………

4 Điểm chấm:………

Cán bộ chấm bài

(Ký và ghi rõ họ tên)

TRƯỜNG CAO ĐẲNG CÔNG NGHỆ

BÁCH KHOA HÀ NỘI

KHOA CÔNG NGHỆ THÔNG TIN

CỘNG HÒA XÃ HỘI CHỦ NGHĨA

VIỆT NAM Độc lập – Tự do – Hạnh phúc

DANH SÁCH Tên sinh viên, tên đề tài bài tiểu luận

1 Môn học, mô đun: Tìm hiểu về module xác thực.

1 20012030398 Lộc Quang Sơn K20.PR3.03 Module xác thực2

3

4

5

2 Môn học: Lập trình web TMĐT.

1 20012030398 Lộc Quang Sơn K20.PR3.03 Module xác thực2

NHẬN XÉT

Nhận xét của giảng viên giảng dạy:

GIẢNG VIÊN GIẢNG DẠY

(Ký và ghi rõ họ tên)

LỜI MỞ ĐẦU

Công nghệ thông tin đã ngày càng trở lên phổ biến và hữu dụng trong cuộc sốnghiện nay Đặc biệt đó là ứng dụng phần mềm với nhiều chuơng trình ứng dụng có hiệuquả Trong đó có các chuơng trình quản lý đã giúp con nguời tổ chức xử lý các công việctrở lên đơn giản, nhanh chóng và chính xác hơn

Chính vì vậy trong môn học này, em đã xây dựng một trong những Modul khôngthể thiếu trong quá trình hoàn thiện website Đó là: "Module xác thực (Module đăngký/đăng nhập)" Module sẽ giúp người dùng có thể đăng nhập/ đăng ký tài khoản vàowebsite từ đó tối ưu hóa trải nghiệm của người dùng

Thông qua đợt xây dựng bài tập lớn này em muốn nâng cao sự hiểu biết của mình

về lĩnh vực Công nghệ thông tin nói chung, cũng như khả năng xây dựng chuơng trình và

kỹ thuật lập trình của mình Em rất mong đuợc sự quan tâm, giúp đỡ của các thầy cô Xinchân thành cảm ơn!

MỤC LỤC

LỜI MỞ ĐẦU 6

Chương 1 : KHẢO SÁT HỆ THỐNG 8

I Mô tả về môi trường hoạt động 8

II Khảo sát bài toán 8

III Ưu, nhược điểm của hệ thống cũ 9

1 Ưu điểm 9

2 Nhược điểm 9

IV Yêu cầu của đề tài 9

V Công cụ lập trình 10

1 Giới thiệu về ngôn ngữ PHP 10

2 Lý do nên chọn ngôn ngữ PHP 10

3 MySQL 11

4 Web Server: Apache 11

5 XAMPP 11

Chương 2 : PHÂN TÍCH HỆ THỐNG 13

I Phân tích chức năng hệ thống 13

1 Sơ đồ phân rã chức năng 13

2 Sơ đồ mức khung cảnh 13

3 Sơ đồ mức đỉnh(mức 1) 13

4 Sơ đồ mức dưới đỉnh(mức 2) 14

II Phân tích dữ liệu hệ thống 15

Chương 3 : THIẾT KẾ HỆ THỐNG 16

I Thiết kế cơ sở dữ liệu 16

II Thiết kế giao diện 17

Chương 4 : CÀI ĐẶT VÀ CHẠY THỬ 22

I Cài đặt 22

1 Các công cụ cần cài đặt 22

2 Chạy các thao tác để cài đặt chương trình 22

II Chạy thử 23

KẾT LUẬN 26

TÀI LIỆU THAM KHẢO 27

Chương 1 : KHẢO SÁT HỆ THỐNG

I Mô tả về môi trường hoạt động.

Môi trường để PHP có thể hoạt động cần có 3 thành tố sau:

Phần mềm phiên dịch PHP (PHP Parser): Bản thân hệ điều hành máy tính

(máy tính cá nhân hay máy chủ/server) không thể đọc, hiểu và xử lý các đoạn codePHP Chính vì vậy, cần có một phần mềm để phiên dịch lại Và dĩ nhiên, nhà pháttriển phần mềm này cũng chính là nhà phát triển của loại ngôn ngữ mã nguồn mởnày Các lập trình viên có thể tải về phần mềm phiên dịch PHP trên trang webchính thức www.php.net

Phần mềm cơ sở dữ liệu: Code PHP có thể hoạt động mà không cần đến cơ

sở dữ liệu Tuy nhiên, việc thiếu vắng cơ sở dữ liệu sẽ khiến cả quá trình lập trìnhtrở nên khó khăn, cũng như sản phẩm được tạo ra không có khả năng cập nhật vàlưu trữ dữ liệu mới, chính vì thế, code PHP luôn cần kết nối với một cơ sở dữ liệu.Chính vì thế, bạn sẽ cần một phần mềm để có thể cung cấp các tính năng liên quanđến xây dựng, kết nối và tương tác với cơ sở dữ liệu Ở thời điểm hiện tại, PHP cóthể làm việc tốt với hầu hết các phần mềm quản lý cơ sở dữ liệu nổi tiếng nhưOracle và Sybase, nhưng trên hết vẫn là Mysql - lựa chọn ưu tiên hàng đầu khi sửdụng PHP

Phần mềm Web server: Mặc dù không cần đến Web server, code PHP vẫn

có thể hoạt động trên Terminal (giao diện thao tác bằng lệnh trên các hệ điều hànhLinux) hay Cmd (giao diện thao tác bằng lệnh trên các hệ điều hành Windows).Tuy nhiên nếu chỉ dừng ở đó, code PHP chỉ có thể xử lý các tương tác của ngườilập trình và sản phẩm của nó chẳng thể nào tiếp cận người dùng Chính vì thế,PHP cần một Web Server đóng vai trò là cây cầu kết nối giữa người dùng và PHP.PHP có thể làm việc với các phần mềm web server phổ biến hiện nay như Apache(lựa chọn hàng đầu cho PHP), Nginx, Microsoft's Internet Information Server

II Khảo sát bài toán.

Ngày nay cùng với sự bùng nổ của cuộc cách mạng thông tin toàn cầu, thươngmại điện tử toàn cầu đã có một bước đột phá lớn qua việc áp dụng thương mạiđiện tử làm phương tiện giao dịch và thực hiện nghiệp vụ thương mại Trongthương mại tính phổ dụng, dễ dàng thuận tiện, an toàn và nhanh chóng trong giaodịch là yếu tố quyết định việc thành bại, vì vậy áp dụng thông tin là một yếu tố tấtyếu Trong thời đại ngày nay, nhu cầu lưu trữ và truyền tải thông tin là rất lớn

Khoa học và công nghệ phát triển đã giúp cho mỗi doanh nghiệp, mọi cá nhân

có một công cụ làm việc và học tập vô cùng hiệu quả Internet phát triển đã thâmnhập vào từng ngõ ngách, tầng lớp của xã hội, giúp cho mọi người đều được mởmang kiến thức, cập nhật mọi thông tin một cách nhanh nhất Internet đa giúp chocác công ty và những cửa hàng nhỏ không ít trong việc quảng cáo Với việc ra đờicủa những trang web thì những thông tin đầy đủ nhất của các công ty và các cửahàng sẽ đến được với khách nhiều hơn Và ngày nay, mọi người trên thế giới sửdụng internet cho việc tìm kiếm thông tin, giao dịch mua bán và đặc biệt vấn đềgiải trí cũng đượcc mọi người quan tâm như âm nhạc, phim truyện…ngày càngphổ biến Vì vậy, việc thiết kế cho công ty một trang web quảng bá thương hiệucũng như đáp ứng nhu cầu người sử dụng tìm kiếm

Website có vai trò quan trọng đối với sự phát triển kinh doanh của các doanhnghiệp Và lợi nhuận của nó đem lại không phải là nhỏ

Mà bài toán đặt ra là ? Khi người dùng cần trao đổi, mua bán hàng hóa trêncác sàn thương mại điện tử thì dùng cách nào ? Để giải quyết bài toán đó, các nhàphát triển đã tạo ra một module với tên gọi là Module xác thực Với module xácthực, những người dùng mới có thể đăng ký tài khoản để có thể thực hiện nhữngphương thức trao đổi, mua bán với những người khác Hoặc nếu người dùng đã cótài khoản trong hệ thống thì có thể tái đăng nhập lại để sử dụng dịch vụ trongwebsite đó

III Ưu, nhược điểm của hệ thống cũ.

1 Ưu điểm.

 Khả năng lưu trữ data lớn

 Những rủi ro khi người dùng chưa đăng nhập được tiết chế lại

2 Nhược điểm.

 Thời gian phản hồi từ server đến người dùng lâu

 Chi phí bảo trì server tăng cao khi chưa áp dụng các kỹ thuật quản lýmới

IV Yêu cầu của đề tài.

Xây dựng một module xác thực để khách hàng có thể đăng ký/đăng nhập vàovào hệ thống để sử dụng những dịch vụ của website

(*) Đăng ký:

Người dùng có thể đăng ký tài khoản mới vào trong hệ thống Khi tài khoảnhợp lệ, hệ thống sẽ cấp quyền truy cập người dùng từ đó họ có thể đăng nhập vàowebsite và trải nghiệm các dịch vụ mà website mang lại.

(*) Đăng nhập:

Người dùng có sẵn tài khoản từ trước có thể tái sử dụng lại bằng cách đăngnhập Hệ thống sẽ kiểm tra xem tài khoản đó đã có trong server chưa, nếu đã córồi thì sẽ duyệt tài khoản đó và gửi thông báo "Đăng nhập thành công" cho user.Nếu chưa có tài khoản, hệ thống sẽ yêu cầu khách hàng đăng ký tài khoản trướckhi đăng nhập vào hệ thống

V Công cụ lập trình.

 Ngôn ngữ kịch bản được sử dụng: PHP

 Phần mềm chạy source code: XAMPP

 Phần mềm Web Server: Apache, MySQL

1 Giới thiệu về ngôn ngữ PHP.

PHP là một ngôn ngữ lập trình web, đó là một dạng của mã nguồn mở (xemPHP: Hypertext Preprocessor) và là ngôn ngữ script trên sever được thiết kế dễdàng xây dựng các trang Web động Mã PHP có thể thực thi trên Webserver đểtạo ra mã HTML và xuất ra trình duyệt web theo yêu cầu người sử dụng

PHP phát triển với mục đích xây dựng trang web cá nhân (Personal HomePage) Sau đó được phát triển thành một ngôn ngữ hoàn chỉnh và được ưachuộng trên toàn thế trong việc phát triển các ứng dụng Web based TheoNetCraft:

 Tháng 11 năm 1999, hơn 1 triệu máy chủ

 Tháng 9 năm 2000, hơn 1.4 triệu máy chủ

PHP thường hoạt động theo thứ tự sau:

Người dùng gửi yêu cầu lên máy chủ

Máy chủ xử lý yêu cầu (thông dịch mã PHP và chạy chương trình, mã PHP

có thể truy xuất CSDL, tạo hình ảnh, đọc ghi file, tương tác với máy chủ khác ).Máy chủ gửi dữ liệu về cho người dùng (thường là dưới dạng HTML)

2 Lý do nên chọn ngôn ngữ PHP.

Khi sử dụng PHP, người dùng sẽ có được tốc độ nhanh hơn nhiều so với cácngôn ngữ kịch bản khác, bởi PHP là phần mềm mã nguồn mở Ngoài ra PHPchạy được trên nhiều hệ điều hành khác nhau Rút ngắn thời gian phát triển: PHP

cho phép bạn tách phần HTML code và script, do đó có thể độc lập giữa côngviệc phát triển mã và thiết kế

Tốc độ: Nhờ vào sức mạnh của Zend Engine, khi so sánh PHP và ASP, có

thể thấy PHP vượt hơn ở một số test, vượt trội ở tốc độ biên dịch

Tính khả chuyển: PHP được thiết kế để chạy trên nhiều nền tảng khác nhau,

có thể làm việc với nhiều phần mềm máy chủ Rất đơn giản trong việc kết nốivới nhiều nguồn DBMS, ví dụ như : MySQL, Microsoft SQL Server 2000,Oracle, PostgreSQL, Adabas, dBase, Empress, FilePro, Informix, InterBase,mSQL, Solid, Sybase, Velocis và nhiều hệ thống CSDL thuộc Hệ Điều HànhUnix (Unix dbm) cùng bất cứ DBMS nào có sự hỗ trợ cơ chế ODBC (OpenDatabase Connectivity) ví dụ như DB2 của IBM

4 Web Server: Apache.

Apache là phần mềm web server miễn phí mã nguồn mở Nó đang chiếm đếnkhoảng 46% thị phần websites trên toàn thế giới Tên chính thức của Apache

là Apache HTTP Server, được điều hành và phát triển bởi Apache SoftwareFoundation

Mặc dù chúng ta gọi Apache là web server, nhưng nó lại không phải làserver vật lý, nó là một phần mềm chạy trên server đó Công việc của nó là thiếtlập kết nối giữa server và trình duyệt người dùng (Firefox, Google Chrome,Safari, vâng vâng.) rồi chuyển file tới và lui giữa gchúng (cấu trúc 2 chiều dạngclient-server) Apache là một phần mềm đa nền tảng, nó hoạt động tốt với cảserver Unix và Windows

5 XAMPP

Xampp là chương trình tạo máy chủ Web (Web Server) được tích hợpsẵn Apache, PHP, MySQL, FTP Server, Mail Server và các công cụ

như phpMyAdmin Không như Appserv, Xampp có chương trình quản lý khátiện lợi, cho phép chủ động bật tắt hoặc khởi động lại các dịch vụ máy chủ bất kỳlúc nào

Xampp là một chương trình mã nguồn mở máy chủ web đa nền được pháttriển bởi Apache Friends, bao gồm chủ yếu là Apache HTTP Server, MariaDBdatabase, và interpreters dành cho những đối tượng sử dụng ngôn ngữ PHP vàPerl Xampp là viết tắt của Cross-Platform (đa nền tảng-X), Apache (A),MariaDB (M), PHP (P) và Perl (P) Nó phân bố Apache nhẹ và đơn giản, khiếncác lập trình viên có thể dễ dàng tạo ra máy chủ web local để kiểm tra và triểnkhai trang web của mình Tất cả mọi thứ cần cho phát triển một trang web -Apache (ứng dụng máy chủ), Cơ sở dữ liệu (MariaDB) và ngôn ngữ lập trình(PHP) được gói gọn trong 1 tệp Xampp cũng là 1 chương trình đa nền tảng vì nó

có thể chạy tốt trên cả Linux, Windows và MacOS Hầu hết việc triển khai máychủ web thực tế đều sử dụng cùng thành phần như XAMPP nên rất dễ dàng đểchuyển từ máy chủ local sang máy chủ online

Bên cạnh sơ đồ ngữ cảnh là sơ đồ luồng dữ liệu mức 1.

Ở cấp độ này, hệ thống phải hiển thị hoặc tiết lộ thêm thông tin xử lý

Sau đây là những dữ liệu cần thiết để điều chỉnh:

Thông tin người dùng

Xác nhận/Đăng ký thông tin

Hệ thống quản lý tài khoản

Tạo tài khoản Số tài khoản mới

Số lượt truy cập vào web

Người dùng

TT người dùng TT người dùng

Kiểm tra thông tin

CSDL người dùng

CSDL nhật ký/giao dịch

Xác nhận cập nhật Xác nhận CSDL

1.3

Kiểm tra và đăng ký thông tin

Xác nhận cập nhật

II Phân tích dữ liệu hệ thống.

Chương 3 : THIẾT KẾ HỆ THỐNG

I Thiết kế cơ sở dữ liệu.

 Bước 1: Trong XAMPP, khởi chạy MySQL

 Bước 2: Truy cập vào địa chỉ: localhost/phpmyadmin.

 Bước 3: Trong Phpmyadmin, ta tạo một database với tên gọi: baitaplon_php

 Bước 4: Tiếp tục truy cập vào Database "baitaplon_php" vừa tạo để tạobảng với tên gọi "members" và thêm dữ liệu vào bảng Sau đó ấn thực hiện đểchạy câu lệnh

 Bước 5: Trong Vscode, tạo một file folder với tên gọi

"Modul_Xacthuc_php" Chú ý: File folder phải nằm trong thư mục "htdocs"của Folder "xampp"

 Nhấn tổ hợp phím Ctrl + N để tạo một file mới với tên gọi

II Thiết kế giao diện.

 Mở công cụ Visual Studio Code, tạo một file với tên gọi login.php để làmform đăng nhập Sử dụng framework Bootstrap để dễ dàng hoàn thành giao diện

 Source code:

 Phần php:

 Hình ảnh giao diện:

 Tương tự, ta cũng tạo thêm một file mới với tên gọi "register.php" để làmform Đăng ký Tạo đường dẫn giữa 2 form với nhau bằng thẻ "a".

 Source code:

 Phần php:

 Hình ảnh giao diện:

Giao diện sẽ có các trường để người dùng có thể điền thông tin vào như: First Name, Last Name, Email, Password

Chương 4 : CÀI ĐẶT VÀ CHẠY THỬ.

I Cài đặt.

1 Các công cụ cần cài đặt.

Lựa chọn môi trường sau đây cho việc cài đặt hệ thống trên nền web

 Hệ điều hành: Windows 7, Windows 10, Windows 11

 Hệ quản trị cơ sở dữ liệu: MySQL Sever

 Ngôn ngữ lập trình: PHP

 Tải và cài đặt XAMPP để có thể khởi chạy web server như Apache,MySQL

 Cài đặt VSCode

 Cài đặt thêm phần mềm Navicat

2 Chạy các thao tác để cài đặt chương trình.

Để cài đặt chương trình ta lần lượt dùng các thao tác sau

 Bước 1: Mở công cụ XAMPP lên, khởi chạy với quyền admin "Run asAdministrator"

 Bước 2: Trong XAMPP Control Pannel, khởi chạy Apache và MySQL đểbắt đầu phiên làm việc

 Bước 3: Khởi chạy trình duyệt Web VD: GG Chrome

 Bước 4: Trong thanh tìm kiếm gõ địa chỉ chứa file cần làm việc VD: "localhost/file_name".



 Bước 5: Chọn vào file cần làm việc

II Chạy thử.

Lần lượt kiểm tra các điều kiện đã đưa ra trong source code

 Ở form đăng nhập kiểm tra các trường hợp đăng nhập thành công, đăngnhập thất bại, email/password nhập có đúng hay không ?

 Đăng nhập thành công: Nếu đăng nhập thành công hệ thống sẽchuyển sang file dashboard.php đồng thời hiện tên người dùng