TIỂU LUẬN CHUYÊN NGÀNH xây DỰNG ỨNG DỤNG WEB đặt vé XEM PHIM

HCM CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM KHOA ĐÀO TẠO CHẤT LƯỢNG CAO Độc lập – Tự do – Hạnh Phúc PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN Ngành: Công nghệ Thông tin Tên đề tài: Xây dựng ứng

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP HỒ CHÍ MINH KHOA ĐÀO TẠO CHẤT LƯỢNG CAO

- -TIỂU LUẬN CHUYÊN NGÀNH

XÂY DỰNG ỨNG DỤNG WEB ĐẶT VÉ XEM PHIM

GVHD: TS Lê Văn Vinh

Sinh viên thực hiện:

NGUYỄN THU NGÂN NGUYỄN NHƯ BẢO PHƯƠNG Khóa: 2018

Ngành: CÔNG NGHỆ THÔNG TIN

Thành phố Hồ Chí Minh, tháng 11/2021

ĐH SƯ PHẠM KỸ THUẬT TP HCM CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM KHOA ĐÀO TẠO CHẤT LƯỢNG CAO Độc lập – Tự do – Hạnh Phúc

PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN

Ngành: Công nghệ Thông tin

Tên đề tài: Xây dựng ứng dụng web đặt vé xem phim

Họ và tên Giáo viên hướng dẫn: TS Lê Văn Vinh

NHẬN XÉT

1. Về nội dung đề tài & khối lượng thực hiện:

2. Ưu điểm:

3. Khuyết điểm:

4. Đề nghị cho bảo vệ hay không?

5. Đánh giá loại:

6. Điểm:

Tp Hồ Chí Minh, ngày tháng năm 2021

Giáo viên hướng dẫn (Ký & ghi rõ họ tên)

******* *******

PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN

Ngành: Công nghệ Thông tin

1. Về nội dung đề tài & khối lượng thực hiện:

2. Ưu điểm:

3. Khuyết điểm:

4. Đề nghị cho bảo vệ hay không?

5. Đánh giá loại:

6. Điểm:

Tp Hồ Chí Minh, ngày tháng năm 2021

Giáo viên phản biện (Ký & ghi rõ họ tên)

LỜI CẢM ƠN

Lời đầu tiên nhóm xin phép được gửi lời cảm ơn chân thành và sâu sắc nhất đếnvới Khoa Đào Tạo Chất Lượng Cao – Trường Đại Học Sư Phạm Kỹ Thuật ThànhPhố Hồ Chí Minh đã tạo điều kiện cho nhóm chúng em được học tập, phát triển nềntảng kiến thức sâu sắc và thực hiện đề tài này

Bên cạnh đó, nhóm chúng em cũng xin gửi lời cảm ơn chân thành nhất đếnthầy Lê Văn Vinh, người đã tận tình chỉ bảo và hướng dẫn nhóm chúng em thựchiện đề tài này

Mặc dù nhóm chúng em đã rất cố gắng để hoàn thành một cách tốt nhất,nhưng do thời gian hạn hẹp, khả năng còn hạn chế nên khó tránh khỏi việc thiếu sóttrong bài báo cáo Chúng em rất mong nhận được sự thông cảm, góp ý cũng nhưđóng góp của thầy để đề tài hoàn thiện hơn, để có thể phát triển hơn phục vụ chotương lai

Chúng em chân thành cảm ơn

Nhóm thực hiện

Nguyễn Thu Ngân – 18110161 Nguyễn Như Bảo Phương – 18110180

- Tính bảo mật của website.

- Dùng dường dẫn ảnh trực tuyến bị lỗi hiển thị

- Giải pháp hoàn tiền trong Paypal

3 Các phương pháp giải quyết vấn đề

- Sử dụng JWT để cải thiện yêu cầu bảo mật cho website

- Lưu ảnh ở local bằng multer

4 Kết quả đạt được

- Hệ thống Đặt vé xem phim gồm: website cho phía người dùng cuối và website cho phía người quản lý trang

- Giao diện dễ sử dụng với người dùng

MỤC LỤC

MỤC LỤC HÌNH ẢNH i

MỤC LỤC BẢNG iv

DANH MỤC TỪ VIẾT TẮT vii

DANH MỤC TỪ CHUYÊN NGÀNH viii

KẾ HOẠCH THỰC HIỆN 1

CHƯƠNG 1: PHẦN MỞ ĐẦU 3

1.1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 3

1.2 ĐỐI TƯỢNG NGHIÊN CỨU 3

1.3 PHẠM VI NGHIÊN CỨU 4

1.4 KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC 4

CHƯƠNG 2: CƠ SỞ LÝ THUYẾT 5

2.1 NODEJS [1] 5

2.1.1.Khái niệm 5

2.1.2.Các đặc tính của NodeJS 5

2.2 EXPRESSJS [2] 6

2.2.1 Khái niệm 6

2.2.2 Tính năng 6

2.3 MONGODB [3] 7

2.3.1 Khái niệm 7

2.3.2 Tính năng 7

2.4 REACTJS [4] 8

2.4.1.Khái niệm 8

2.4.2 Đặc trưng 8

2.5 JSON WEB TOKEN [5] 9

2.5.1.Khái niệm 9

