Khóa luận tốt nghiệp thiết kế và xây dựng website bán sách trực tuyến

PHẦN MỞ ĐẦU

TỔNG QUAN ĐỀ TÀI

Thiết kế và xây dựng website bán sách trực tuyến.

2 Tính cấp thiết của đề tài

Trong các ứng dụng ecommerce hiện nay, việc áp dụng thêm nền tảng website để làm trang quản lý các sản phẩm cho các nhà bán hàng đang trở nên dần rất thịnh hành, tạo cho người dùng một giao diện lớn hơn để có thể quản lý cùng với những tính năng bảo mật cao hơn do những nền tảng và phần mềm khác cung cấp cho các nền tảng website.

Hiện nay nhu cầu về mua sắm đang trở nên rất phổ biến, chỉ cần có một chiếc điện thoại có kết nối mạng mọi người cũng đã có thể mua sắm một cách vô cùng thoải mái chỉ bằng một cú nhấp, nên các sản thương mại điện tử là một nhu cầu không thể thiếu hiện tại.

3 Ý nghĩa khoa học và thực tiễn

Hệ thống quản lý sản phẩm, doanh thu, đơn hàng, thống kê dữ liệu cho phép những nhà bán hàng có thể theo dõi sát sao các hoạt động của mình, từ đó có thể làm cho các nhà bán hàng có cái nhìn đúng hơn về tâm lý khách hàng để có thể không ngừng cung cấp những mặt hàng thiết thực và có sự chú ý nhất.

Xây dựng được ứng dụng bán sách kết hợp với website quản trị giúp cho người dùng quản lý sản phẩm, đơn đặt hàng, thống kê, tạo cho các nhà bán hàng cũng như người dùng sử dụng một ứng dụng có trải nghiệm người dùng tốt nhất

Nghiên cứu Thiết kế và xây dựng ứng dụng bán sách kết hợp trang quản trị trên nền tảng website Tạo ứng dụng có tốc độ cao và thân thiện với người dùng

6 Phạm vi nghiên cứu Đề tài được thực hiện với quy mô 1 ứng dụng bán sách mô phỏng thực tế.

6.2 Front-End (Website bán sách)

Trong bài khóa luận này, em sử dụng phương pháp phân tích, phương pháp mô phỏng, phương pháp nghiên cứu thực tiễn làm phương pháp nghiên cứu chủ đạo nhằm làm rõ quy trình cách thức để có thể đặt hàng và quy trình quản lý, thanh toán qua Paypal, từ đó xây dựng ứng dụng bán sách trực tuyến.

KHẢO SÁT THỰC TRẠNG

- Đặc điểm: Tiki được biết đến là một trong những trang Thương mại điện tử hàng đầu tại Việt Nam Tiki với hàng triệu sản phẩm từ các thương hiệu lớn, với nhiều mặt hàng như điện tử, các thiết bị gia dụng, và nổi bật hơn hết là sách Khi mới bắt đầu kênh thương mại điện tử, Tiki chỉ kinh doanh sách và sau này khi mở rộng quy mô, Tiki bắt đầu tiếp tục với đa dạng mặt hàng hơn vời hàng nghìn danh mục cùng nhiều chương trình đặc biệt như Tiki Now 2h, Tiki Fresship Nhờ những đổi mới, phát triển đó đã giúp cho Tiki trở thành một kênh thương mại điện tử lớn của Việt Nam.

- Giao diện: Tiki với giao diện nổi bật với các tấm poster, chương trình Flash

Sale, đã giúp cho người dùng thu hút khi truy cập về hệ thống Không chỉ vậy, giao diện của Tiki cũng thay đổi theo mùa, theo các sự kiện.

- Tính năng: Tiki hỗ trợ người dùng thanh toán trực tuyến, ngoại tuyến Áp dụng những voucher cho các đơn hàng Dù phải tải lượng lớn dữ liệu, nhưng tốc độ truyền tải của Tiki nhanh.

- Hạn chế: Vì quá nhiều tính năng, giao diện phức tạp khiến cho người dùng khó tập trung tìm kiếm thứ họ cần Sản phẩm không hoàn toàn đảm bảo chính hãng như Tiki giới thiệu

- Giá sản phẩm của Tiki cao hơn so với các kênh thương mại điện tử như: Shopee, Sendo,

Hình 1.2: Trang chi tiết sản phẩm