2.5.2.Cấu trúc 9

CHƯƠNG 3: KHẢO SÁT HIỆN TRẠNG VÀ MÔ HÌNH HÓA YÊU CẦU 11

3.1 KHẢO SÁT HIỆN TRẠNG 11

3.1.1.TIX.VN 11

3.1.2.CGV.VN 12

3.1.3.BHDSTAR.VN 13

3.1.4.GALAXYCINE.VN 14

3.1.5.CINESTAR.COM.VN 15

3.1.6.KẾT LUẬN 15

3.2 XÁC ĐỊNH YÊU CẦU 16

3.2.1 Yêu cầu chức năng 16

3.2.2 Yêu cầu phi chức năng 17

3.3 MÔ HÌNH HÓA YÊU CẦU 17

3.3.1 Bảng chức năng 17

3.3.2 Lược đồ Usecase 19

3.3.3 Đặc tả Usecase 20

CHƯƠNG 4 THIẾT KẾ PHẦN MỀM 37

4.1.LƯỢC ĐỒ LỚP 37

4.2 LƯỢC ĐỒ TUẦN TỰ 38

4.3.CHI TIẾT BẢNG DỮ LIỆU 47

4.4.SƠ ĐỒ ERD 51

4.5 GIAO DIỆN NGƯỜI DÙNG 52

4.5.1.Đăng ký 52

4.5.2.Đăng nhập 53

4.5.3.Trang chủ 53

4.5.4.Chi tiết phim 58

4.5.5.Thông tin cá nhân 59

4.5.6.Thay đổi thông tin tài khoản 60

4.5.7.Thay đổi mật khẩu 61

4.5.8.Lịch sử giao dịch 62

4.5.9.Đặt vé 63

4.5.10.Xác nhận mua vé 64

4.5.11.Danh sách khách hàng 65

4.5.12.Danh sách phim 66

4.5.13.Tạo phim mới 67

4.5.14.Chỉnh sửa phim 68

4.5.15.Xóa phim 69

4.15.16 Tạo lịch chiếu 70

4.5.16 Thống kê 71

4.5.17.Đổi vé 72

4.5.18.Xác nhận đổi vé 73

CHƯƠNG 5: KIỂM THỬ PHẦN MỀM 74

5.1.CÔNG CỤ DÙNG TRONG DỰ ÁN 74

5.2 CÀI ĐẶT ỨNG DỤNG 74

5.3.THỰC HIỆN KIỂM THỬ 75

5.4 KẾ HOẠCH KIỂM THỬ 75

5.4.1 Kịch bản kiểm thử 76

5.4.2 Kết quả kiểm thử 76

CHƯƠNG 6: TỔNG KẾT 93

6.1 KẾT QUẢ ĐẠT ĐƯỢC 93

6.2 ƯU ĐIỂM 93

6.3 NHƯỢC ĐIỂM 93

6.4 HƯỚNG PHÁT TRIỂN 93

CHƯƠNG 7: TÀI LIỆU THAM KHẢO 94

MỤC LỤC HÌNH ẢNH

Hình 1 Trang TIX 11

Hình 2.Trang CGV 12

Hình 3 Trang BHD 13

Hình 4 Trang GALAXYCINE 14

Hình 5 Trang CINESTAR 15

Hình 6 Lược đồ khách 19

Hình 7 Lược đồ người quản lý trang 20

Hình 8.Lược đồ lớp 37

Hình 9.Lược đồ tuần tự ĐĂNG NHẬP 38

Hình 10.Lược đồ tuần tự ĐĂNG XUẤT 38

Hình 11.Lược đồ tuần tự ĐĂNG KÝ 39

Hình 12.Lược đồ tuần tự XEM THÔNG TIN CÁ NHÂN 39

Hình 13.Lược đồ tuần tự SỬA THÔNG TIN KHÁCH HÀNG 40

Hình 14.Lược đồ tuần tự THAY ĐỔI MẬT KHẨU KHÁCH HÀNG 40

Hình 15.Lược đồ tuần tự ĐẶT VÉ KHÔNG DÙNG ĐIỂM THƯỞNG 41

Hình 16.Lược đồ tuần tự ĐẶT VÉ DÙNG ĐIỂM THƯỞNG 42

Hình 17.Lược đồ tuần tự THỐNG KÊ 42

Hình 18.Lược đồ tuần tự XEM LỊCH SỬ GIAO DỊCH 43

Hình 19.Lược đồ tuần tự XEM THÔNG TIN PHIM 43

Hình 20.Lược đồ tuần tự XEM THÔNG TIN NGƯỜI DÙNG 44

Hình 21.Lược đồ tuần tự TÌM KIẾM THÔNG TIN NGƯỜI DÙNG 44

Hình 22.Lược đồ tuần tự TẠO MỚI PHIM 45

Hình 23.Lược đồ tuần tự CẬP NHẬT PHIM 45

Hình 24.Lược đồ tuần tự XÓA PHIM 46

Hình 25.Lược đồ tuần tự TẠO LỊCH CHIẾU 46

Hình 26 Lược đồ tuần tự "ĐỔI GHẾ" 47

Hình 27 Sơ đồ ERD 51

Hình 28.Giao diện ĐĂNG KÝ 52