2 Shopee (https://www.shopee.vn/)

- Giao diện: Đa dạng, nhiều màu sắc bắt mắt người dùng Nhiều Poster, hình ảnh giúp cho người dùng dễ nhận biết sản phẩm Tính Responsive của Shopee hầu như thỏa hết các thiết bị điện tử.

- Tính năng: có đầy đủ tính năng của một trang thương mại điện tử Bên cạnh đó, Shopee thường đưa ra các minigame, các chương trình ưu đãi nhằm thu hút khách hàng Shopee có nhiều chương trình giảm giá dựa trên khung giờ, dựa trên nhà bán hàng, dựa trên mặt,

- Hạn chế: Vì giao diện nhiều nên cũng ảnh hưởng đến tốc độ tải trang Bên cạnh đó vẫn còn một lỗi lỗi về responsive, ví dụ ở trang Địa chỉ nhận hàng,form chọn tỉnh thành bị tràn ra ngoài khiến cho người dùng không thể nhập được Shopee thường đưa ra nhiều thông báo mới, khiến cho người dùng vãng lai cảm thấy khó chịu và phải tắt thông báo Một số khách hàng thường phàn nàn về chất lượng của shopee vì khâu kiểm tra mặt hàng của Shopee

3 Sendo ( https://www.sendo.vn/ )

- Giao diện: Giao diện đồng nhất, ưa nhìn Giao diện của Sendo không nhiều các hiệu ứng, chuyển đồng và các thành phần làm nhiễu Sendo có giao diện thân thiện hơn với người dụng Việt.

- Tính năng: Sendo có đầy đủ các chức năng như các trang thương mại điện tử khác Người dùng dễ dàng thêm sản phẩm mình muốn vào giỏ hàng, chọn sản phẩm có giỏ hàng để đặt sản phẩm Các bước và chức năng dễ dàng thực hiện.

- Hạn chế: Sản phẩm không đa dạng như các trang thương mại điện tử khác:

Shopee, Tiki, Không nhiều sự kiện để thu hút người dùng Không có nhiều tính năng nổi trội như các trang thương mại điện từ khác Ví dụ: Shopee có Lắc xu, Tiki có giao hàng 2h.

4 Kết luận sau khi khảo sát

Qua quá trình khảo sát và phân tích các số liệu, các cơ sở dữ liệu, quy trình thao tác thanh toán online, quy trình đặt hàng, chúng ta có cái nhìn chung về mô hình mua bán sản phẩm của một trang thương mại điện tử Nhưng chúng ta chỉ mới nắm được tầm nhìn tổng quát, khi triển khai thì những vấn đề mới bắt đẩy nảy sinh Ví dụ khi ta đặt một đơn hàng gồm nhiều sản phẩm, nhà giao hàng sẽ giao nhiều lần, thay vì giao một lần, còn phải tùy thuộc vào loại sản phẩm người dùng đặt (dễ vỡ, hàng nhẹ, hàng nặng, hàng điện tử, còn hàng, sắp có,

CHỨC NĂNG HỆ THỐNG

Chức năng

Phía Người Dùng: (Website bán sách)

+Đăng nhập, đăng ký, quên mật khẩu, Google Login, đăng ký nhà bán hàng.

+ Quản lí tài khoản, Xem thông tin chi tiết, sửa thông tin cá nhân, Thay đổi mật khẩu.

+ Xem trang chủ, trang các nhà bán hàng, trang chi tiết sản phẩm, các sản phẩm tương tự, lọc sản phẩm theo danh mục, nhà bán hàng, tác giả, lọc theo giá.

+Tìm kiếm theo tên sản phẩm, danh mục sản phẩm, tác giả, nhà bán hàng.

+Xem giỏ hàng, thêm sản phẩm vào giò hàng, xóa sản phẩm khỏi giỏ hàng, công số lượng mua.

+Trang chi tiết thanh toán đơn hàng.

+Thanh toán: Thanh toán khi nhận hàng, thanh toán bằng Paypal.

+ Xem thông tin nhận hàng, thêm thông tin nhận hàng, chỉnh sửa thông tin nhận hàng, xóa thông tin nhận hàng, chọn thông tin nhận hàng mặc định

+ Xem danh sách đơn hàng, đơn hàng chờ xét duyệt, đơn hàng đã được xét duyệt, đơn đang giao, đơn hàng đã hoàn tất, đơn hàng đã hủy.

+ Chức năng đánh giá sản phẩm sau khi mua hàng.

+Quản lý danh mục sản phẩm: thêm, sửa danh mục

+Quản lý tài khoản người dùng: chặn người dùng

Phía Nhà Bán Hàng: (Admin Website)

+Đăng nhập, quên mật khẩu, google login.

+Quản lý sản phẩm: thêm sửa xóa sản phẩm, tìm kiếm sản phẩm theo tên, danh mục sản phẩm.

+Quản lý đơn hàng: xử lý đơn hàng, hủy đơn hàng

+Thống kê đơn hàng đã hoàn thành, doanh thu

Phía Người Giao Hàng: (Admin Website)

+Quản lý đơn hàng: xử lý đơn hàng, hủy đơn hàng, hủy đơn hàng khi bị khách hàng không nhận hàng.

Các chức năng của hệ thống

Bảng 2.1: Đặc tả các trang được thiết kế trên website bán sách

STT TÊN CHỨC NĂNG MÔ TẢ

1 Đăng nhập Người dùng đăng nhập vào hệ thống

2 Đăng ký Người dùng đăng ký tài khoản

3 Đăng ký nhà bán hàng Người dùng đăng ký trở thành nhà bán hàng của website

4 Quên mật khẩu Người dùng lấy lại mật khẩu

5 Google Login Người dùng đăng nhập bằng Google

6 Quản lí tài khoản Người dùng quản lí tài khoản

7 Xem thông tin chi tiết Người dùng xem thông tin cá nhân

8 Sửa thông tin cá nhân Người dùng sửa thông tin cá nhân

9 Thay đổi mật khẩu Người dùng thay đổi mật khẩu

10 Xem trang chủ Người dùng xem trang chủ

11 Tìm kiếm Người dùng tìm kiếm

12 Tìm kiếm theo tên sản Người dùng tìm kiếm sản phẩm phẩm

13 Tìm kiếm theo tên danh Người dùng tìm kiếm danh mục sản phẩm mục

14 Tìm kiếm theo tên nhà bán Người dùng tìm kiếm sản phẩm theo tên nhà bán hàng hàng

15 Tìm kiếm theo tên tác giả Người dùng tìm kiếm sản phẩm theo tên tác giả

16 Xem giỏ hàng Người dùng xem giỏ hàng

17 Thêm sản phẩm vào giỏ Người dùng thêm sản phẩm vào giò hàng hàng

18 Xóa sản phẩm khỏi giỏ Người dùng xóa sản phẩm khỏi giỏ hàng hàng

19 Xem thông tin nhận hàng Người dùng xem thông tin nhận hàng

20 Thêm thông tin nhận hàng Người dùng thêm thông tin nhận hàng

21 Chình sửa thông tin nhận Người dùng chỉnh sửa thông tin nhận hàng hàng

22 Xóa thông tin nhận hàng Người dùng xóa thông tin nhận hàng

23 Chọn thông tin nhận hàng Người dùng chọn thông tin nhận hàng mặc định mặc định

24 Xem danh sách đơn hàng Người dùng xem danh sách đơn hàng

25 Xem danh sách đơn hàng Người dùng xem danh sách đơn hàng chờ xét chờ xét duyệt duyệt

26 Xem danh sách đơn hàng Người dùng xem danh sách đơn hàng đã xét đã xét duyệt duyệt

27 Xem danh sách đơn hàng Người dùng xem danh sách đơn hàng đang giao đang giao

28 Xem danh sách đã hoàn tất Người dùng xem danh sách đã hoàn tất

29 Xem danh sách đơn hàng Người dùng xem danh sách đơn hàng đã hủy đã hủy

30 Đánh giá sản phẩm Người dùng đánh giá sản phẩm sau khi mua hàng

Bảng 2.2: Đặc tả các trang được thiết kế trên Admin Website

STT TÊN CHỨC NĂNG MÔ TẢ

1 Xem danh sách sản Nhà bán hàng xem danh sách sản phẩm của họ. phẩm

2 Đăng nhập Actor đăng nhập vào hệ thống Website

3 Đăng xuất Actor đăng xuất tài khoản khỏi hệ thống Website

4 Đăng ký seller Người dùng tạo tài khoản thông qua mã token được tạo ra khi đăng ký seller trên ứng dụng bán sách

5 Thêm sản phẩm Nhà bán hàng có thể thêm sản phẩm trực tiếp trên giao diện website

6 Xóa sản phẩm Nhà bán hàng có thể xóa những sản phẩm chưa được đặt hàng trực tiếp trên giao diện xem tất cả sản phẩm

7 Sửa sản phẩm Nhà bán hàng có thể sửa sản phẩm chi tiết và sửa nhanh sản phẩm trực tiếp trên giao diện xem tất cả sản phẩm

8 Xem danh sách đơn Nhà bán hàng và người giao hàng có thể xem danh hàng sách đơn hàng của họ.

9 Cập nhật trạng thái Nhà bán hàng và người giao hàng có thể cập nhật tình đơn hàng trạng đơn hàng (ordered, packed, shipped, deliveried)

10 Hủy đơn hàng Nhà bán hàng và người giao hàng có thể hủy đơn hàng, nếu nhận thấy những người đặt hàng không đáng tin cậy

12 Bom hàng Người giao hàng cập nhật trạng thái Bom hàng khi khách hàng không nhận hàng khi sản phẩm đã được giao đến người dùng.

11 Quản lý tài khoản Admin có thể quản lý các tài khoản có trong hệ thống,

Chặn người dùng và ép người dùng đăng nhập lại khi phát hiện người dùng có các hoạt động đáng nghi.

12 Thống kê đơn hàng Nhà bán hàng có thể xem các đơn hàng thành công, và đã thành công tổng doanh thu.

Vai trò người dùng

3.1 Đối với khách hàng (Website bán sách)

- Khách hàng có thể xem các sản phẩm, thông tin chi tiết của những cuốn sách

- Khách hàng có thể đăng ký tài khoản để trở thành thành viên của hệ thống để có thể mua sách và thao tác thanh toán

- Khách hàng có thể đăng nhập và đăng xuất tài khoản của mình

- Khách hàng dễ dàng xem thông tin các cuốn sách mình yêu thích, lựa chọn các cuốn sách phù hợp

- Lịch sử thanh toán được ghi lại trên hệ thống để đối soát

- Khách hàng có thể đánh giá sản phẩm khi mua hàng thành công

- Khách hàng có thể theo dõi tình trạng đơn hàng.

- Khách hàng có thể quản lí thông tin cá nhân, chỉnh sửa thông tin, thay đổi ảnh đại diện

- Khác hàng có thể cập nhật thông tin nhận hàng, xóa thông tin nhận hàng, lưu thông tin nhận hàng mặc định.

- Khách hàng có thể xem chi tiết đơn hàng thực hiện thanh toán.

- Xem được các lý do đơn hàng khi bị hủy.

3.2 Đối với quản trị viên (Admin Website)

- Quản lý và khóa tài khoản của các user đang có trong hệ thống

- Quản lý danh mục sản phẩm: thêm, sửa.

- Ép tài khoản đăng xuất khi thấy tài khoản khả nghi.

- Quản lý sản phẩm: thêm, sửa, xóa sản phẩm, tìm kiếm theo tên sản phẩm và danh mục sản phẩm của chính seller đó

- Quản lý đơn hàng: cập nhật tình trạng đơn hàng, hủy đơn hàng của chính nhà bán hàng đó.

- Xem danh sách các đơn hàng hoàn tất, xem tổng doanh thu.

-Quản lý đơn hàng: cập nhật tình trạng đơn hàng, hủy đơn hàng của chính, cập nhật trạng thái Bom hàng khi khách hàng không nhận hàng của người vận chuyển đó đó

PHÂN TÍCH VÀ THIẾT KÊ HỆ THỐNG

Use-case chung

Hình 3.1: Lược đồ Use Case

Đặc tả chi tiết từng Use case App bán sách

Bảng 3.1: Đặc tả Use case Đăng nhập

(1) Người dùng truy cập vào ứng dụng

(2) Người dùng chọn trang đăng nhập

(3) Ứng dụng hiển thị trang đăng nhập

(4) Người dùng điền tên tài khoản, mật khẩu [*]

(5) Người dùng nhấn “Đăng nhập”

(6) Ứng dụng kiểm tra email và password đã hợp lệ chưa (6a) Nếu có, tiếp tục

(6b) Nếu chưa, báo lỗi “Tài khoản hoặc mật khẩu không đúng” Quay lại bước 4

(7) Hệ thống xác thực thông tin đăng nhập [**]

(8) Hệ thống xác định vai trò của người dùng

(9) Hệ thống trả về trang chủ của người dùng và mở các phân quyền được phép truy cập của người dùng

[*] Hệ thống có thể chuyển sang trang đăng ký tài khoản và sau khi đăng ký thành công sẽ quay lại bước (3)

[**]Hệ thống xác nhận không thành công, hiển thị thông báo mô tả lý do xác thực sai và quay lại bước (3)

Guest Người dùng đã có tài khoản trong hệ thống Đăng nhập thành công: Người dùng được xác thực, vào trang chủ và nội dung trang chủ được trình bày

Exception Flow(s): Đăng nhập không thành công: Hiển thị thông báo đăng nhập không thành công.

Hình 3.2: Sequence diagram Đăng nhập website bán hàng 2.2 Usecase Đăng ký

Bảng 3.2: Đặc tả Use case Đăng ký

Short Description: Người dùng tạo tài khoản để đăng nhập vào ứng dụng và sử dụng các phân quyền của user

Post-Conditions: Người dùng tạo tài khoản thành công

Tài khoản đăng ký không thành công sẽ nhận thông báo lỗi, đăng ký lại.

(1) Người dùng truy cập vào ứng dụng.

(2) Người dùng vào trang tạo tài khoản

(3) Người dùng điền email, họ, tên, mật khẩu, nhập lại mật khẩu và xác nhận tạo tài khoản.

(4) Hệ thống kiểm tra email đã tồn tại trên cơ sở dữ liệu chưa

(4a) Nếu email đã tồn tại trên cơ sở dữ liệu thì báo lỗi Và quay lại lại bước

(5) Link kích hoạt tài khoản được hệ thống gửi đến email Người dùng nhập click vào đường dẫn để thực hiện kích hoạt tài khoản.

Exception Flow(s): Hệ thống xác nhận đăng ký không thành công vì email hoặc tên tài khoản đã tồn tại, hiển thị thông báo và đăng kí lại.

Hình 3.3: Sequence diagram Đăng ký

Bảng 3.3: Đặc tả Use case Xem trang chủ

Use Case Xem trang chủ

Short Description: Người dùng xem những nội dung trên trang chủ.

Post-Conditions: Hiển thị trang chủ

(1) Người dùng truy cập vào ứng dụng.

(2) Hệ thống trả về dữ liệu để hiện thị

Exception Flow(s): Người dùng không sử dụng kết nối trực tuyến, hệ thống báo lỗi.

Hình 3.4: Sequence diagram Xem trang chủ

Bảng 3.4: Đặc tả Use case Quên mật khẩu

Use Case Quên mật khẩu

Short Người dùng quên mật khẩu và muốn lấy lại mật khẩu

Post-Conditions: Người dùng đổi thành công mật khẩu

(1) Người dùng vào giao diện login (*)

(2) Người dùng nhấn vào “Forgot Password”, trang “Forgot Password” hiển thị.

(3) Người dùng nhập email tài khoản và nhấn “Send”

(4) Hệ thống kiểm tra email có tồn tại trên cơ sở dữ liệu không

(4a) Nếu không tồn tại, hệ thống thông báo “Email not exists” Quay lại bước 3.

(4b) Nếu tồn tại, hệ thống sẽ gửi link reset password đến email của người dùng

(5) Người dùng click đường dẫn để được dẫn tới trang reset password

(6) Người dùng nhập “Password” và “Confirm Password” sau đó bấm “Reset Password” để thực hiện việc đổi mật khẩu

(7) Hệ thống thực hiện việc xác thức token và kiểm tra token đã hết hạn hay chưa

(7a) Nếu toke không hợp lệ và hết hạn, thông báo “Token invalid” Quay lại bước 2.

(7b) Nếu thỏa mãn, hệ thống thực hiển đổi mật khẩu và chuyển người dùng về giao diện Login.

[ Người dùng thoát khỏi Usecase, quá trình đổi mật khẩu không thành công.

- (7b) Hệ thống báo lỗi không thay đổi được mật khẩu.

Hình 3.5: Sequence diagram Quên mật khẩu 2.5 Usecase Google Login

Bảng 3.5: Đặc tả Google Login

Short Description: Người dùng truy cập giao diện đăng nhập

Pre-Conditions: Người dùng có tài khoản google

Post-Conditions: Đăng nhập thành công: Người dùng được xác thực, được chuyển đến giao diện trang chủ theo đúng phân quyền của người dùng

(1) Người dùng truy cập vào trang đăng nhập của Admin website

(2) Người dùng chọn “Continue with Google Login”

(3) Website chuyển hướng người dùng đến giao diện đăng nhập của google

(4) Người dùng nhập thông tin đăng nhập

(5) Đăng nhập thành công, người dùng được chuyển đến giao diện trang chủ

Exception Flow(s): Đăng nhập không thành công: Người dùng không được chuyển về giao diện đăng nhập

Hình 3.6: Sequence Google login 2.6 Usecase Quản lí tài khoả n

Bảng 3.6: Quản lí tài khoản

Use Case Quản lí tài khoản

Short Description: Hiển thị thông tin cá nhân của người dùng.

Pre-Conditions: Người dùng đã đăng nhập thành công.

Post-Conditions: Hiển thị thông tin cá nhân người dùng.

(1) Người dùng vào ứng dụng

(2) Người dùng vào trang thông tin cá nhân tài khoản [*]

(3) Trang cá nhân hiển thị.

2.7 Usecase Xem thông tin chi tiết

Bảng 3.7: Đặc tả Use case Xem thông tin chi tiết

Use Case Xem thông tin chi tiết

Short Description: Xem thông tin chi tiết của người dùng

Post-Conditions: Hiển thị thông tin chi tiết cá nhân người dùng.

(4) Người dùng nhấn vào ảnh đại diện.

(5) Trang thông tin người dùng hiển thị.

[ Người dùng thoát ra khỏi trang cập nhật không tiếp tục cập nhật thông tin nữa.

Exception Flow(s): Người dùng nhập thông không phù hợp với rule về mặc đồng bộ dữ liệu Hệ thống đưa ra thông báo mô tả lý do và nhập lại thông tin.

Hình 3.7: Sequence diagram Xem thông tin chi tiết

2.8 Usecase Sửa thông tin cá nhân

Bảng 3.8: Đặc tả Use case Sửa đổi thông tin cá nhân

Use Case Sửa thông tin cá nhân

Short Description: Sửa thông tin cá nhân của người dùng.

Post-Conditions: Thông tin cá nhân thay đổi.

(4) Người dùng nhấn vào ảnh đại diện.

(5) Trang thông tin người dùng hiển thị.

(6) Người dùng chỉnh sửa thông tin

(7) Kiểm tra thông tin người dùng chỉnh sửa có hợp lệ không (7a) Nếu có, tiếp tục.

(7b) Nếu không, quay về bước 6.

(8) Người dùng nhấn “Lưu thay đổi”

(9) Thông tin được gửi đến hệ thống, ảnh đại diện gửi đến server lưu trữ tệp tin Kiểm tra công việc thành công không

(9a) Nếu thành công, quay về cá nhân

(9b) Nếu thất bại, quay về trang cá nhân

[ Người dùng thoát ra khỏi trang cập nhật không tiếp tục cập nhật thông tin nữa.

Hình 3.8: Sequence diagram Sửa thông tin cá nhân

2.9 Usecase Thay đổi mật khẩu

Bảng 3.9: Đặc tả Use case Thay đổi mật khẩu

Use Case Thay đổi mật khẩu

Short Người dùng thay đổi mật khẩu

Pre-Conditions: Người dùng đã đăng nhập vào hệ thống

Post-Conditions: Người dùng thay đổi mật khẩu thành công.

(2) Người dùng nhấn vào trang cá nhân

(4) Người dùng nhấn vào “Đổi mật khẩu”

(5) Trang đổi mật khẩu hiển thị.

(6) Người dùng nhập Mật khẩu cũ, mật khẩu mới, nhập lại mật khẩu mới.

(7) Ứng dụng kiểm tra mật khẩu đã hợp lệ chưa,

(7b) Nếu không, hiển thị lỗi, quay lại bước (6) [*]

(8) Gửi thông tin đến hệ thống để thay đổi mật khẩu Chờ kết quả.

(8a) Nếu thành công, thông báo đổi mật khẩu thành công.

(8b) Nếu thất bại, thông báo “Mật khẩu cũ không đúng” Quay lại bước (6)

(9) Quay về trang cá nhân.

Hình 3.9: Sequence diagram Thay đổi mật khẩu

Bảng 3.10: Đặc tả Use case Tìm kiếm

Post-Conditions: Hiển thị các nội dung phù hợp với nội dung người dùng tìm kiếm

(2) Người dùng nhấn vào thanh tìm kiếm

(3) Người dùng nhập nội dung vào thanh tìm kiếm

(4) Hệ thống trả về nội dung phù hợp với nội dung người dùng nhập

(5) Người dùng nhấn vào một trong những nội dung hoăc người dùng bấm

“Tiếp tục” thì chuyển đến trang chi tiết tìm kiếm

Hình 3.10: Sequence diagram Tìm kiếm

2.11 Usecase Tìm kiếm theo tên sản phẩm

Bảng 3.11: Đặc tả Use case Tìm kiếm theo tên sản phẩm

Use Case Tìm kiếm theo tên sản phẩm

Hình 3.11: Sequence diagram Tìm kiếm theo tên sản phẩm

2.12 Usecase Tìm kiếm theo tên danh mục

Bảng 3.12: Đặc tả Use case Tìm kiếm theo tên sản phẩm

Use Case Tìm kiếm theo tên sản phẩm

Hình 3.12: Sequence diagram Tìm kiếm theo tên danh mục

2.13 Usecase Thêm sản phẩm vào giỏ hàng

Bảng 3.13: Đặc tả Use case Thêm sản phẩm vào giỏ hàng

Use Case Thêm sản phẩm vào giỏ hàng

Short Description: Thêm sản phẩm vào giỏ hàng

Pre-Conditions: Người dùng đã đăng nhập với quyền User.

Post-Conditions: Sản phẩm được thêm vào giỏ hàng hàng thành công.

(1) Người dùng đang ở trang sản phẩm

(2) Người dùng nhấn thêm vào giỏ hàng

(3) Hệ thống ghi nhận thêm sản phẩm vào giỏ hàng của người dùng Kiểm tra kết quả

(3a) Nếu thành công, thông báo thành công

(3b) Nếu thất bại, thông báo thất bại.

Hình 3.13: Sequence diagram Thêm sản phẩm vào giỏ hàng

Bảng 3.14: Đặc tả Use case Xem giỏ hàng

Use Case Xem giỏ hàng

Short Description: Xem các sản phẩm trong giỏ hàng.

Pre-Conditions: Người dùng đã đăng nhập

Post-Conditions: Hiển thị giỏ hàng của người dùng

(1) Người dùng đã vào ứng dụng

(2) Người dùng nhấn vào biểu tượng giỏ hàng

(3) Chuyển người dùng đến trang giỏ hàng [*]

(4) Hệ thống lấy dữ liệu giỏ hàng

(5) Hiển thị nội dung trang giỏ hàng

Alternate Flow(s): [*] Người dùng quay về, nội dung trang giỏ hàng chưa được hiển thị.

Hình 3.14: Sequence diagram Xem giỏ hàng

2.15 Usecase Xóa sản phẩm khỏi giỏ hàng

Bảng 3.15: Đặc tả Use case Xóa sản phẩm khỏi giỏ hàng

Use Case Xóa sản phẩm khỏi giỏ hàng

Short Description: Xóa sản phẩm khỏi giỏ hàng

Post-Conditions: Sản phẩm trong giỏ hàng của người dùng được xóa.

(2) Chuyển người dùng đến trang giỏ hàng

(4) Hiển thị nội dung trang giỏ hàng [*]

(5) Vuốt sản phẩm muốn xóa sang phải, nhấn vào “Xóa”

(6) Hệ thống xóa sản phẩm khỏi giỏ hàng

Alternate Flow(s): [*] Người dùng quay về, sản phẩm trong giỏ hàng chưa được xóa.

Hình 3.15: Sequence diagram Xóa sản phẩm khỏi giỏ hàng 2.16 Usecase Mua sản phẩ m

Bảng 3.16: Đặc tả Use case Mua sản phẩm

Use Case Mua sản phẩm

Short Description: Tạo đơn hàng từ các sản phẩm đã chọn, khi tạo đơn người dùng lựa chọn những lựa chọn do hệ thống đưa ra: địa chỉ nhận hàng, số điện thoại, phương thức thanh toán

Post-Conditions: Người dùng chuyển đến trang mua sản phẩm với những sản phẩm người dùng đã chọn.

(5) Người dùng nhấn chọn những sản phẩm muốn tạo đơn hàng

(7) Kiểm tra người dùng đã chọn ít nhất một sản phẩm chưa

(7b) Nếu không, thông báo “Người dùng chưa chọn sản phẩm) Quay về bước (5)

(8) Trang tạo đơn hàng hiển thị [**]

Alternate Flow(s): [*] [**] Người dùng thoát ra khỏi Usecase, trang tạo đơn hàng không hiển thị.

Bảng 3.17: Đặc tả Use case Thanh toán

Short Description: Lựa chọn phương thức thanh toán đơn hàng

Pre-Conditions: Người dùng đã đăng nhập, người dùng đang ở trang tạo đơn hàng

Post-Conditions: Đơn hàng được đặt thành công.

(5) Người dùng nhấn chọn những sản phẩm muốn tạo đơn hàng

(7) Kiểm tra người dùng đã chọn ít nhất một sản phẩm chưa

(7b) Nếu không, thông báo “Người dùng chưa chọn sản phẩm” Quay về bước (5)

(8) Người dùng điển đầy đủ các thông tin mà ứng dụng yêu cầu “địa chỉ nhận hàng, phương thức thanh toán”

(9) Người dùng nhấn “Đặt hàng”

(10)Ứng dụng kiếm tra người dùng đã nhập đầy đủ thông tin chưa

(10b) Nếu không, thông báo người dùng nhập thiếu Quay lại bước (8)

(11) Kiểm tra người dùng chọn thanh toán khi nhận hàng đúng không?

(11a) Nếu có, hệ thống ghi nhận tạo đơn đặt hàng.

(11b) Nếu không, hệ thống tạo đơn đặt hàng để thanh toán bằng paypal.

(11b2) Chuyển đến trang web Paypal mà hệ thống gửi đến

(11b3) Người dùng thanh toán hóa đơn trên trang web Paypal[*]

(11b4) Người dùng thanh toán xong, quay về lại ứng dụng

(11b5) Hệ thống kiểm tra hóa đơn đã được thanh toán thành công chưa

(11b5a) Nếu có, thông báo “Thanh toán Paypal thành công” Chuyển đến trang Tạo đơn hàng thành công Kết thúc Usecase.

(11b5b) Nếu không, báo lỗi “Thanh toán Paypal chưa thành công”

(12)Hệ thống kiểm tra đơn hàng đã tạo đơn hàng thành công chưa

(12a) Nếu có, thông báo tạo đơn thành công Quay về trang Tạo đơn hàng thành công

(12b) Nếu không, thông báo lỗi hệ thống.

Alternate Flow(s): [*] Người dùng quay về khi chưa thanh toán, ứng dụng báo đơn hàng thanh toán không thành công.

2.18 Usecase Xem thông tin nhận hàng

Bảng 3.18: Đặc tả Use case Xem thông tin nhận hàng

Use Case Xem thông tin nhận hàng

Short Description: Xem thông tin nhận hàng bao gồm địa chỉ, số điện thoại người nhận.

Post-Conditions: Trang thông tin nhận hàng hiển thị.

(1) Người dùng đã mở ứng dụng

(2) Người dùng nhấn trang cá nhận

(3) Trang cá nhân hiển thị

(4) Người dùng nhấn vào trang địa chỉ

(5) Trang địa chỉ hiện thị.

(6) Hệ thống lấy dữ liệu từ cơ sở dữ liệu, hiển thị địa chỉ lên màn hình.

Hình 3.17: Sequence diagram Xem thông tin nhận hàng

2.19 Usecase thêm thông tin nhận hàng

Bảng 3.19: Đặc tả Use case Thêm thông tin nhận hàng

Use Case Thêm thông tin nhận hàng

Short Description: Người dùng thêm thông tin nhận hàng của mình.

Pre-Conditions: Người dùng đã đăng nhập với quyền User

Post-Conditions: Hệ thống thêm thành công địa chỉ mới của người dùng.

(1) Người dùng đang ở trang địa chỉ

(2) Người dùng nhấn vào “Thêm địa chỉ”

(3) Ứng dụng kiểm tra người dùng lưu ít hơn 3 địa chỉ không

(3b) Nếu không, thông báo người dùng “Một tài khoản chỉ lưu trữ được tối đa 3 địa chỉ”

(4) Chuyển đến trang Thêm địa chỉ

(5) Người dùng nhập đủ và hợp lệ các thông tin [*]

(6) Kiểm tra người nhập đủ và hợp lệ các thông tin chưa

(6a) Nếu có, nút “Thêm địa chỉ” hiện sáng Tiếp tục

(6b) Nếu không, nút “Thêm địa chỉ” hiện tối đi Quay về bước (5).

(7) Người dùng nhấn vào nút “Thêm địa chỉ”

(8) Hệ thống lưu địa chỉ người dùng vừa mới thêm.

(9) Chuyển đến trang Xem thông tin nhận hàng

(10) Hệ thống lấy dữ liệu mới của các địa chỉ nhận hàng của người dùng

(1) Hiển thị các địa chỉ nhận hàng của người dùng, bao gồm địa chỉ người dùng mới thêm.

Alternate Flow(s): [*] Người dùng quay về, địa chỉ mới không được thêm vào

Hình 3.18: Sequence diagram Thêm thông tin nhận hàng

2.20 Usecase Chỉnh sửa thông tin nhận hàng

Bảng 3.20: Đặc tả Use case Chỉnh sửa thông tin nhận hàng

Use Case Chỉnh sửa thông tin nhận hàng

Short Description: Người dùng chỉnh sửa thông tin nhận hàng của mình.

Post-Conditions: Hệ thống chỉnh sửa thành công địa chỉ mới của người dùng.

(1) Người dùng đang ở trang thanh toán

(2) Người dùng nhấn vào “icon địa chỉ”

(3) Ứng dụng kiểm tra người dùng lưu ít hơn 3 địa chỉ không

(3b) Nếu không, thông báo người dùng “Một tài khoản chỉ lưu trữ được tối đa 3 địa chỉ”

(4) Nhấn “Add address” để thêm địa chỉ mới

(5) Người dùng nhập đủ và hợp lệ các thông tin [*]

(6) Kiểm tra người nhập đủ và hợp lệ các thông tin chưa

(6a) Nếu có, click nút “Save” để thực hiện thêm địa chỉ mới Tiếp tục

(6b) Nếu không, thông báo lỗi đến người dùng Quay về bước (5).

(7) Hiển thị các địa chỉ nhận hàng của người dùng, bao gồm địa chỉ người dùng mới thêm.

Alternate Flow(s): [*] Người dùng quay về, địa chỉ mới không được thêm vào

2.21 Usecase Chọn thông tin mặc định

Bảng 3.21: Đặc tả Use case Chọn thông tin mặc định

Use Case Chọn thông tin mặc định

Short Description: Người dùng chỉnh sửa thông tin nhận hàng của mình.

Post-Conditions: Hệ thống chỉnh sửa thành công địa chỉ mới của người dùng.

(1) Người dùng đang ở trang thanh toán

(2) Người dùng nhấn vào “iCon địa chỉ”

(3) Ứng dụng show danh sách địa chỉ đã được thêm.

(3a) Nếu không có địa chỉ nào thực hiện việc thêm địa chỉ mới

(3b) Nếu có địa chỉ, click “set default” để thực hiện chọn địa chỉ mặc định

(4) Ứng dụng sẽ lấy địa chị mặc định vừa chọn, làm địa chỉ nhận hàng mặc định

Alternate Flow(s): [*] Địa chỉ không được tự động chọn ở trang thanh toán.

Hình 3.19: Sequence diagram Chọn thông tin mặc định

Bảng 3.22: Đặc tả Use case Xem trang seller

Use Case Xem trang seller

Short Description: Người dùng xem thông tin và các sản phẩm của Seller

Post-Conditions: Hiển thị trang Seller

(1) Người dùng đang ở trang có hiển thị sản phẩm

(2) Người dùng nhấn vào sản phẩm

(3) Chuyển đến trang chi tiết của sản phẩm

(4) Người dùng nhấn vào ảnh đại diện hoặc thông tin của Seller

(6) Hệ thống lấy thông tin của Seller.

(7) Hiển thị thông tin của Seller.

Alternate Flow(s): [*] Người dùng quay về, địa chỉ không bị thay đổi.

Hình 3.20: Sequence diagram Xem trang seller

2.23 Usecase Quản lí đơn hàng

Bảng 3.23: Đặc tả Use case Quản lí đơn hàng

Use Case Quản lý đơn hàng

Short Description: Hiển thị trang Quản lí đơn hàng, giúp người dùng dễ dàng theo dõi đơn hàng

Post-Conditions: Trang quản lí đơn hàng hiển thị

(1) Người đã mở ứng dụng

(3) Ứng dụng chuyển đến trang cá nhân

(4) Người dùng nhấn vào trang Đơn hàng

(5) Người dùng chuyển đến trang Đơn hàng

(6) Hệ thống lấy dữ liệu các đơn hàng

(7) Hiển thị nội dung các đơn hàng.

2.24 Usecase Xem danh sách đơn hàng đã đặt

Bảng 0.24: Đặc tả Use case Xem danh sách đơn hàng đã đặt

Use Case Xem danh sách đơn hàng đã đặt

Short Description: Hiển thị trang các đơn hàng đã đặt

Post-Conditions: Hiển thị các đơn hàng đã đặt

(8) Hiển thị các đơn hàng đã đặt

Hình 3.21: Sequence diagram Xem danh sách đơn hàng

2.25 Usecase Xem danh sách đơn hàng đã hủy

Bảng 3.25: Đặc tả Use case Xem danh sách đơn hàng đã hủy

Use Case Xem danh sách đơn hàng đã hủy

Short Description: Hiển thị trang các đơn hàng đã hủy

Post-Conditions: Hiển thị các đơn hàng đã hủy

(8) Người dùng nhấn vào “Đã hủy”

(9) Hiển thị các đơn hàng đã hủy

Hình 3.22: Sequence diagram Xem danh sách đơn hàng bị hủy

2.26 Usecase Xem đơn hàng đang giao

Bảng 3.26: Đặc tả Use case Xem danh sách đơn hàng đang giao

Use Case Xem danh sách đơn hàng đang giao

Short Description: Hiển thị trang các đơn hàng đang giao

Post-Conditions: Hiển thị các đơn hàng đang giao

(8) Người dùng nhấn vào “Đang giao”

(9) Hiển thị các đơn hàng đang giao

2.27 Usecase Xem đơn hàng hoàn tất

Bảng 3.27: Đặc tả Use case Xem danh sách đơn hàng hoàn tất

Use Case Xem danh sách đơn hàng hoàn tất

Short Description: Hiển thị trang các đơn hàng hoàn tất

Post-Conditions: Hiển thị các đơn hàng hoàn tất

(8) Người dùng nhấn vào “Đã giao”

(9) Hiển thị các đơn hàng đã giao

2.28 Usecase Xem đơn hàng chờ xét duyệt

Bảng 3.28: Đặc tả Use case Xem danh sách đơn hàng chờ xét duyệt

Use Case Xem danh sách đơn hàng chờ xét duyệt

Short Description: Hiển thị các đơn hàng chờ xét duyệt

Post-Conditions: Hiển thị các đơn hàng chờ xét duyệt

(8) Người dùng nhấn vào “Chờ xác nhận”

(9) Hiển thị các đơn hàng chờ xác nhận

2.29 Usecase Xem đơn hàng đã xác nhận

Bảng 3.29: Đặc tả Use case Xem danh sách đơn hàng đã xác nhận

Use Case Xem danh sách đơn hàng đã xác nhận

Short Description: Hiển thị các đơn hàng chờ xét duyệt

Post-Conditions: Hiển thị các đơn hàng chờ xét duyệt

(8) Người dùng nhấn vào “Chờ xác nhận”

(9) Hiển thị các đơn hàng chờ xác nhận

Đặc tả chi tiết từng Use case Admin Website

Bảng 3.30: Đặc tả Use case Đăng nhập

Short Description: Người dùng đăng nhập vào Admin Website

Pre-Conditions: Người dùng đã có tài khoản trong hệ thống

Post-Conditions: Đăng nhập thành công: Người dùng được xác thực, vào trang chủ và nội dung trang chủ được trình bày.

(1) Người dùng truy cập vào Admin Website

(2) Người dùng chọn trang đăng nhập

(3) Website hiển thị trang web đăng nhập

(4) Người dùng điền tên tài khoản, mật khẩu theo đúng format có ít nhất 8 ký tự, có ít nhất một ký tự đặc biệt[*]

(5) Hệ thống xác thực thông tin đăng nhập [**]

(6) Hệ thống xác định vai trò của người dùng

(7) Hệ thống trả về trang chủ của người dùng và mở các phân quyền được phép truy cập của người dùng

[ Hệ thống có thể chuyển sang trang đăng ký tài khoản và sau khi đăng ký thành công sẽ quay lại bước (3)

[**]Hệ thống xác nhận không thành công, hiển thị thông báo mô tả lý do xác thực sai và quay lại bước (3)

Exception Flow(s): Đăng nhập không thành công: Người dùng không thể truy cập vào giao diện trang quản lý

Hình 3.23: Sequence diagram đăng nhập

Use case Đăng nhập

Bảng 3.31 Đặc tả Use case Quên mật khẩu

Use Case Quên mật khẩu

Short Description: Người dùng quên mật khẩu cần đổi lại mật khẩu mới để thực hiện đăng nhập

Pre-Conditions: Người dùng đã có tài khoản trong hệ thống

Post-Conditions: Thay đổi mật khẩu thành công, người dùng nhận được thông báo và đăng nhập lại thành công

(1) Người dùng chọn Forgot password trên giao diện đăng nhập

(2) Người dùng được chuyển đến giao diện xác nhận Email để điền tài khoản Email (3) Hệ thống xác thực Email đã nhập, mã OTP được gửi về Email của người dùng (4) Người dùng được chuyển đến giao diện Security Code để nhập mã OTP xác thực

(5) Mã OTP chính xác người dùng được chuyển đến trang Reset password để thực hiện việc đổi mật khẩu [*]

(6) Người dùng nhập mật khẩu mới [**]

(7) Thay đổi mật khẩu thành công người dùng được chuyển về trang đăng nhập

Note: Hệ thống sử dụng External Server thực hiện việc gửi Email theo hướng sự kiện nên người dùng không cần phải đợi việc send email được diễn ra thành công

[ Người dùng không nhận được mã OTP, Mã OTP hết hạn, người dùng có thể yêu cầu gửi lại mã OTP ngay trên giao diện Security Code

[ Người dùng không nhập đúng định dạng mật khẩu, hệ thống xác thực yêu cầu người dùng nhập lại mật khẩu

Exception Flow(s): Người dùng thoát khỏi giao diện nhập OTP, người dùng thoát khỏi trang reset password.

(1) Người dùng thực hiện đăng ký tài khoản seller trên App bán sách, sau đó hệ thống sẽ gửi link đăng ký tài khoản thông qua email của người dùng

(2) Người dùng truy cập link đăng ký seller và được chuyển đến giao diện đăng ký seller trên admin website

Người dùng đăng ký tài khoản seller thành công, và có thể sử dụng được trang admin website với phân quyền seller Post-Conditions:

Người dùng đã xác nhân đăng ký tài khoản seller ở App bán sách

Người dùng đăng ký tài khoản seller thông qua link được gửi vào hộp thư email của người dùng

Hình 3.24: Sequence diagram Quên mật khẩu

Bảng 3.32: Đặc tả Use case Đăng ký seller Admin website ăng ký

(3) Người dùng thực hiện điền các thông tin theo đúng format của ứng dụng đã yêu cầu [*]

(4) Người dùng bấm nút đăng ký để thực hiện đăng ks

(5) Đăng ký thành công người dùng được chuyển về giao diện đăng nhập

[*] Người dùng nhập sai định dạng hệ thống yêu cầu người dùng nhập lại

Exception Flow(s): Người dùng thoát khỏi giao diện đăng ký seller, mã token bị hết hạn sau 24h

Hình 3.25: Sequence diagram Đăng ký seller

Bảng 3.33: Đặc tả Use case Đăng xuất

Short Description: Người dùng đăng xuất tài khoản khỏi hệ thống

Pre-Conditions: Người dùng đã đăng nhập vào hệ thống

Post-Conditions: Người dùng đăng xuất thành công, giao diện được chuyển về trang login

(1) Người dùng chọn Logout trên header của giao diện web

(2) Người dùng đăng xuất thành công, giao diện được chuyển về trang login [*]

[ Người dùng không được chuyển về trang login mà được chuyển về trang logout của hệ thống

Hình 3.26: Sequence diagram Đăng xuất

Bảng 3.34: Đặc tả Use case Google login

Short Description: Người dùng đăng nhập vào Admin Website

Pre-Conditions: Người dùng có tài khoản google

Post-Conditions: Đăng nhập thành công: Người dùng được xác thực, được chuyển đến giao diện trang chủ theo đúng phân quyền của người dùng

(1) Người dùng truy cập vào trang đăng nhập của Admin website

(2) Người dùng chọn “Continue with Google Login”

(3) Website chuyển hướng người dùng đến giao diện đăng nhập của google

(4) Người dùng nhập thông tin đăng nhập

(5) Đăng nhập thành công, người dùng được chuyển đến giao diện trang chủ

Exception Flow(s): Đăng nhập không thành công: Người dùng không được chuyển về giao diện đăng nhập

Hình 3.27: Sequence diagram Google login

Người dùng có thể xem tất cả sản phẩm đã và đăng đăng bán trên App bán sách

Người dùng đã đăng nhập vào hệ thống với phân quyền seller

Seller có thể xem tất cả các sản phẩm đang đăng bán trên App bán sách

(1) Người dùng truy cập vào trang quản lý sản phẩm

(2) Bảng danh sách các sản phẩm của người dùng được hiện ra, nếu người dùng chưa đăng bán sản phẩm nào sẽ hiển thị bảng với thông báo “data empty”

Hình 3.28: Sequence diagram Xem danh sách sản phẩm

Use case Xem danh sách sản phẩm

Bảng 3.35: Đặc tả Use case Xem danh sách sản phẩm

Xem danh sách sản phẩm

3.7 Use case Thêm sản phẩm

Bảng 3.36: Đặc tả Use case Thêm sản phẩm

Use Case Thêm sản phẩm

Short Description: Seller thực hiện thêm sản phẩm

Pre-Conditions: Người dùng đã đăng nhập vào hệ thống với phân quyền seller

Post-Conditions: Người dùng thêm sản phẩm thành công, người dùng được chuyển đến trang quản lý sản phẩm để xem sản phẩm vừa được thêm

(1) Người dùng truy cập vào trang thêm sản phẩm (Add product)

(2) Người dùng thực hiện nhập thông tin sản phẩm theo đúng yêu cầu của hệ thống [*]

Alternate Flow(s): [*] người dùng nhập sai, hệ thống sẽ không cho người dùng thêm sản phẩm

Hình 3.29: Sequence diagram Thêm sản phẩm

3.8 Use case Sửa sản phẩm

Bảng 3.37: Đặc tả Use case Sửa sản phẩm

Use Case Sửa sản phẩm

Short Description: Seller thực hiện sửa chi tiết một sản phẩm

Post-Conditions: Sản phẩm được cập nhật đúng các trường mà người dùng đã sửa, hệ thống chuyển đến trang quản lý sản phẩm để xem thông tin vừa được sửa

(1) Người dùng truy cập vào trang xem sản phẩm chọn chức năng “Edit” trên sản phẩm muốn sửa

(2) Giao diện chỉnh sửa sản phẩm được hiện lên với các thuộc tính cũ của sản phẩm (3) Người dùng thực hiên sửa những trường mong muốn

(4) Bấm nút “Save” để thực hiện lưu thông tin chỉnh sửa.

Exception Flow(s): người dùng refresh trang trong lúc chỉnh sửa khiến hệ thống không lưu lại được các trường vừa thay đổi

Hình 3.30: Sequence diagram Sửa sản phẩm

3.9 Use case Xóa sản phẩm

Bảng 3.38: Đặc tả Use case Xóa sản phẩm

Use Case Xóa sản phẩm

Short Description: Seller thực hiện xóa sản phẩm trực tiếp trên giao diện quản lý sản phẩm

Post-Conditions: Người dùng xóa sản phẩm thành công, sản phẩm không được hiện ở trang quản lý sản phẩm, hệ thống thông báo xóa sản phẩm thành công

(1) Người dùng truy cập vào trang xem danh sách sản phẩm (Products)

(2) Người dùng chọn chức năng “Delete”, hệ thống xuất hiện giao diện confirm xóa (3) Người dùng chọn “ok” để thực hiện xóa sản phẩm [*]

(4) Sản phẩm sẽ không được hiển thị trên giao diện xem danh sách sản phẩm

Note: Người dùng chỉ có thể xóa những sản phẩm chưa có người nào đặt hàng, hoặc sản phẩm chưa có bất kỳ lượt mua nào

Alternate Flow(s): [*] Sản phẩm đã có đơn đặt hàng, sản phẩm đã được bán ra trước đó, hệ thống sẽ không cho người dùng xóa sản phẩm, xuất hiện thông báo cho người dùng

Hình 3.31: Sequence diagram Xóa sản phẩm

(1) Người dùng truy cập vào trang xem danh sách đơn hàng

(2) Hệ thống sẽ hiển thị “data empty” nếu người dùng không có đơn hàng nào

Người dùng đã đăng nhập vào hệ thống với phân quyền seller hoặc shipper

Hệ thống hiển thị đúng các đơn đặt hàng của người dùng

Seller hoặc shipper xem tất cả các đơn hàng đã được đặt hàng từ những người mua hàng

3.10 Use case Xem danh sách đơn hàng

Bảng 3.39: Đặc tả Use case Xem danh sách đơn hàng

Xem danh sách đơn hàng

Hình 3.32: Sequence diagram Xem danh sách đơn hàng

Người dùng đã đăng nhập vào hệ thống với phân quyền seller hoặc shipper Đơn hàng hủy thành công hệ thống thông báo cho người dùng

Seller hoặc shipper có thể hủy đơn hàng, khi đơn hàng đang chờ xác nhận từ seller hoặc shipper

(1) Người dùng truy cập vào trang xem danh sách đơn hàng

(2) Chọn chức năng “cancel” để thực hiện hủy đơn hàng

[*](3) Hệ thống thông báo cho người dùng

Alternate Flow(s): [*] sản phẩm đã được xác nhận lên đơn từ người dùng sẽ không được xóa, hệ thống sẽ xuất hiện cảnh báo cho người dùng

Hình 3.33: Sequence diagram Hủy đơn hàng

3.11 Use case Hủy đơn hàng bởi nhà bán hàng

Bảng 3.40: Đặc tả Use case hủy đơn hàng bởi nhà bán hàng

3.12 Xem danh sách tài khoản

Bảng 3.41: Đặc tả Use case Xem danh sách tài khoản

Use Case Xem danh sách tài khoản

Short Description: Admin xem danh sách tài khoản đang có trong hệ thống

Pre-Conditions: Người dùng đã đăng nhập vào hệ thống với phân quyền admin

Post-Conditions: Danh sách tài khoản được hiển thị

(1) Người dùng truy cập vào trang xem danh sách tài khoản (Users)

(2) Hệ thống sẽ xuất hiện “data empty” nếu trang web chưa có người dùng nào

Hình 3.34: Sequence diagram Xem danh sách sản phẩm

Bảng 3.42: Đặc tả Use case Chặn tài khoản

Use Case Chặn tài khoản

Short Description: Admin chặn tài khoản người dùng, khi phát hiện tài khoản đáng nghi

Post-Conditions: Tài khoản bị chặn người dùng không thể đăng nhập được nữa, cần liên hệ admin để mở khóa

(1) Người dùng truy cập vào trang xem danh sách tài khoản (Users)

(2) Chọn chức năng “block” trên tài khoản đáng nghi

(3) Hệ thống cập nhật trạng thái cho tài khoản bị chặn

Hình 3.35: Sequence diagram Chặn tài khoản

3.14 Xem danh mục sản phẩm

Bảng 3.43: Đặc tả Use case Chặn tài khoản

Use Case Xem danh mục sản phẩm

Short Description: Admin đến trang quản lý danh mục sản phẩm

Post-Conditions: Admin có thể xem được hết tất cả các danh mục sản phẩm hiện có trên trang web

(1) Người dùng truy cập vào trang xem danh mục sản phẩm (Categories)

3.15 Thêm danh mục sản phẩm

Bảng 3.44: Đặc tả Use case thêm danh mục sản phẩm

Use Case Thêm danh mục sản phẩm

Post-Conditions: Admin có thể thêm danh mục sản phẩm trưc tiếp trên trang quản lí sản phẩm

(3) Điền danh mục muốn thêm

(4) Bấm nút “save” để lưu danh mục

3.16 Sửa danh mục sản phẩm

Bảng 3.45: Đặc tả Use case sửa danh mục sản phẩm

Use Case Sửa danh mục sản phẩm

Post-Conditions: Admin có thể sửa tên danh mục trực tiếp trên giao diện quản lý danh mục.

(2) Bấm nút “Edit” trên danh mục cần sửa đổi

(3) Điền danh mục muốn thêm

(4) Bấm nút “save” để cập nhật danh mục mới.

3.17 Hủy đơn hàng bời người giao hàng

Bảng 3.46: Đặc tả Use case hủy đơn hàng bởi người giao hàng

Use Case Hủy đơn hàng bởi người giao hàng

Short Description: Shipper đến trang quản lý đơn hàng (Orders)

Pre-Conditions: Người dùng đã đăng nhập vào hệ thống với phân quyền shipper.

Post-Conditions: Shipper có thể hủy đơn hàng vì một số lý do nào đó.

(1) Shipper truy cập vào trang xem danh mục đơn hàng

(2) Bấm nút “Cancel” vào đơn hàng cần hủy

(3) Điền lý do hủy đơn hàng

(4) Bấm nút “OK” để thực hiện hủy đơn hàng.

Bảng 3.47: Đặc tả Use case bom hàng

Short Description: Shipper đến trang quản lý đơn hàng (Orders)

Pre-Conditions: Người dùng đã đăng nhập vào hệ thống với phân quyền shipper.

Post-Conditions: Shipper có thể báo trạng thái bom hàng khi khách hàng không nhận hàng.

(1) Shipper truy cập vào trang xem danh mục đơn hàng

(2) Bấm nút “Client Reject” vào đơn hàng cần hủy

(3) Điền lý do hủy đơn hàng

(4) Bấm nút “OK” để thực hiện hủy đơn hàng.

Thiết kế giao diện Website bán sách

Hình 3.37: Giao diện đăng nhập

Description Giao diện form đăng nhập

Screen Access Người dùng truy cập vào ứng dụng

Email Textbox - Người dùng điền tên email để đăng nhập

String Email đúng định dạng Email

Textbox - Người dùng điền mật khẩu để đăng nhập

Password String Mật khẩu có ít nhất 8 ký tự, bao gồm 1 ký tự chữ, 1 ký tự đặc biệt, 1 ký tự số

Khi người dùng nhập đầy đủ thông

Login Button tin, bấm “Login” để hoàn tất quá trình đăng nhập.

Forgot Button Chuyển đến trang quên mật khẩu. password

Icon google Button Để thực hiện đăng nhập bằng tài khoản login google

Sign up Button Chuyển đến trang Đăng ký

Action Name Description Success Failure

- Khi người dùng chưa nhập đầy đủ thông tin tài khoản thì hệ thống đưa ra thông báo:

“Tài khoản hoặc mật Người dùng khẩu không hợp lệ” Bấm “Login” để đăng nhập và nhập đúng tên và ở bên dưới Textbox Đăng nhập mật khẩu thì sẽ tài khoản. bắt đầu sử dụng hệ thống vào được hệ - Khi người dùng nhập sai tên đăng thống. nhập hoặc mật khẩu thì hệ thống đưa ra thông báo: “Tài khoản mật khẩu không đúng.” ở bên dưới Textbox mật khẩu.

Hình 3.368: Giao diện đăng ký tài khoản user

Description Giao diện form đăng ký

Screen Access Người dùng truy cập ứng dụng

Email Textbox - Người dùng điền tên email

Textbox - Người dùng điền mật khẩu để đăng ký

Password String Mật khẩu có ít nhất 8 ký tự, bao gồm 1 ký tự chữ, 1 ký tự đặc biệt, 1 ký tự số

Confirm String “Nhập lại mật khẩu” khớp với “Mật password khẩu”

Name String Người dùng điền tên

Gender Select Người dùng chọn giới tính

Birth Date DatePicker Người dùng chọn ngày thánh năm sinh

I agree with the Checkbox Người dùng nhấn vào checkbox để policy đồng ý với điều khoản

Khi người dùng nhập đầy đủ thông

Sign Up Button tin, bấm “Sign up” để tiếp tục quá trình đăng ký Screen Actions

- Người dùng - Khi người dùng chưa nhập đầy đủ nhập email chưa thông tin tài khoản tồn tại (đăng ký) thì hệ thống đưa ra trên hệ thống thì thông báo. sẽ chuyển đến - Khi người dùng bước tiếp theo nhập email đã tồn tại Sign Up Bấm “Sign Up” để tiếp tục - Người dùng trên hệ thống, ứng quá trình Đăng ký tài khoản dụng sẽ đưa ra thông được chuyển về báo: “Email đã được trang Home để đăng ký”. thực hiện Login

- Hệ thống gửi email kích hoạt tài khoản.

Hình 3.39: Trang quên mật khẩu - Nhập email - Bước 1

Screen Trang quên mật khẩu – Nhập Email – Bước 1

Description Người dùng nhập email để hệ thống gửi mã OTP đến email.

Người dùng truy cập ứng dụng, người dùng đến trang đăng nhập Người Screen Access dùng nhấn vào quên mật khẩu.

String Người dùng nhập email của tài khoản

Email người dùng đã quên mật khẩu Yêu dữ liệu nhập vào đúng định dạng là email.

Send Button Người dùng nhấn phím “Send” Hệ thống sẽ kiểm tra mã email có tồn tại trên hệ thống không Nếu có, email sẽ gửi đừng link reset password đến email đó Nếu không, ứng dụng sẽ báo “Email không tồn tại”.

- Người dùng - Thông báo “Email nhập email đã không tồn tại” tồn tại trên hệ thống (đã đăng ký tài khoản bằng email này) thì hệ thống sẽ Send Bấm “Send” để tiếp tục quá gửi đường dẫn reset password trình quên mật khẩu đến email người dùng đã nhập.

- Tiếp theo chuyển đến trang Reset Password để thực hiện đổi mật khẩu.

Hình 3.40: Trang quên mật khẩu – Reset Password - Bước 2

Screen Trang quên mật khẩu –Reset Password – Bước 3

Description Người dùng đổi mật khẩu

Sau khi người dùng nhập email hợp lệ ở trang Quên mật khẩu Người

Screen Access dùng truy cập đường dẫn trong email do hệ thống gửi đến, người dùng sẽ được chuyển đến trang Reset Passoword để thực hiện đổi mật khẩu mới.

String Người dùng điền mật khẩu để đăng nhập

Password Mật khẩu có ít nhất 8 ký tự, bao gồm 1 ký tự chữ, 1 ký tự đặc biệt, 1 ký tự số

Confirm String “Confirm password” phải trùng với passoword “Password”

- Hệ thống kiểm - Hệ thống kiểm tra tra mật khẩu mới mật khẩu mới, nếu có hợp lệ không không hợp lệ Hệ Nếu có, hệ thống thống sẽ trả lỗi về.

Bấm “Reset Password” hoàn - Ứng dụng sẽ hiển

Reset Password ghi nhận mật tất quá trình Quên mật khẩu khẩu người dùng thị lỗi. được thay đổi.

- Quay về giao diện trang chủ.

4.4 Trang chủ tìm kiếm gợi ý

Hình 3.41: Chức năng tìm kiếm gợi ý

Description Người dùng muốn tìm kiếm sản phẩm theo nhà bán hàng, danh mục, tên sản phẩm, tác giả

Screen Access Người dùng đang ở trang chủ và truy cập đến thanh tìm kiếm Người dùng nhấn vào thanh tìm kiếm.

Search TextField Người dùng nhập nội dung mong muốn tìm kiếm Screen Actions

Hệ thống tìm - Ứng dụng không Sau khi người dùng ngừng kiếm những nội thực hiện dung liên quan Search nhập liệu, hệ thống sẽ trả về đến nội dung nội dung tìm kiếm liên quang. người dùng nhập và trả về kết quả.

4.5 Trang chủ danh mục sản phẩm

Hình 3.42: Danh mục sản phẩm

Description Người dùng muốn tìm kiếm sản phẩm theo danh mục sản phẩm.

Screen Access Người dùng đang ở trang chủ và truy cập đến danh mục sản phẩm.

Select Pop-up Người dùng hover đến từng mục để truy cập action tương ứng Screen Actions

Khi người dùng - Ứng dụng không hover đến đâu có thực hiện.

Header danh mục sản phẩm kết quả tương - Khi click người Danh mục sản giúp người dùng tìm kiếm ứng tới đó, khi dùng không được chuyển đến trang nhanh theo chủng loại sản người dùng click phẩm phẩm và truy cập một số trang chuyển người tương ứng. nổi bật của website dùng đến các action tương ứng.

4.6 Trang chủ slider sản phẩm bán chạy

Hình 3.45: Slider sản phẩm bán chạy

Screen Trang chủ sản phẩm bán chạy

Description Người dùng được hiển thị những sản phẩm bán chạy nhất của website. Screen Access Người dùng đang ở trang chủ.

Danh sách sản List Hiển thị danh sách sản phẩm bán chạy phẩm bán chạy nhất hiện tại, mặc định 10 sản phẩm.

- Hệ thống hiện - Chức năng không thị được sản thực hiện. phẩm - Bấm nút chuyển

Website hiển thị 10 sản phẩm - Người dùng tiếp slide không Slide show bán chạy nhất theo dạng slide hiển thị sản phẩm show click slide tiếp theo. chuyển tiếp các sản phẩm tiếp theo.

Chức năng thên sản phẩm vào - Sản phẩm - Sản phẩm không Add to basket giỏ hàng, người dùng chọn loại được thêm vào được thêm vào giỏ sản phẩm để thêm vào giỏ hàng giỏ hàng hàng.

Thêm sản phẩm vào danh mục - Sản phẩm - Sản phẩm không

Add to wishlist được thêm vào được thêm vào sản phẩm yêu thích danh mục wishlist. wishlist

4.7 Trang chủ sản phẩm mới ra mắt

Hình 3.46: Sản phẩm mới ra mắt

Screen Trang chủ sản phẩm mới ra mắt

Description Người dùng được hiển thị sản phẩm mới ra mắt đến từ các nhà bán hàng.

Screen Access Người dùng đang ở trang home.

Top 3 sản sản Product Hiển thị danh sách phẩm mới nhất của website.

Click tiêu đề sản Chuyển đến trang chi tiết Chuyển đến - Không có gì xảy ra trang chi tiết sản phẩm của sản phẩm đó. phẩm.

- Được chuyển - Không có gì xảy ra Chuyển đến trang tổng hợp đến trang sản phẩm của seller Click vào seller các sản phẩm của nhà bán hàng đó đó.

Người dùng được chuyển - Người dùng - Người dùng không được chuyển đến được chuyển trang Click vào tác giả đến các sản phẩm của tác trang các sản - Các sản phẩm hiển giả đó phẩm của tác giả thị khác với tác giả đã được chọn. đó.

Screen Tất cả các trang

Description Footer website nơi hiển thị top 3 nhà bán hàng có số lượng sách đang bán nhiều nhất, hiển thị các thông tin liên quan đến trang web, các chính sách cũng như bản quyền của trang web.

Screen Access Người dùng thấy footer ở mọi trang

Top 3 seller List Hiển thị top 3 nhà bán hàng có số lượng sách bán nhiều nhất.

Người dùng - Không có gì xảy Click vào nhà Người dùng sẽ được chuyển được chuyển ra đến trang sản phẩm của nhà bán đến trang nhà - Sản phẩm hiển thị bán hàng hàng đó bán hàng đã không phải của nhà bán hàng được chọn. chọn.

Hình 3.48: Trang quản lý thông tin cá nhân

Description Hiển thị thông tin cơ bản của người dùng và các lựa chọn.

Screen Access Người dùng đang ở trang Home Người dùng nhấn vào biểu tưởng thông tin cá nhân, và chọn vào profile.

Upload photo TextFile Upload avatar

Date of birth TextField Nhập ngày tháng năm sinh

Gender Radio Chọn giới tính

Email address TextField Hiển thị email

Submit Button Người dùng cập nhật thông tin mới

Clear Button Người dùng trở về giao diện Home

Cập nhật thông tin mới của Thông tin được - Dữ liệu không

Submit thay đổi theo dữ được cập nhật. người dùng liệu vừa nhập.

Người dùng được chuyển về Người dùng - Không có gì xảy

Clear được chuyển về ra. trang Home trang Home

4.10 Trang hiển thị các nhà bán hàng

Hình 3.49: Trang hiển thị các nhà bán hàng

Screen Trang hiển thị các nhà bán hàng.

Description Trang hiển thị các nhà bán hàng của website.

Screen Access Người dùng chọn click vào sellers trên header của trang website

Hệ thống - Không có gì xảy Người dùng được chuyển đến chuyển đến ra

Click vào nhà trang các sản - Sản phẩm hiện sai trang các sản phẩm của nhà bán bán hàng phẩm của nhà so với nhà bán hàng đó bán hàng được hàng được chọn chọn

4.11 Trang hiện thị tất cả các sản phẩm

Hình 3.50: Trang hiển thị tất cả các sản phẩm

Screen Trang hiện thị tất cả sản phẩm.

Description Người dùng thấy được các sản phẩm của các nhà bán hàng khác nhau. Screen Access Khi dùng click vào best selling trên header website.

Search TextField Người dùng search sản phẩm theo tên và tác giả

Price Pop-up Hiện thị form tìm kiếm sản phẩm theo giá

Sort Select Sắp xếp sản phẩm theo thời gian đăng bán.

Show Select Phân trang sản phẩm

Thiết kế giao diện Administrator Website

Hình 3.64: Giao diện Đăng nhập

Description Giao diện form đăng nhập

Screen Access Người dùng truy cập trang web

Textbox - - Người dùng điền tên email để đăng

- Email đúng định dạng Email

Textbox - - Người dùng điền mật khẩu để đăng

- Mật khẩu có ít nhất 8 ký tự, bao gồm 1 ký tự chữ, 1 ký tự đặc biệt, 1 ký tự số

- Khi người dùng nhập đầy đủ thông

Login Button tin, bấm “login” để hoàn tất quá trình đăng nhập.

Forgot password Button - Chuyển đến trang quên mật khẩu.

Continue with Button - Để thực hiện đăng nhập bằng tài khoản google google

Khi người dùng chưa nhập đầy đủ thông tin tài khoản thì hệ thống đưa ra thông báo: “Email is Người dùng required or Email not Bấm “Login” để đăng nhập nhập đúng tên và valid” ở bên dưới Đăng nhập mật khẩu thì sẽ Textbox tài khoản. và bắt đầu sử dụng hệ thống vào được hệ - Khi người dùng nhập sai tên đăng thống. nhập hoặc mật khẩu thì hệ thống đưa ra thông báo: “Email or password is wrong.” ở bên dưới Textbox mật khẩu.

Hình 3.65: Giao diện Quên mật khẩu

Description Giao diện form đăng ký seller

Screen Access Người dùng truy cập trang web thông qua link đăng ký seller ở Email của người dùng Screen Content

Shop Name Textbox - - Người dùng điền tên shop

String - Trường không được để trống

Textbox - - Người dùng nhập số điện thoại

Phone String - Phone không được để trống

- Phone không chứa ký tự chữ

- Người dùng nhập slogan của Shop

Slogan Textbox - - Trường không được để trống

Social link Textbox - - Nhập các link mạng xã hội của Seller

String - Trường không bắt buộc

Logo Input - File - Để thực hiện việc upload logo của shop

- Người dùng không upload logo hệ thống tự động thiết lập ảnh mặc định cho Shop

Genuine Store Input – - Để thực hiện việc upload những bằng

Multiple chứng để admin có thể phê duyệt shop là

File gian hàng chính hãng, để nhận được các tín nhiệm từ người dùng Terms of User Link - Để xem một số chính sách của seller

Privacy Policy Link - Chính sách ứng dụng

Sign Up Seller Button - Thực hiện đăng ký seller

- Thành công tài khoản được chuyển về giao diện Login

Here link - Trở về giao diện login khi người dùng tạm thời không muốn đăng ký tài khoản seller nữa

- Khi người dùng chưa nhập đầy đủ thông tin đăng ký seller: hệ thống thông báo lỗi ngay ở Người dùng bên dưới trường đó.

- Khi người dùng sử nhập đúng thông dụng một số thủ Bấm “Sign Up Seller” để hoàn tin các trường thuật để vượt qua lớp Đăng ký thành việc đăng ký tài khoản trong form đăng kiểm tra trên giao seller ký, theo đúng diện, các trường sẽ các rules của được gửi về server, trang web server sẽ thực hiện kiểm tra các trường một lần nữa và gửi thông báo lỗi về phía giao diện của người dùng thông qua pop- up.

Hình 3.66: Giao diện Quên mật khẩu

Description Giao diện form nhập xác nhận email

Screen Access Người dùng click vào button forgot password trên giao diện Login để được chuyển đến trang confirm email Screen Content

Textbox - - Người dùng điền tên email để nhận mã

Email String OTP gửi từ hệ thống

- Email đúng định danh email

Send Button - Người dùng thực hiện gửi yêu cầu reset password

Back Link - Chuyển người dùng về trang Login

Bấm “Send” để hoàn thành Người dùng -Người dùng được được chuyển đến chuyển đến giao diện việc xác thực tài khoản, để hệ Đăng ký giao diện nhập OTP những mã OTP thống cho phép thay đổi mật mã OTP xác không được gửi về khẩu thực tài khoản email của người dùng

Description Giao diện cập nhật mật khẩu mới

Screen Access Người dùng nhập đúng mã OTP xác thực hệ thống chuyển người dùng đến giao diện reset password Screen Content

TextBox - - Người dùng nhập mật khẩu mới

Password String - Mật khẩu ít nhất 8 ký tự, bao gồm 1 ký tự chữ, 1 ký tự số, 1 ký tự đặc biệt

Confirm TextBox - - Người dùng nhập xác nhận mật khẩu

String - Confirm password phải trùng với

Reset password Button - Thực hiện reset password

- Token reset password hết hạn sau Người dùng 24h, hệ thống thông báo lỗi, yêu cầu nhận thông báo người dùng thực hiện Nhập đủ password và confirm từ hệ thống, lại quá trình quên password hệ thống thực hiện người dùng được

Reset password mật khẩu reset password cho người chuyển đến giao - Người dùng thay dùng diện Login để đổi mật khẩu thành thực hiện Login công, nhưng mật vào hê thống khẩu mới không đăng nhập được vào hệ thống

5.5 Xem danh sách sản phẩm (Products Page)

Hình 3.68: Giao diện Xem danh sách sản phẩm (Products Page)

Screen Xem danh sách sản phẩm

Description Giao diện quản lý sản phầm của seller

Screen Access Người dùng đã đăng nhập vào hệ thống với phân quyền seller, truy cập vào Shop chọn Products để vào page Screen Content

Button - Người dùng thực hiện chức năng chỉnh

Edit Details sửa chi tiết cho một sản phẩm

- Giao diện sẽ được chuyển đến trang Edit Details

Delete Button - Thực hiện xóa một sản phẩm

Sản phẩm được - Sản phẩm hiển hiển thị đúng với không phải của seller seller, nếu người đó

Xem danh sách Chọn button products để thực dùng chưa tạo sản phẩm hiện xem danh sách sản phẩm sản phẩm nào, giao diện sẽ hiển thị “Data

5.6 Thêm sản phẩm (Add Product)

Hình 3.69: Giao diện Thêm sản phẩm – thông tin cơ bản - 1

Hình 3.70: Giao diện thêm sản phẩm – thông tin chi tiết - 2

Description Giao diện thêm một sản phẩm mới cho seller

Screen Access Người dùng đã đăng nhập vào hệ thống với phân quyền seller, truy cập vào Add Product để thực hiện thêm một sản phẩm Screen Content

Textbox - - Người dùng nhập tên sản phẩm

String - Name không được để trống

Textbox - - Người dùng nhập tác giả sách

String - Author không được để trống

Publisher Textbox - - Người dùng nhập nhà xuất bản

String - Publisher không được để trống

Print length Textbox - - Người dùng nhập độ dài sách

Publication Select - Chọn ngày xuất bản của sách

Date - Publication không được để trống

Select Select - Chọn ngôn ngữ sách

Language - Ngôn ngữ không được để trống

Price String - Price có định dạng số

- Price không được để trống

Type Select - Chọn loại sản phẩm : E-Book,

Category Select - Chọn danh mục sách

- Category không được để trống

Discount Textbox - - Nhập giảm giá sản phẩm

Quantity Textbox - - Nhập số lượng sản phẩm

String - Quantity không được để trống

Textbox - - Trường không bắt buộc

Description String - Người dùng nhập mô tả chi tiết cho sản phẩm

Input – - Trường không bắt buộc mặc định là

Multiple multiple ảnh default của hệ thống upload File - Người dùng có thể upload nhiều hình ảnh cùng một lúc

Textbox - - Nhập địa chỉ sách

String - City không được để trống

Hệ thống chuyển - Sản phẩm không người dùng đến được thêm khi hệ giao diện quản lý thống thông báo đã Thêm sản Chọn button “save” để thực sản phẩm và thêm thành công

- Thêm thành công phẩm hiện thêm sản phẩm thông báo cho giao diện không người dùng thêm tài khoản thành chuyển về trang quản lý tài khoản công

5.7 Sửa sản phẩm (Edit Product)

Hình 3.71: Giao diện Sửa sản phẩm

Description Giao diện sửa sản phẩm hiện ra, vẫn lấy ra các thông tin cũ của sản phẩm

Screen Access Người dùng đã đăng nhập vào hệ thống với phân quyền seller, truy cập vào xem danh sách sản phẩm chọn sản phẩm cần chỉnh sửa Screen Actions

Hệ thống cập - Sản phẩm không nhật những được cập nhật khi hệ thông tin mới và thống thông báo đã dữ nguyên sửa thành công

- Sửa thành công những thông tin nhưng giao diện không thay đổi,

Chọn button “save” để thực không chuyển về

Sửa sản phẩm hệ thống chuyển hiện sữa sản phẩm trang quản lý tài người dùng về khoản giao diện xem danh sách sản phẩm và thông báo cho người dùng

5.8 Xem danh sách đơn hàng (Orders Page)

Hình 3.72: Giao diện Xem danh sách trạng thái đơn hàng

Screen Xem danh sách trạng thái đơn hàng

Description Cung cấp giao diện quản lý các đơn đặt hàng của seller

Screen Access Người dùng đã đăng nhập vào hệ thống với phân quyền seller, truy cập vào xem danh sách đơn hàng Screen Content

Product Textbox - - Tên sản phẩm đặt hàng

Quantity Textbox - - Số lượng đặt hàng

Name Text - Hiển thị người đặt hạng

Meta Text - Hiện thị thông tin mua hàng và cancel của người đặt hàng

Address Text - Địa chỉ nhận hàng

Amount Paid Text - Tổng số tiền phải trả cho đơn hàng

Payment Type Text - Loại thanh toán (Cod, Paypal)

Inventory Text - Số lượng hàng còn lại trong kho

Ordered at Text - Thời điểm đặt hàng

Text - Trạng thái đơn hàng

- Ordered: Đã đặt hàng thành công

(được xác nhận và chưa được xác nhận từ seller)

- Packed: Đã đóng gói (đóng xong or chưa)

Status - Shipped: Nhận giao hàng (chờ xác nhận từ shipper)

- Delivered: Đang giao hàng (đã giao xong or chưa)

- Mỗi trang thái sẽ có isCompleted để xác định trạng thái đã hoàn thành hay chưa

Details Button - Button chuyển người dùng đến thông tin chi tiết của đơn hàng

Button - Xác nhận trạng thái đơn hàng hiện tại

Confirm - Vd: Ordered là trạng thái đặt hàng thành công, nhưng chưa có sự chấp nhận từ seller Screen Actions

Hệ thống hiển - Đơn hàng hiển thị Xem danh sách Chọn Orders để xem danh thị tất cả đơn nhầm seller đơn hàng sách sản phẩm hàng của seller đó

5.9 Cập nhật trạng thái đơn hàng (Orders Page)

Hình 3.73: Giao diện cập nhật trạng thái đơn hàng

Hình 3.74: Hủy đơn hàng bởi nhà bán hàng

Screen Cập nhật trạng thái đơn hàng

Description Người dùng cập nhật tình trạng đơn hàng ngay trên giao diện quản lý đơn hàng

Screen Access Người dùng đã đăng nhập vào hệ thống với phân quyền seller, truy cập vào xem danh sách đơn hàng Screen Content

Product Textbox - Tên sản phẩm đặt hàng

Quantity Textbox - Số lượng đặt hàng

Name Text - Hiển thị người đặt hạng

Meta Text - Hiện thị thông tin mua hàng và cancel của người đặt hàng

Amount Paid Text - Tổng số tiền phải trả cho đơn hàng

Payment Type Text - Loại thanh toán (Cod, Paypal)

Inventory Text - Số lượng hàng còn lại trong kho

- Ordered: Đã đặt hàng thành công

Status - Shipped: Nhận giao hàng (chờ xác nhận từ shipper)

Chọn “Confirm” để xác định Hệ thống chuyển - Đơn hàng không status lên một được thay đổi trạng bạn chắc chắn muôn cập nhật

Cập nhật trạng trạng thái, thông thái đặt hàng trạng thái, sau đó bấm OK để thái đơn hàng báo người dùng, thực hiện cập nhật, cancel để cập nhật đơn huy thao tác cập nhật hàng thành công

5.10 Thống kê đơn hàng hoàn tất (Orders Page)

Hình 3.75: Giao diện thống kê đơn hàng hoàn tất

Screen Thống kê đơn hàng và doanh thu

Description Nhà bán hàng xem lại các đơn đã giao hàng thành công và doanh thu hiện tại.

Screen Access Người dùng đã đăng nhập vào hệ thống với phân quyền seller, truy cập vào seller dashboard

5.11 Xem danh sách đơn hàng - shipper (Orders Page)

Hình 3.76: Giao diện xem danh sách đơn hàng của Shipper

Hình 3.77: Giao diện các hành động khi Shipper chấp nhận đơn hàng

Screen Xem danh sách đơn hàng của shipper

Description Người dùng xem tất cả các đơn giao hàng trên giao diện

Screen Access Người dùng đã đăng nhập vào hệ thống với phân quyền shipper, truy cập vào xem danh sách đơn hàng Screen Content

Product Textbox - Tên sản phẩm đặt hàng

Quantity Textbox - Số lượng đặt hàng

Total pay Text - Hiển thị số tiền cần phải thu hộ

Status - Ordered: Đã đặt hàng thành công

- Shipped: Nhận giao hàng (chờ xác nhận từ shipper)

Bấm confirm để xác nhận Hệ thống hiện - Đơn hàng hiển thị

Cập nhật đơn thị trạng thái tiếp nhầm shipper chuyển tiếp hành động tiếp hàng theo của đơn - Sản phẩm nhầm theo hàng trạng thái

Hủy đơn hàng - Xóa không thành thành công, đơn công

Hủy đơn hàng Người vận chuyển hủy đơn hàng xóa khỏi hàng danh sách đơn hàng của người vận chuyển

Báo bom hàng, - Xóa không thành và xóa đơn hàng công Bom hàng Người nhận hàng không ra khỏi danh nhận hàng sách đơn hàng của người vận chuyển

5.12 Quản lý người dùng (Admin)

Hình 3.78: Giao diện quản lý tài khoản

Screen Giao diện quản lý tài khoản

Description Người quản trị có thể xem tất cả các tài khoản đang có trong hệ thống

Screen Access Người dùng đã đăng nhập vào hệ thống với phân quyền admin, truy cập vào trang quản lý Users

Block tài khoản và ép tất cả Tài khoản bị - Không xảy ra gì block và không Block các tài khoản của user này có tài khoản nào logut còn login

Hình 3.79: Giao diện quản lý categories

Hình 3.80: Giao diện thêm một danh mục mới

Screen Giao diện thêm một danh mục mới

Description Người quản trị có thể xem tất cả các danh mục sản phẩm đang có trong hệ thống

Screen Người dùng đã đăng nhập vào hệ thống với phân quyền admin, truy Access cập vào trang quản lý categories

Add Pop-up thêm danh mục hiện Danh mục được thêm - Danh mục ra, người quản trị chỉ cần thêm thất bại. category mới vào bảng điền danh mục cần thêm

Người quản trị chỉnh sửa tên Chỉnh sửa thành công, - Tên danh

Edit tên danh mục được mục không danh mục chuyển đổi về tên mới được thay đổi

Class Diagram

Bảng 3.48 Đặc tả Class Diagram

STT Tên Collection Ý nghĩa Quan hệ

1 Users Collection quản lý các thông tin Reference Sellers và quyền của một user có trong hệ thống

2 Sellers Collection quản lý các thông tin của một Seller

3 Categories Collection về các danh mục của các sản phẩm có trong hệ thống

4 Products Collection quản lý các thông tin Reference Users về product của các seller trong Reference Sellers hệ thống Reference Categories

5 Carts Collection quản lý thông tin về Reference Products giỏ hàng của người dùng

7 Tokens Collection quản lý thông tin về Reference Users token của hệ thống, mặc định

8 Orders Collection quản lý thông tin Reference Users, Products order của người mua hàng trong hệ thống

9 DeliveryInfo Collection quản lý các địa chỉ Reference Users nhận hàng của người dùng

10 Inventories Collection quản lý tồn kho của Reference Sellers, Orders các sản phẩm

11 Shipping Collection quản lý thông tin vận Reference chuyển, địa điểm vận chuyển, ShippingCompany người vận chuyển (shipper), công ty vận chuyển

12 ShippingComp Collection quản lí công ty vận any chuyển, các công ty giao hàng đã liên kết với App bán sách

13 paymentHistori Collection lưu tất cả các thanh Reference Users, Orders es toán thông qua paypal, nhằm mục đích truy vấn và xử lý các trạng thái đơn hàng của người dùng

CÀI ĐẶT CHƯƠNG TRÌNH

Công nghệ sử dụng

Phần mềm được xây dựng dựa trên mô hình MVC sử dụng công nghệ Java Jsp, Servlet kết hợp với cơ sở dữ liệu PostgreSql được deploy bằng Heroku và sử dụng template có sẵn của Bootrap đã xây dựng giao diện, IDE lập trình là NetBeans.

MVC là từ viết tắt bởi 3 từ Model – View – Controller Đây là mô hình thiết kế sử dụng trong kỹ thuật phần mềm Mô hình source code thành 3 phần, tương ứng mỗi từ Mỗi từ tương ứng với một hoạt động tách biệt trong một mô hình.

Hình 4.1: Mô hình kiến trúc MVC

• View sẽ hiển thị ra phần nhập form tiêu đề và nội dung.

• Controller lấy dữ liệu từ 2 trường và gửi tới Model.

• Model lúc này sẽ nhận dữ liệu từ Controller để lưu trữ trong cơ sở dữ liệu.

4.1.2 ReactJS Đối với việc thiết kế Frontend nhóm đã sử dụng Frameword ReactJS cùng với sự hỗ trợ của Ant design một template cung cấp các component hổ trợ việc thiết kế website trở nên linh hoạt và tiết kiệm thời gian hơn.

ReactJS là một thư viện UI được phát triển bởi Facebook để giúp đỡ việc xây dựng các thành phần (components) UI có sự tương tác cao và có thể tái sự dụng lại một cách dễ dàng.

Một trong những sự hấp dẫn của ReactJS là thư viện này không chỉ hoạt động ở client, mà còn được render cả phía server và có thể kết nối với nhau một cách dễ dàng.

ReactJS dùng cơ chế so sánh sự thay đổi giữa các giá trị của các lần render này với các lần render trước và cập nhật sự thay đổi ít nhất trên DOM.

Virtual DOM: DOM ảo là một công nghệ giúp tăng hiệu năng cho ứng dung. Chỉ node gốc mới có trạng thái, khi nó thay đổi sẽ tái cấu trúc lại toàn bộ, đồng nghĩa với việc DOM tree cũng sẽ thay đổi, điều này sẽ ảnh hưởng đến trải nghiệm người dùng, khi tốc độ xử lý của nó sẽ bị chậm đi ReactJS sử dụng virtual DOM (DOM ảo) để cải thiện vấn đề này Virtual DOM là một object Javascript, mỗi object chứa đầy đủ thông tin cần thiết để tạo ra một DOM, khi dữ liệu thay đổi nó sẽ tính toán sự thay đổi trên object và tree thật, điều này giúp tối ưu hóa việc re-render DOM tree thật. Ưu điểm:

- Thư viện mã nguồn mở, tiện lợi cho việc phát triển và tiết kiệm chi phí

- Có tài liệu hướng dẫn đầy đủ

- Tốc độ xử lý cao, dễ bảo trì và mở rộng ứng dụng vì phân chi các giao diện theo dạng component có thể tái sử dụng tốt

- Quá trình xử lý việc re-render trong react khó xử lý

- Vì cơ chế của react sử dụng là client-side rendering nên không thân thiện với SEO

Express là một web application framework cho nodejs, cung cấp cho Nodejs nhiều tính năng mạnh mẽ để phát triển web.

Express rất dễ dàng để phát triển các ứng dụng nhanh dựa trên NodeJS, nó còn hỗ trợ các phương thức HTTP và middleware tạo ra 1 API rất mạnh mẽ và dễ dàng sử dụng.

Cho phép thiết lập các lớp trung gian để trả về các HTTP request. Định nghĩa routing có thể được sử dụng với các hành động khác nhau dựa trên phương thức HTTP và URL.

Cho phép trả về các trang HTML dựa vào các tham số truyền vào đến template.

NodeJS là mã nguồn mở chạy trên môi trường V8 Javascript runtime, đây là một chương trình chạy cực nhanh trên trình duyệt Chrome, Node giúp các nhà developers phát triển và xây dựng các ứng dụng web một cách đơn giản và dễ dàng mở rộng. Ưu điểm:

- Không đồng bộ: API của NodeJS theo cơ chế none- blocking, nó chủ yếu dựa trên nền tảng NodeJS Server và chờ đợi Server trả dữ liệu về Việc di chuyển giữa máy chủ đến các API tiếp theo, sau khi gọi và cơ chế thông báo các sự kiện của NodeJS giúp máy chủ có được một phản ứng từ các cuộc gọi API trước (Realtime).

- Chạy nhanh: 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.

- Đơn luồng nhưng có khả năng xử lý đơn luồng nhờ cơ chế event loop và thread pool trong NodeJS

- Không đệm: 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.

- Vì Node sử dụng Javascript là một ngôn ngữ cấp cao, nên quy trình code của Node không thiên hướng đối tượng như các ngôn ngữ khác JAVA, C#

- NodeJS xử lý nhanh còn phù thuộc nhiều vào kinh nghiệm thực tế

MongoDB là một database hướng tài liệu (document), nó là một dạng NoSQL database Vì vậy Mongo không dùng cấu trúc table-based của relational database như các SQL thông thường

Mongo sử dụng lưu trữ dữ liệu dưới dạng Document JSON nên mỗi một collection sẽ có các kích cỡ và các document khác nhau, mã max size của một document trong MongoDB là 16MB. Ưu điểm của MongoDB:

- MongoDB lưu dữ liệu dạng JSON, mỗi collection sẽ có kích cỡ và số lượng, kiểu của document khác nhau, dễ dàng để lưu trữ dữ liệu, dễ dàng mở rộng mà không phải quá lo ràng buộc như SQL.

- Dữ liệu trong Mongo không giống với SQL, nó là thuộc dạng NoSQL và nó không có ràng buộc lẫn nhau Vì thế nó không phải kiểm tra thỏa điều kiện ràng buộc khi thêm, xóa, sửa dữ liệu.

- MongoDB tự thêm index cho document (khi bật chế độ auto index), nên việc truy cập dữ liệu đạt hiệu suất cao nhất.

- Không phải tham chiếu quá nhiều bảng như SQL, điều đó giúp cho việc truy vấn vấn dữ liệu nhanh.

Xây dựng backend

- Tiêu tốn bộ nhớ nhiều do lưu trữ dữ liệu dạng key-value và các collection có thể lặp lại key.

- Thay vì ràng buộc ở Database thì ta phải tạo ràng buộc ở mã lập trình, nên ta phải hết sức cẩn thận khi sử dụng MongoDB.

Chứa các xử lý ở tầng trung gian như authentication, validator các trường dữ liệu

1 Jwt.middleware Chứa các function liên quan đến việc verify token, kiểm tra quyền user

2 Validation.middlerware Chứa các thao tác validation các trường dữ liệu nhận từ phía client trước khi gửi đến controller xử lý

Bảng 4.1: File chứa trong thư mục middlewares

4.2.2 Services Đây là phần làm việc trực tiếp với csdl, chức năng của nó là truy vấn csdl, việc giao tiếp csdl chỉ duy nhất xuất hiện ở thư mục services, các lớp khác muốn làm việc với csdl phải thông qua nó.

TT Services Các phương thức

1 auth.service - Lấy thông tin chi tiết user, seller

- Mã hóa mật khẩu trước khi lưu user

- Tạo otp xác thực register

- Tạo token xác thực reset password

2 profile.service - Lấy thông tin chi tiết user, seller

- Update thông tin, đổi password

3 product.service - Lấy danh sách sản phẩm

- Search sản phẩm bằng name, category

- Lấy sản phẩm theo category

- Kiểm tra sản phẩm tồn tại

- Xử lý phân trang, filter

4 cart.service - Lấy danh sách tất cả cart

- Thêm sản phẩm vào cart

- Thêm nhiều sảm phẩm vào cart

Bảng 4.2: File trong thư mục services

Chứa các điều hướng, loại bỏ các ký tự đặc biệt của các trường dữ liệu, xử lý dữ liệu đầu vào, thực hiện bảo mật phòng chống một số lỗi XSS Injection, HTML Injection được gửi kèm với các trường dữ liệu

1 userLogin Đăng nhập bằng email, password

2 googleLogin Đăng nhập bằng tài khoản google

3 resetPassword Thay đổi mật khẩu bằng mã otp gửi về email người dùng

4 refreshToken Cấp lại access token mới và tạo refreshToken mới

5 Logout Xóa refreshToken trong redis và cookie

6 addToCart Thêm 1 sản phẩm vào giỏ hàng

7 removeCart Xóa 1 sản phẩm khỏi giỏ hàng

8 getCartItems Lấy thông tin chi tiết của giỏ hàng

9 addMultipleItem Thêm nhiều sản phẩm vào giỏ hàng

10 addProduct Thêm 1 sản phẩm bởi seller

11 removeProduct Xóa 1 sản phẩm bởi seller

12 getDetailsProduct Lấy thông tin chi tiết của sản phẩm

13 getProducts Lấy danh sách sản phẩm của seller, có filter, phân trang

14 searchProduct Tìm kiếm sản phẩm theo name, category

15 addDeliveryInfo Thêm thông tin địa chỉ nhận hàng

16 getUserDeliveryInfo Lấy thông tin chi tiết địa chỉ nhận hàng của seller

17 deleteDeliveryInfo Xóa thông tin địa chỉ nhận hàng

18 updateDeliveryInfo Cập nhật địa chỉ nhận hàng

19 setDefaultDeliveryInfo Cập nhật địa chỉ nhận hàng mặc định

20 addOrder Thêm đơn đặt hàng

21 getDetailOrder Lấy thông tin chi tiết của một đơn hàng

22 getOrderList Lấy danh sách đơn đặt hàng

23 getAllOrdered Lấy tất cả đơn hàng đã order thành công và đăng chờ xác nhận đơn hàng từ seller

24 getAllOrdersCancelUser Lấy tất cả đơn hàng bị hủy của user

25 getAllOrdersPackedUser Lấy tất cả đơn hàng đã đóng gói và đang chờ vận chuyển của user

26 getAllOrdersShippingUser Lấy tất cả đơn hàng đang được vận chuyển của user

27 getAllOrdersCompletedUser Lấy tất cả đơn hàng đã hoàn thành của user

28 cancelOrderItem Hủy một sản phẩm trong một đơn đặt hàng

29 cancelOrder Hủy một đơn hàng

30 getOrdersNotDoneOfSeller Lấy toàn bộ đơn hàng chưa hoàn thành của seller

31 updateStatusOrderBySeller Cập nhật tình trạng đơn hàng cho seller

32 updateStatusOrderByShipper Cập nhật tình trạng đơn hàng cho shipper

32 paypalPaymentSuccess Xử lý thanh toán paypal thành công

32 paypalPaymentCancel Xử lý thanh toán paypal bị hủy

33 paypalPaymentStatus Lấy tình trạng thanh toán paypal hiện tại

34 getProfile Lấy thông tin chi tiết user

35 changePassword Thay đổi mật khẩu dựa vào mật khẩu cũ

36 updateProfie Cập nhật thông tin user

37 getDetailsSeller Lấy thông tin chi tiết của seller

38 getSellerCategories Lấy tất cả danh mục sản phẩm của seller

39 getProductsBySellerCategory Lấy danh sách sản phẩm theo danh mục sản phẩm của seller

40 activeAccount Active tài khoản vừa đăng ký

41 emailResetPassword Xác nhận email người dùng

42 addCategory Thêm danh mục sản phẩm

43 getCategories Lấy danh sách danh mục sản phẩm

44 getNewReleaseProduct Lấy danh sách sản phẩm mới đăng bán

45 getTop3Seller Lấy top seller có nhiều sản phẩm nhất

46 getRelatedProduct Lấy danh sách các sản phẩm liên quan

47 clientRejectOrder Người dùng không nhận hàng

48 getAllCompleted Lấy danh sách đơn hàng giao hàng thành công

49 addReview Thêm đánh giá sản phẩm

50 cancelOrderByShipper Shipper hủy đơn hàng

Bảng 4.3: Chức năng của controller

Server hỗ trợ send mail, upload hình ảnh cho main server.

-SendMail: dùng nodemailer và google api để thực hiện việc send mail

- Upload: tự xây dựng server upload, đối với những người dùng chưa đăng nhập vào hệ thống ảnh upload sẽ được đưa vào thư mục tạm thời sau khi bấm submit thì ảnh sẽ được lưu từ file tạm thời về thư mục chính của external server.

4.2.5 Một số kỹ thuật tối ưu backend đã sử dụng

1 Promise all trong việc tối ưu thời gian truy vấn

Hình 4.2: Tối ưu hiệu suất bằng Promise all

Tối ưu hóa việc cập nhật số lượng sản phẩm khi đặt hàng thành công, từ đó đưa đến trải nghiệm nhanh gọn và phản hồi nhanh từ phía server.

2 Dùng hàm lean() trong việc truy vấn MongoDB

Hình 4.3: Hàm lean() trong việc tối ưu tốc độ truy vấn MongoDB

Như chúng ta cũng đã biết mặc định kiểu trả về trong MongoDB là dạng DocumentType đây là một dạng trả về dữ liệu đầy đủ để chúng ta có thể thực hiện các câu truy vấn lồng nhau trên chính dữ liệu về trả về, vì vậy MongoDB đã hộ trợ chúng ta một hàm lean() để trả về dạng object từ đó tối ưu hóa thời gian trả về của một câu truy vấn, tùy vào mục đính sự dụng thì kỹ thuật này là một kỹ thuật không thể bỏ của một người làm việc với MongoDB

3 Kỹ thuật Cluster tăng hiệu suất backend

Hình 4.4: Cluster trong việc tối ưu hóa hiệu suất backend

Một server và hai server thì bên nào hiệu suất nhanh hơn chắc ai cũng có thể đoán ra, vì vậy nhóm đã áp dụng kỹ thuật cluster bằng thư viện quản lý các instance trên pm2 để tối ưu hóa backend

4 Kỹ thuật thread Pool trong NodeJS

Hình 4.5: Thread pool trong NodeJS Đây là một kỹ thuật khá sâu trong việc phát triển backend, khi chúng ta hiểu tận dụng tất cả các luồng của máy chủ để tối ưu hóa hiệu suất trang web, mặc định của node là 2 core tương đương với 4 luồng, chúng ta có thể tăng luồng lên dựa vào máy chủ của chúng ta đang có để tăng hiệu suất, luồng ở đây chúng ta có thể hiểu một cữa hàng có 4 nhân viên thì sẽ phục vụ số lượng khách nhiều hơn trong một thời điểm so với một cữa hàng chỉ có một bạn nhân viên

4.2.6 Security Đây là một vấn đề rất nhức nhối trong vấn đề xây dựng hệ thống backend, với những hiểu biệt khá hạn hẹp về lĩnh vực này nhóm chỉ tập trung vào một số lỗi security thông thường

1 Xác thực tất cả các trường được gửi về Server

Hình 4.6: Xác thực các trường gửi về bằng class-validator

Nhóm xây dựng một middleware validation các trường được gửi về từ client nhằm đảm bảo các trường đó là đúng định dạng của trang web yêu cầu, vì validation ở phía client là hoàn toàn không đủ, vì vượt qua lớp validation ở client thì khá dễ dàng, nên việc validation ở phía backend một lần nữa là điều hết sức cần thiết khi xây dựng hệ thống backend

2 Xss filter lọc các ký tự xấu trước khi lưu xuống database

Hình 4.7: Xss filter loại bỏ một số ký tự gây hại cho hệ thống

Xss attack hay HTML injection, SQL injection… đây là một số phương thức tấn công khi hacker lợi dụng truyền các đoạn mã độc thông qua các trường dữ liệu của hệ thống, vì vậy nhóm đã sử dùn mộ thư viện gọi là xssFilter để loại bỏ các ký tự độc hại trước khi thực hiện lưu các trường đó xuống database của hệ thống

3 Rate limit – giới hạn số lượng request trong một thời điểm của user

Hình 4.8: Rate limit – giới hạn số lượng request trong một thời điểm

Kỹ thuật này có thể hạn chế một số cách tấn công như Dos attack khi hacker có thể gửi request liên tục làm cho server chúng ta quá tải dẫn đến việc người dùng sẽ không thể lấy dữ liệu được từ phía server, đây là một kỹ thuật khá hay khi nó sẽ giới hạn số lượng request của một địa chỉ IP trong 1 khoảng thời gian do chính chúng ta cấu hình

Tiêu đề	Thiết kế và xây dựng website bán sách trực tuyến
Tác giả	Trần Đình Bảo
Người hướng dẫn	ThS. Nguyễn Minh Đạo
Trường học	Cao đẳng Công nghệ Thông tin
Chuyên ngành	Công nghệ thông tin
Thể loại	khóa luận tốt nghiệp
Năm xuất bản	2023
Thành phố	Tp. Hồ Chí Minh

Định dạng
Số trang	164
Dung lượng	10,14 MB