Hình 29 Giao diện đăng nhập 53

Hình 30 Giao diện Trang chủ 54

Hình 31 Giao diện Trang chủ sau khi đăng nhập 55

Hình 32 Giao diện TÌM KIẾM 55

Hình 33 Giao diện LỊCH CHIẾU 56

Hình 34 Giao diện CỤM RẠP 57

Hình 35 Giao diện THÔNG TIN PHIM 58

Hình 36 Giao diện TRANG THÔNG TIN CÁ NHÂN 59

Hình 37 Giao diện THAY ĐỔI THÔNG TIN 60

Hình 38 Giao diện THAY ĐỔI MẬT KHẨU 61

Hình 39 Giao diện LỊCH SỬ GIAO DỊCH 62

Hình 40 Giao diện ĐẶT VÉ 63

Hình 41 Giao diện XÁC NHẬN ĐẶT VÉ 64

Hình 42 Giao diện DANH SÁCH KHÁCH HÀNG 65

Hình 43 Giao diện DANH SÁCH PHIM 66

Hình 44 Giao diện TẠO THÔNG TIN PHIM 67

Hình 45 Giao diện CHỈNH SỬA PHIM 68

Hình 46 Giao diện XÓA THÔNG TIN PHIM 69

Hình 47 Giao diện TẠO LỊCH CHIẾU 70

Hình 48 Giao diện THỐNG KÊ 71

Hình 49 Giao diện ĐỔI VÉ 72

Hình 50 Giao diện XÁC NHẬN ĐỔI VÉ 73

Hình 51.Kết quả thực tế của TC_SI_01 77

Hình 52.Kết quả thực tế của TC_SI_02 78

Hình 53.Kết quả thực tế của TC_SI_03 78

ii

Hình 54.Kết quả thực tế của TC_SU_01(hinh a) 82

Hình 55.Kết quả thực tế của TC_SU_01 (hình b) 82

Hình 56.Kết quả thực tế của TC_SU_02 83

Hình 57.Kết quả thực tế của TC_SU_03 83

Hình 58.Kết quả thực tế của TC_SU_04 84

Hình 59.Kết quả thực tế của TC_SU_05 84

Hình 60.Kết quả thực tế của TS_CS_01 87

Hình 61.Kết quả thực tế của TS_CS_02 87

Hình 62.Kết quả thực tế của TS_CS_03 87

Hình 63.Kết quả thực tế của TS_CS_04 88

Hình 64.Kết quả thực tế của TS_CS_05 88

Hình 65.Kết quả thực tế của TS_CM_01 90

Hình 66.Kết quả thực tế của TS_CM_02 91

Hình 67.Kết quả thực tế của TS_CM_03 92

Hình 68.Kết quả thực tế của TS_CM_04 92

MỤC LỤC BẢNG

Bang 1 Chức năng người quản lý trang 18

Bang 2 Chức năng khách hàng 18

Bang 3 Chức năng Khách vãng lai 19

Bang 4.Kịch bản ĐĂNG NHẬP 21

Bang 5.Kich bản ĐĂNG XUẤT 22

Bang 6.Kich bản ĐĂNG KÝ 23

Bang 7.Kich bản XEM THÔNG TIN CÁ NHÂN 24

Bang 8.Kich bản SỬA THÔNG TIN CÁ NHÂN 24

Bang 9.Kich bản THAY ĐỔI MẬT KHẨU 25

Bang 10.Kich bản ĐẶT VÉ KHÔNG DÙNG ĐIỂM THƯỞNG 26

Bang 11 Kịch bản "ĐẶT VÉ DÙNG ĐIỂM THƯỞNG" 27

Bang 12 Kich bản THỐNG KÊ 28

Bang 13 Kich bản XEM THÔNG TIN PHIM 29

Bang 14.Kich bản XEM THÔNG TIN NGƯỜI DÙNG 29

Bang 15.Kich bản TÌM KIẾM THÔNG TIN NGƯỜI DÙNG 30

Bang 16.Kich bản TẠO PHIM MỚI 31

Bang 17.Kich bản CẬP NHẬT PHIM 32

Bang 18.Kich bản XÓA PHIM 33

Bang 19.Kich bản TẠO LỊCH CHIẾU 34

Bang 20.Kich bản XEM LỊCH SỬ GIAO DỊCH 34

Bang 21.Kịch bản "ĐỔI GHẾ" 35

Bang 22.Chi tiết bảng USERS 48

Bang 23.Chi tiết bảng MOVIES 49

Bang 24.Chi tiết bảng MOVIETHREATERS 49

Bang 25.Chi tiết bảng ROOMS 49

Bang 26 Chi tiết bảng SHOWTIMES 50

iv

Bang 27.Chi tiết bảng TICKETBOOKINGS 51

Bang 28.Giao diện ĐĂNG KÝ 53

Bang 29.Giao diện ĐĂNG NHẬP 53

Bang 30.Giao diện TRANG CHỦ SAU KHI ĐĂNG NHẬP 54

Bang 31.Giao diện TRANG CHỦ SAU KHI ĐĂNG NHẬP 55

Bang 32.Giao diện TÌM KIẾM PHIM 55

Bang 33.Giao diện LỊCH CHIẾU 56

Bang 34.Giao diện CỤM RẠP 57

Bang 35.Giao diện CHI TIẾT PHIM 58

Bang 36.Giao diện THÔNG TIN CÁ NHÂN 59

Bang 37.Giao diện THAY ĐỔI THÔNG TIN TÀI KHOẢN 60

Bang 38.Giao diện THAY ĐỔI MẬT KHẨU 61

Bang 39.Giao diệnL LỊCH SỬ GIAO DỊCH 62

Bang 40.Giao diện ĐẶT VÉ 63

Bang 41.Giao diện XÁC NHẬN MUA VÉ 64

Bang 42.Giao diện DANH SÁCH NGƯỜI DÙNG 65

Bang 43.Giao diện DANH SÁCH PHIM 67

Bang 44.Giao diện TẠO PHIM MỚI 68

Bang 45.Giao diện CHỈNH SỬA PHIM 69

Bang 46.Giao diện XÓA PHIM 70

Bang 47 Giao diện TẠO LỊCH CHIẾU 70

Bang 48 Giao diện THỐNG KÊ 71

Bang 49 Giao diện ĐỔI VÉ 72

Bang 50 Giao diện XÁC NHẬN ĐỔI VÉ 74

Bang 51.Kịch bản kiểm thử 76

Bang 52.Kiểm thử ĐĂNG NHẬP 77

Bang 53.Kiểm thử ĐĂNG KÝ 81

Bang 54.Kiểm thử TẠO PHIM MỚI 87

Bang 55.Kiểm thử TẠO LỊCH CHIẾU CHO PHIM 90

vi

DANH MỤC TỪ VIẾT TẮT

Số thứ tự1234

17 Request Yêu cầu được gửi từ người dùng

KẾ HOẠCH THỰC HIỆN

1+2+

15/09 – 05/103

4+5+

06/10 – 26/106

7+8+

27/10 – 16/119

Page 1 of 93

11+12

13

Page 2 of 93

CHƯƠNG 1: PHẦN MỞ ĐẦU1.1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI

Đến rạp xem phim là một hình thức giải trí tuyệt vời, được nhiều bạn trẻ yêuthích hiện nay Tuy nhiên, mua vé xem phim lại là một việc không được yêu thích nhưvậy Bởi vào những ngày cao điểm thì xếp hàng mua vé xem phim trực tiếp tại quầy làmột "cực hình" Đặc biệt hơn nữa vào thời điểm dịch bệnh vẫn chưa hoàn toàn đượckiểm soát như hiện này thì việc tập trung đông người để mua vé là điều không nênkhuyến khích Chính vì thế mà hình thức mua vé xem phim online được ưa chuộnghơn rất nhiều

Quý khách có thể quét mã QR để một bước vào rạp mà không cần tốn thêm bất

kỳ công đoạn nào nữa Nếu bạn đã chọn được phim hay để xem, hãy đặt vé cực nhanhbằng cách chọn phim ngay từ Trang Chủ Chỉ cần một phút, email phản hồi của web

sẽ gửi ngay vào hộp mail của bạn

Nhận thấy được nhu cầu xem phim của người dùng hiện nay, nhóm chúng em

đã quyết định chọn đề tài “Xây dựng trang web Đặt vé xem phim” để giúp mọi người

có thể đặt vé nhanh chóng, tiện lợi và hiệu quả

1.2 ĐỐI TƯỢNG NGHIÊN CỨU

Đối với đề tài này, đối tượng nghiên cứu dựa trên nhu cầu sử dụng một cách nhanhchóng việc đặt vé xem phim Đồng thời kèm theo đó là các công nghệ áp dụng tạo rasản phẩm Cụ thể như sau:

-Tập trung nghiêm cứu Restful API, NodeJS, ExpressJS để xây dựng nên hệ thống cácAPIs hỗ trợ lấy dữ liệu một cách chính xác và nhanh chóng nhất

-Áp dụng cơ sở dữ liệu NoSQL là MongoDB để lưu trữ dũ liệu người dùng của hệthống

-Về phần hiển thị cho người sử dụng nhóm chúng em tiến hành nghiên cứu FrameworkReactJS và một số thư viện được hỗ trợ cho ReactJS để xây dựng và xử lý giao diện

và cho người dùng sử dụng

-Về phần bảo mật hệ thống, tiến hành nghiên cứu công nghệ Json Web Token làm bảomật cho hệ thống, tất cả các luồng dữ liệu vào ra đều được kiểm soát thông quaToken Người dùng bắt buộc phải đăng nhập vào hệ thống để có một Token riêng

và mỗi request từ phía người dùng đều phải thông qua một “cánh cửa” Interceptor

và Token là “chìa khóa”

1.3 PHẠM VI NGHIÊN CỨU

Đề tài này chủ yếu đi tập trung vào việc xử lý các nghiệp vụ cơ bản của mộtwebsite như là xem thông tin phim, thực hiện việc đặt vé, lưu lịch sử giao dịch,… Vềphần lõi xử lý, xây dựng đầy đủ các APIs phục vụ cho phần hiển thị cuối cùng

1.4 KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC

-Có thêm kiến thức về NodeJS, ReactJS, cách gọi API

-Xây dựng được một website đặt vé phim trực tuyến với những tính năng cơ bản: Đặt

vé, đổi vé, xem thông tin phim, quản lý thông tin cá nhân ở phía người dùng; Quản

lý phim, lịch chiếu, quản lý người dùng và thống kê ở phía người quản lý trang

Page 4 of 93

CHƯƠNG 2: CƠ SỞ LÝ THUYẾT2.1 NODEJS [1]

2.1.1.Khái niệm

NodeJS là một mã nguồn được xây dựng dựa trên nền tảng Javascript V8 Engine

Nó được xây dựng để chạy trên server.Javascript là ngôn ngữ hướng sự kiện, do đóbất cứ điều gì xảy ra trên server đều tạo ra sự kiện non-blocking Nên 1 website sửdụng NodeJS đáp ứng được việc truy cập cùng lúc một lượng user cực kì lớn

Và cũng như nhiều ngôn ngữ chạy phía server khác, NodeJS cũng có một cộngđồng phát triển rất lớn Nhiều framework sử dụng core NodeJS ra đời, một trong sốcác framework phổ biến nhất hiện nay là Express

NodeJS được xây dựng dựa vào nền tảng V8 Javascript Engine nên việc thực thi chương trình rất nhanh

Khả năng đơn luồng

Nhưng khả năng mở rộng cao: Node.js sử dụng một mô hình luồng duy nhất với

sự kiện lặp

Cơ chế tổ chức sự kiện giúp các máy chủ để đáp ứng một cách không ngăn chặn

và làm cho máy chủ cao khả năng mở rộng

Sử dụng một chương trình đơn luồng và các chương trình tương tự có thể cung cấp dịch vụ cho một số lượng lớn hơn nhiều so với yêu cầu máy chủ

Khả năng không đệm (NoCache)

NodeJS không đệm bất kì một dữ liệu nào và các ứng dụng này chủ yếu là đầu ra

dữ liệu

2.2 EXPRESSJS [2]

2.2.1 Khái niệm

Đây là một framework mã nguồn mở miễn phí cho NodeJS ExpressJS được sửdụng trong thiết kế và xây dựng các ứng dụng web một cách đơn giản và nhanhchóng

ExpressJS chỉ yêu cầu ngôn ngữ lập trình Javascript nên việc xây dựng các ứngdụng web và API trở nên đơn giản hơn với các lập trình viên và nhà phát triển.ExpressJS cũng là một khuôn khổ của NodeJS do đó hầu hết các mã code đã được viếtsẵn cho các lập trình viên có thể làm việc

Nhờ có ExpressJS mà các nhà lập trình có thể dễ dàng tạo các ứng dụng 1 web,nhiều web hoặc kết hợp Do có dung lượng khá nhẹ, ExpressJS giúp cho việc tổ chứccác ứng dụng web thành một kiến trúc MVC có tổ chức hơn Để có thể sử dụng được

mã nguồn này, chúng ta cần phải biết về Javascript và HTML

Trên thực tế, nếu không sử dụng ExpressJS, bạn sẽ phải thực hiện rất nhiều bướclập trình phức tạp để xây dựng nên một APIhiệu quả ExpressJS đã giúp cho việc lậptrình trong Node.js trở nên dễ dàng hơn và có nhiều tính năng mới bổ sung

2.2.2 Tính năng

Phát triển máy chủ nhanh chóng: ExpressJS cung cấp nhiều tính năng dưới dạngcác hàm để dễ dàng sử dụng ở bất kỳ đâu trong chương trình Điều này đã loại bỏnhu cầu viết mã từ đó tiết kiệm được thời gian

Phần mềm trung gian Middleware: Đây là phần mềm trung gian có quyền truycập vào cơ sở dữ liệu, yêu cầu của khách hàng và những phần mềm trung gian khác.Phần mềm Middleware này chịu trách nhiệm chính cho việc tổ chức có hệ thống cácchức năng của ExpressJS

Định tuyến - Routing: ExpressJS cung cấp cơ chế định tuyến giúp duy trì trạngthái của website với sự trợ giúp của URL

Tạo mẫu - Templating: Các công cụ tạo khuôn mẫu được ExpressJS cung cấp chophép các nhà xây dựng nội dung động trên các website bằng cách tạo dựng các mẫuHTML ở phía máy chủ

Gỡ lỗi - Debugging: Để phát triển thành công các ứng dụng web không thể thiết

đi việc gỡ lỗi Giờ đây với ExpressJS việc gỡ lỗi đã trở nên dễ dàng hơn nhờ khảnăng xác định chính xác các phần ứng dụng web có lỗi

Page 6 of 93

2.3 MONGODB [3]

2.3.1 Khái niệm

MongoDB là một loại database thiên hướng tài liệu và là một dạng NoSQLdatabase Chính vì vậy, Mongodb thường sẽ tránh đi cấu trúc table-based củarelational database để có thể thích ứng được với mọi tài liệu như JSON có sẵn trongmột schema rất linh hoạt và được gọi là BSON

MongoDB được dùng để lưu trữ mọi dữ liệu dưới dạng Document JSON bởi vậymỗi một collection thường sẽ có các kích cỡ và các document khác nhau Mọi dữ liệukhi đó đều sẽ được lưu trữ sẵn trong document theo kiểu JSON nên các truy vấn sẽ rấtnhanh

2.3.2 Tính năng

Hỗ trợ search bằng field, các phép search thông thường, regular expressionsearches, và range queries

Indexing: bất kì field nào trong BSON document cũng có thể được index

Replication: có ý nghĩa là “nhân bản”, là có một phiên bản giống hệt phiên bảnđang tồn tại, đang sử dụng Với cơ sở dữ liệu, nhu cầu lưu trữ lớn, đòi hỏi cơ sở dữliệu toàn vẹn, không bị mất mát trước những sự cố ngoài dự đoán là rất cao Vì vậy,người ta nghĩ ra khái niệm “nhân bản”, tạo một phiên bản cơ sở dữ liệu giống hệt cơ

sở dữ liệu đang tồn tại, và lưu trữ ở một nơi khác, đề phòng có sự cố

Aggregation: Các Aggregation operation xử lý các bản ghi dữ liệu và trả về kếtquả đã được tính toán Các phép toán tập hợp nhóm các giá trị từ nhiều Documentlại với nhau, và có thể thực hiện nhiều phép toán đa dạng trên dữ liệu đã được nhóm

đó để trả về một kết quả duy nhất Trong SQL, count(*) và GROUP BY là tươngđương với Aggregation trong MongoDB

Lưu trữ file: MongoDB được dùng như một hệ thống file tận dụng nhữngfunction trên và hoạt động như một cách phân phối qua sharding

hợp là Aggregation Pipeline, chức năng Mapreduce và Single-purpose Aggregation.Trong đó, theo tài liệu của MongoDB thì Aggregation Pipeline được công nhận làcung cấp hiệu suất tốt hơn hầu hết các hoạt động tổng hợp

JavaScript thường được thực thi trong các truy vấn, các hàm tổng hợp và được gửi trực tiếp đến cơ sở dữ liệu

MongoDB hỗ trợ collection có kích thước cố định được gọi là collection giớihạn Nó có kích cỡ cố định theo sau thứ tự chèn làm tăng hiệu suất các hoạt động khác

có liên quan đến dữ liệu Khi dữ liệu vượt quá mức giới hạn thì các tài liệu cũ sẽ bịxóa mà không cần dùng bất cứ dòng lệnh nào

2.4 REACTJS [4]

2.4.1.Khái niệm

ReactJS là một mã nguồn mở được phát triển bởi Facebook, ra mắt vào năm 2013,bản thân nó là một thư viện Javascript được dùng để để xây dựng các tương tác vớicác thành phần trên website Một trong những điểm nổi bật nhất của ReactJS đó làviệc render dữ liệu không chỉ thực hiện được trên tầng Server mà còn ở dưới Clientnữa

ReactJS là một thư viện JavaScript chuyên giúp các nhà phát triển xây dựng giaodiện người dùng hay UI Trong lập trình ứng dụng front-end, lập trình viên thường sẽphải làm việc chính trên 2 thành phần sau: UI và xử lý tương tác của người dùng

2.4.2 Đặc trưng

2.4.2.1.JSX

Trong React, thay vì thường xuyên sử dụng JavaScript để thiết kế bố cục trangweb thì sẽ dùng JSX JSX được đánh giá là sử dụng đơn giản hơn JavaScript và chophép trích dẫn HTML cũng như việc sử dụng các cú pháp thẻ HTML để render cácsubcomponent JSX tối ưu hóa code khi biên soạn, vì vậy nó chạy nhanh hơn so vớicode JavaScript tương đương

sẽ phát huy được vai trò của mình

2.4.2.3.Virtual DOM

Những Framework sử dụng Virtual-DOM như ReactJS khi Virtual-DOM thay đổi,chúng ta không cần thao tác trực tiếp với DOM trên View mà vẫn phản ánh được

Page 8 of 93

sự thay đổi đó Do Virtual-DOM vừa đóng vai trò là Model, vừa đóng vai trò là Viewnên mọi sự thay đổi trên Model đã kéo theo sự thay đổi trên View và ngược lại Cónghĩa là mặc dù chúng ta không tác động trực tiếp vào các phần tử DOM ở Viewnhưng vẫn thực hiện được cơ chế Data-binding Điều này làm cho tốc độ ứng dụngtăng lên đáng kể – môt lợi thế không thể tuyệt vời hơn khi sử dụng Virtula-DOM.

2.5 JSON WEB TOKEN [5]

2.5.1.Khái niệm

JSON Web Token (JWT) là một tiêu chuẩn mở (RFC 7519) định nghĩa mộtphương thức nhỏ gọn và khép kín để truyền tải thông tin an toàn giữa client và serverdưới dạng một JSON Các thông tin được truyền tải được đính kèm với một chữ kýđiện có thể xác minh tính đúng đắn do đó tạo ra sự tin cậy cho dữ liệu

Registered claims: Một tập hợp các claims đã được định nghĩa sẵn, chúng khôngbắt buộc nhưng được khuyến khích sử dụng để tạo ra token có ý nghĩa hơn Ví dụ iss(thời gian tạo token), exp (thời gian token hết hạn), sub (tiêu đề)

Public claims: Những thông tin mà chúng ta có thể tự định nghĩa ví dụ role,username, v.v Nhưng để tránh xung đột với các Registered claims chúng ta nên địnhnghĩa các claims được liệt kê trong IANA JSON Web Token Registry

Private claims: Đây cũng là những thông tin tự định nghĩa để chia sẽ thông tin giữa 2 bên truyền và nhận và được sự đồng ý của họ.

Signature

Để tạo ra một chữ ký chúng ta cần có encoded header, và encoded payload đãđược mã hóa ở trên cùng với một mã bí mật secret và một thuật toán được chỉ địnhtrong phần header để tạo ra chữ ký

Chữ ký được sử dụng để xác minh thông điệp không bị thay đổi trong quá trìnhtruyền nhận nhờ đó đảm bảo tính đúng đắn của dữ liệu Nếu ai đó cố gắng sửa thôngtin trong phần header hoặc payload để gửi mạo danh đến server (nơi tạo và ký token)thì quá trình xác nhận sẽ không hợp lệ

Page 10 of 93

CHƯƠNG 3: KHẢO SÁT HIỆN TRẠNG VÀ MÔ HÌNH HÓA

YÊU CẦU3.1 KHẢO SÁT HIỆN TRẠNG

3.1.1.TIX.VN

Hình 1 Trang TIX

Tix.vn là website hỗ trợ người dùng đặt vé xem phim trực tuyến tại các cụmrạp như BHD, Galaxy, CGV cực kỳ nhanh chóng và tiện lợi Với Tix.vn, bạn có thểmua vé mà không cần phải đến rạp phim sớm để xếp hàng chờ đợi hoặc lo lắng về vấn

đề hết vé Ngoài ra, Tix.vn thường xuyên cập nhật các thông tin mới nhất về trailer,suất chiếu sớm, các đánh giá phim và chương trình khuyến mãi từ rạp

- Đặt vé nhanh chóng, thanh toán tiện lợi và an toàn

- Cập nhật các phim đang hot, đang chiếu và sắp chiếu tại các cụm rạp

- Tích điểm đổi quà, ngập tràn ưu đãi

- Cập nhật tin tức, điện ảnh 24h nóng hổi cùng nhiều khuyến mãi hấp dẫn mỗingày

- Đăng nhập tài khoản để kiểm tra lịch sử giao dịch

Hình 2.Trang CGV

CJ CGV là một trong top 5 cụm rạp chiếu phim lớn nhất toàn cầu và là nhàphát hành, cụm rạp chiếu phim lớn nhất Việt Nam Mục tiêu của CJ CGV là trở thànhhình mẫu công ty điển hình đóng góp cho sự phát triển không ngừng của ngành côngnghiệp điện ảnh Việt Nam

Cgv.vn là trang web của CJ CGV có tính năng hỗ trợ khán giả mua vé xemphim và thanh toán online tại website với nhiều chương trình ưu đãi hấp dẫn

Ưu điểm:

- Xem những ưu đãi hấp dẫn dành riêng cho bạn

- Đặt vé dễ dàng ngay trên ứng dụng nhanh chóng, an toàn và tiện lợi

- Chọn rạp yêu thích

- Đăng nhập & xem thông tin tài khoản CGV Membership

- Chia sẻ thông tin về phim & ưu đãi với bạn bè qua mạng xã hội

Page 12 of 93

Hình 3 Trang BHD

Từ 2014, BHD Star Cineplex là cụm rạp của doanh nghiệp Việt Nam duy nhất

có sức phát triển mạnh mẽ, qua việc liên tục mở thêm các vị trí rạp mới, ở những khuvực đắc địa của Thành phố Hồ Chí Minh, Hà Nội, Huế và các tỉnh thành khác Vàhttps://www.bhdstar.vn/ là trang web trực tuyến của BHD Star Cineplex

Ưu điểm:

● Đặt trước ghế đẹp mà không phải xếp hàng tại rạp

● Đồng bộ hóa quyền lợi thành viên, đặt trước đồ ăn thức uống với ưu đãi đến 20%

● Quản lý tài khoản thành viên dễ dàng với lịch sử tích điểm qua từng giao dịch

● Cập nhật lịch chiếu và thông tin phim nhanh nhất

● Tra cứu vị trí rạp BHD Star gần bạn nhất

Hình 4 Trang GALAXYCINE

Galaxy Cinema đang ngày càng phát triển hơn nữa với các chương trình đặcsắc, các khuyến mãi hấp dẫn, đem đến cho khán giả những bộ phim bom tấn của thếgiới và Việt Nam nhanh chóng và sớm nhất Đến website galaxycine.vn, quý khách sẽ

dễ dàng mua được vé xem phim ưng ý, tại website luôn được cập nhật nhanh chóngcác phim hay nhất phim mới nhất đang chiếu hoặc sắp chiếu Lịch chiếu tại mọi hệthống rạp chiếu phim của Galaxy Cinema cũng được cập nhật đầy đủ hàng ngày hànggiờ trên trang chủ

Ưu điểm:

● Dùng tin nhắn lấy vé tại quầy vé của Galaxy Cinema hoặc quét mã QR

● Mục Góc Điện Ảnh - sở hữu lượng dữ liệu về phim, diễn viên và đạo diễn, giúp quý khách dễ dàng chọn được phim mình yêu thích

● Giới thiệu các phim sắp chiếu hot nhất trong mục Phim Hay Tháng để quý khách sớm có sự tính toán

● Mua vé nhanh chóng: rút gọn tối đa các bước mua vé, thời gian tải nội dung được tối ưu hơn

● Ticket Voucher và Movie Voucher nay có thể áp dụng mua vé trực tuyến

Page 14 of 93

Hình 5 Trang CINESTAR

Cinestar có các hệ thống rạp tại nhiều khu vực khác nhau trên toàn quốc Chính

vì thế chọn mua vé xem phim online trên website Cinestar.com.vn cũng vô cùng thuậntiện cho bạn Vì có thể lựa chọn được những rạp chiếu gần bạn Bên cạnh đó việc mua

vé xem phim trực tuyến tại Cinestar.com.vn cũng giúp bạn hưởng được nhiều ưu đãihơn khi mua trực tiếp tại quầy

● Ưu điểm:

- Đặt trước ghế đẹp, đồ ăn thức uống với nhiều ưu đãi

- Cập nhật sự kiện khuyến mãi, các suất chiếu sớm

- Quản lý tài khoản thành viên, đồng bộ quyền lợi với thẻ tích điểm

- Cập nhật lịch chiếu và thông tin phim nhanh nhất

- Tra cứu vị trí rạp Cinestar gần bạn nhất

3.1.6.KẾT LUẬN

Qua dữ liệu khảo sát được ở 5 trang đặt vé xem phim phổ biến nhất hiện nay,chúng em đã tổng hợp lại những yêu cầu chức năng cho đề tài “Xây dựng ứng dụngweb đặt vé xem phim” như sau:

- Đề tài là một nơi đặt vé trực tuyến nên chức năng chính đầu tiên cần quan tâm

đó là có thể nắm rõ thông tin phim, ngày và suất chiếu, cũng như chọn ghế ngồitheo ý thích

- Phát triển các tính Thêm, Xóa, Sửa cho người quản lý để quản lý các đối tượng như phim, lịch chiếu, …

- Ngoài ra thống kê số lượng khách hàng, lượng phim đang chiếu tại hệ thốngrạp

- Sau khi đăng nhập có thể xem thông tin tài khoản cá nhân, hoặc chỉnh sửa thông tin

cá nhân hoặc mật khẩu nếu cảm thấy cần thiết

- Đặt vé: Tiết kiệm được thời gian xếp hàng mua vé, việc thanh toán qua web diễn ra

an toàn và tiện lợi Mỗi đặt vé thì chỉ tối đa cho 8 ghế Người dùng có thể chọn phim,khung giờ và chỗ ngồi theo mong muốn Sau khi đặt vé thành công thì mã QR sẽ đượcgửi qua gmail đã đăng ký trước đó Có thể dùng điểm tích lũy để thực hiện thanh toán(1 điểm tương đương 1000 VNĐ)

- Người dùng có thể xem lại lịch sử giao dịch: ngày giờ, thông tin về vé và phim đã đặt Có thể yêu cầu đổi vé trước 1 tiếng 30 phút khi diễn ra lịch chiếu phim

khách hàng thành viên, mỗi lần thanh toán sẽ được tích lũy điểm thưởng bằng 5%tổng số tiền thanh toán

- Đăng xuất: Người dùng đăng xuất ra khỏi tài khoản đã đăng nhập

- Vào 8h sáng của ngày chiếu, mail nhắc nhở sẽ được gửi tới khách hàng đã mua

vé *Người quản lý trang:

- Sau khi đăng nhập vào tài khoản admin, admin có thể xem các thông tin của những tàikhoản người dùng, đồng thời có thể thực hiện chức năng tìm kiếm theo tên tài khoản

- Admin xem được thống kê về phim có vé bán chạy, tổng doanh thu, số lượng phim đang chiếu

Page 16 of 93

- Cập nhật thông tin phim: admin có thể chỉnh sửa các thông tin (hình ảnh, trailer, mô tả) của phim.

- Thêm phim mới: admin thêm vào những phim mới đồng thời có thể tạo các lịch chiếu cho phim Khi tạo lịch chiếu, tùy theo mỗi khung giờ tở các thứ trong tuần mà giá vé

sẽ được tạo khác nhau

- Xóa phim: admin xóa phim đã hết hạn chiếu

3.2.2 Yêu cầu phi chức năng

- Bảo mật: Mật khẩu sẽ được hash khi lưu trữ trong database

- Tính khả dụng: Phù hợp với nhu cầu; dễ dàng sử dụng

- Database có dung lượng lưu trữ dữ liệu lớn

3.3 MÔ HÌNH HÓA YÊU CẦU

67

89

Page 17 of 93

Bang 1 Chức năng người quản lý trang

3.3.1.2 Chức năng của Khách hàng

1

2

34

5

6

7

8910

11

Bang 2 Chức năng khách hàng

3.3.1.3 Chức năng của Khách hàng vãng lai

Page 18 of 93

1

2

Khách chưa có tài khoản

Xem thông tin v ề phim Xem lịch chiếu

Paypal

Hình 6 Lược đồ khách

Page 19 of 93