đồ án i xây dựng website thương mại điện tử ứng dụng mô hình mvc

Ngoài ra chủ cửa hàng cũng mong muốn sử dụng chính phần mềm này chophép nhân viên bán hàng tại gian hàng của cửa hàng tạo đơn hàng và xử lý đơn hàngtại những cửa hàng truyền thống, cũng

TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘIVIỆN TOÁN ỨNG DỤNG VÀ TIN HỌC

ĐỒ ÁN I

XÂY DỰNG WEBSITE THƯƠNG MẠI ĐIỆN TỬ ỨNGDỤNG MÔ HÌNH MVC

Ngành: HỆ THỐNG THÔNG TIN QUẢN LÝ

Giảng viên hướng dẫn: TS.NGÔ TRUNG HIẾUSinh viên thực hiện: ĐINH TUẤN ANHMã số sinh viên: 20185429

Lớp: HỆ THỐNG THÔNG TIN 3 K63

HÀ NỘI 3 2022

1 Mục tiêu và nội dung của đồ án:1.1 Mục tiêu:

1.2 Nội dung:

2 Kết quả đạt được:

3 Ý thức làm việc của sinh viên:

Hà Nội, ngày 15 tháng 07 năm 2022Giảng viên hướng dẫn

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

Ngô Trung Hiếu

Mục lục

Trang bìa phụ

1.1 Giới thiệu đề tài 2

2.1.4 Ưu điểm của mô hình MVC 7

2.1.5 Nhược điểm của mô hình MVC 8

2.2 Java Spring Boot Framework 9

2.2.1 Tổng quan về Java Spring 9

2.2.2 Java Spring Boot 10

2.3 Ứng dụng MVC, Spring Boot vào dự án 11

2.3.1 Lý do lựa chọn Spring Boot 11

2.3.2 ORM - Object Relational Mapping 11

2.3.3 HTML, CSS 11

2.3.4 Controller 11

Chương 3 Phân tích hệ thống 123.1 Yêu cầu chung 12

3.1.1 Mô tả hệ thống 12

3.1.2 Quy trình làm việc của hệ thống 12

3.2 Sơ đồ phân rã chức năng 15

3.5.3 Chức năng thêm sản phẩm vào giỏ hàng 20

3.5.4 Chức năng thanh toán sản phẩm trong giỏ hàng 20

3.5.5 Chức năng quản lý sản phẩm 20

Chương 4 Thiết kế hệ thống 224.1 Thiết kế cơ sở dữ liệu 22

4.2.6 Trang thanh toán 29

4.2.7 Trang chủ phía nhân viên 30

4.2.8 Trang chủ quản trị 30

4.2.9 Trang quản lý tài khoản 31

4.2.10 Trang quản lý danh mục 31

4.2.11 Trang quản lý sản phẩm 31

Danh sách hình vẽ

2.1 Quá trình xử lý của kiến trúc MVC 7

2.2 Các cấu phần của Java Spring 10

3.1 Sơ đồ phân rã chức năng của khách hàng 15

3.2 Sơ đồ phân rã chức năng của nhân viên 16

3.3 Sơ đồ UseCase 18

3.4 Sơ đồ tuần tự cho chức năng đăng nhập 19

3.5 Sơ đồ tuần tự cho chức năng tìm kiếm sản phẩm 19

3.6 Sơ đồ tuần tự cho chức năng thêm sản phẩm vào giỏ hàng 20

3.7 Sơ đồ tuần tự cho chức năng thanh toán sản phẩm trong giỏ hàng 20

3.8 Sơ đồ tuần tự cho chức năng quản lý sản phẩm 21

4.15 Trang giỏ hàng 29

4.16 Trang thanh toán 29

4.17 Trang chủ nhân viên 30

4.18 Trang chủ quản trị 30

4.19 Trang quản lý tài khoản 31

4.20 Trang quản lý danh mục 31

4.21 Trang quản lý sản phẩm 32

Mở đầu

Trong khoảng thời gian 10 năm trở lại đây, công nghệ giúp chúng ta giải quyết đượcrất nhiều vấn đề một cách đơn giản và hiệu quả hơn rất nhiều so với trước kia Với bàitoán áp dụng công nghệ vào lĩnh vực thương mại, người ta có thể tiết kiệm cũng nhưtối ưu rất nhiều chi phí Với người bán, bằng cách sử dụng những gian hàng online, họdễ dàng tối ưu chi phí bến bãi, mặt bằng, đồng thời có thể khiến thông tin sản phẩmtiếp cận người mua hàng một cách hiệu quả hơn Với người mua hàng, sự phát triểncủa thương mại điện tử giảm đáng kể thời gian mà con người ta phải bỏ ra cho hoạtđộng tìm kiếm và thu mua sản phẩm Với hiệu quả cao, giá thành thấp, hoạt độngthương mại điện tử đang phát triển mạnh mẽ và trở thành xu hướng số một trong lĩnhvực thương mại nói chung và hoạt động mua bán nói riêng Vì vậy, trong đồ án nàyem sẽ chọn đề tài: XÂY DỰNG WEBSITE THƯƠNG MẠI ĐIỆN TỬ ỨNGDỤNG MÔ HÌNH MVC.

Chương 1

Tổng quan đề tài

1.1Giới thiệu đề tài

TuanAnh ECommerce Shop là một cửa hàng thời trang được đưa vào hoạt độngvào đầu năm 2022, sau khi dịch COVID19 bùng phát, tuy đại dịch đã cơ bản đượckiểm soát, nhưng thói quen mua hàng của đại đa số khách hàng ở trong khu vực cửahàng đã bị thay đổi lớn Trước đại dịch, khách hàng ưu tiên đến xem đồ, thử đồ muavà thanh toán tại cửa hàng, tuy nhiên sau hai năm đại dịch, khách hàng đã quen vớiviệc mua hàng trực tuyến, chọn lựa mẫu mã, đặt hàng và chờ giao hàng đến tận nhà.Với sự thay đổi thói quen lớn của khách hàng như vậy cửa hàng quyết định mở thêmmột gian hàng online, vừa cắt giảm chi phí thuê mặt bằng cho cửa hàng, vừa có thểtiếp cận đến phần lớn bộ phận khách hàng có thói quen sử dụng các dịch vụ mua hàngtrực tuyến Ngoài ra chủ cửa hàng cũng mong muốn sử dụng chính phần mềm này chophép nhân viên bán hàng tại gian hàng của cửa hàng tạo đơn hàng và xử lý đơn hàngtại những cửa hàng truyền thống, cũng như quản lý lương của nhân sự trong cửa hàngvà lập báo cáo về các thông tin như doanh thu, hàng hoá, kho

Mặc dù hoạt động thương mại trực tuyến có nhiều sự khác biệt với hoạt động thươngmại trực tiếp, tuy nhiên những phần chính của hoạt động thương mại vẫn không thayđổi, đó là hoạt động mua hàng và thanh toán.

Việc xây dựng hệ thống bán hàng trực tuyến không chß giúp tăng doanh thu chocửa hàng, còn làm cho cửa hàng tiếp cận được với nhiều khách hàng mới, không chßtrong khu vực bị giới hạn bởi địa lý, mà còn có thể tiếp cận được các khách hàng ở xakhông giới hạn khoảng cách giúp mở rộng quy mô bán hàng.

Trygve Reenskaug (1930 - 92 tuổi), một nhà khoa học máy tính, giáo sư danh dựcủa Đại học Oslo là người tạo ra và đề xuất kiến trúc MVC trong khi làm việc tạiTrung tâm nghiên cứu Palo Alto trong một dự án tên là Smalltalk - 79 vào cuối thậpniên 70 của thế kÿ trước Khi tạo ra kiến trúc này, Trygve Reenskaug và các cộng sựmuốn có một thiết kế có thể cấu trúc bất kỳ dự án nào một cách rõ ràng và mạch lạcthay vì một mớ hỗn độn dữ liệu có kích thước lớn Thiết kế đầu tiên của ông có 4 thànhphần chính: Model - View - Thing - Editor, nhưng sau khi thảo luận với các lập trìnhviên khác, ông và các cộng sự trong dự án Smalltalk quyết định sử dụng thiết kế với 3thành phần: Model - View - Controller như ta thường thấy ngày nay.

Mẫu kiến trúc này được áp dụng rất rộng rãi trong việc xây dựng các ứng dụng choWebsite (Website Application), Mobile (Mobile Application) và các ứng dụng chạy trêncác hệ điều hành khác như Window hay MacOS Trên thực tế thì nguyên mẫu kiếntrúc MVC được xây dựng và phát triển cho các ứng dụng với giao diện tương tự nhưứng dụng Desktop chứ không phải được phát triển dành cho các ứng dụng Website, tuynhiên việc phân chia rõ ràng các thành phần (components) cũng như rạch ròi trong việcđiều hướng dữ liệu khiến cho việc ứng dụng thiết kế này trong các ứng dụng Website là

trao đổi là khổng lồ nên lợi thế về sự rõ ràng trong vận hành và dễ dàng trong quảnlý của kiến trúc này với các ứng dụng Website là không phải bàn cãi Hiện nay có rấtnhiều Web framework sử dụng mẫu thiết kế này để thực thi các cấu hình, có thể kểđến C# với ASP.NET Core, Python với Django, Ruby với Rails hay như trong báo cáonày là Java với Spring/Spring Boot.

MVC được xây dựng rất thành công và phổ biến, sau này những kiến trúc hữu íchkhác cũng ra đời trên nền tảng thiết kế MVC như Hierachical Model - View - Controller(HMVC), Model - View - Adapter (MVA), Model - View - Viewmodel (MVVM)

Ứng dụng Website đầu tiên với mô hình MVC được phát triển và giới thiệu bởiNeXT’s WebObject vào năm 1996 dưới ngôn ngữ lập trình Objective-C, vì được vaymượn rất nhiều cấu phần từ dự án SmallTalk nên kiến trúc MVC được thể hiện vôcùng rạch ròi và rõ nét trong ứng dụng tiên phong này.

2.1.2Các thành phần trong kiến trúc MVC

Model: Có thể coi đây là thành phần trung tâm trong kiến trúc Model mô hìnhhóa các đối tượng trong hệ thống, đại diện cho cấu trúc dữ liệu của ứng dụng và hoàntoàn tách biệt với giao diện người dùng Model là thành phần dùng để trực tiếp quảnlý dữ liệu, logic cũng như các luật trong việc vận hành ứng dụng hay truy vấn dữ liệu.

View: Tất cả các sự hiển thị thông tin đến người dùng (thường được gọi là giaodiện người sử dụng - User Interface, UI) như các hình ảnh, bảng biểu, đồ thị, biểu đồ.Nói chung, thành phần này là nơi mà người sử dụng có thể trực tiếp thao tác với hệthống, đưa ra yêu cầu với hệ thống và nhận được kết quả Cấu phần này xử lý logichiển thị và vẽ lên các giao diện người dùng.

Controller: Ví Model như phòng làm việc và View là tiếp tân của một công tythì Controller đóng vai một người quản lý Người quản lý này tiếp nhận các yêu cầu(request) từ cả hai phía của hệ thống, xử lý yêu cầu và phân phối đến đúng địa chß, sauđó tiếp nhận, xử lý và trả về kết quả nhận được Công việc này đôi khi được cho làkhông cần thiết vì các yêu cầu có thể được xử lý dưới dạng request response như trongkiến trúc client server Tuy nhiên đấy là với một hệ thống đơn giản, nếu hệ thống có sựphức tạp nằm ở mức tương đối thì việc có một bộ phận hoạt động như người quản lý,chia bài sẽ là hoàn toàn cần thiết cho các tác vụ quản trị cũng như bảo mật hệ thống.

2.1.3Cách MVC hoạt độngLuồng xử lý dữ liệu với kiến trúc MVC:

1 Đầu tiên ta có một yêu cầu từ người sử dụng hệ thống, yêu cầu này có thể đượcgửi đến Controller qua bất cứ cách nào Có thể là một request url từ người dùng,một form từ chính View hoặc một sự kiện được Controller nhận biết và nắm bắt.

2 Tiếp theo sau khi nhận được yêu cầu Controller sẽ xử lý yêu cầu đó dựa trên việcnhận dạng và sàng lọc Controller sẽ giao tiếp với Model bằng một phương thứcriêng, phương thức này được định sẵn và chß có Controller biết Controller sẽ đưarequest của người dùng về dạng thông điệp này và gửi cho Model xử lý.

3 Sau khi nhận được thông điệp của Controller thì model tiến hành xử lý, có thể làtìm kiếm thông tin dữ liệu, thêm dữ liệu, cập nhật dữ liệu sau khi xử lý thìmodel tiến hành hồi đáp với controller Thông điệp được hồi đáp mang thông tindữ liệu hoặc chß đơn giản là một thông báo lỗi.

4 Sau khi nhận được thông điệp hồi đáp của Model, Controller cũng sẽ tiến hànhtrả lời request của người dùng bằng cách gửi dữ liệu hiển thị tới View.

5 Lúc này thì View tiến hành hiển thị những thông tin response cho người dùng hệthống.

Hình dưới đây là mô hình của quá trình trên.

2.1.4Ưu điểm của mô hình MVC

Mô hình MVC phù hợp với những dự án có đội ngũ phát triển làm việc độc lập vớinhau, với các thành tách biệt và hoạt động riêng lẻ, giao tiếp với nhau qua các thôngđiệp với chuẩn nhất định, đội ngũ phát triển có thể hoạt động linh hoạt và hiệu quả.Nói chung mô hình MVC hiệu quả nhờ những ưu điểm nổi bật sau:

• Quá trình phát triển được hỗ trợ khiến công việc được hoàn thànhnhanh và hiệu quả: Với việc từng thành phần hoạt động độc lập, các nhóm lậptrình viên có thể chia nhỏ công việc, hoàn thành từng phần nhỏ của hệ thống vớichất lượng chuyên môn cao, làm việc song song và hiệu quả MVC giúp các độingũ phát triển tiết kiệm được rất nhiều thời gian.

• Hỗ trợ các kỹ thuật bất đồng bộ, xử lý nhiều khung hiển thị cho mộtđối tượng: Với việc hoạt động trên nhiều ngôn ngữ lập trình khác nhau, hỗ trợnhiều nền tảng và nhiều kiểu dữ liệu, MVC giúp ta có thể tạo nhiều khung hiểnthị cho một đối tượng trong hệ thống, cũng như việc ta có thể dùng MVC để hiểnthị nhiều loại dữ liệu.

• Dễ dàng thay đổi, chßnh sửa: Với việc các thành phần hoạt động tách biệt

sẽ không ảnh hưởng gì đến Model hay việc thay đổi logic xử lý cũng không ảnhhưởng gì đến thành phần hiển thị.

• Giữ nguyên hình thái của dữ liệu: Mô hình MVC chß thực hiện truyền chứkhông định dạng lại những dữ liệu trong hệ thống (nếu lập trình viên không chủđích) nên việc tái sử dụng hay khai thác dữ liệu ban đầu sẽ trở nên dễ dàng vàhiệu quả.

2.1.5Nhược điểm của mô hình MVC

Mặc dù được coi như một bước tiến lớn của việc xây dựng hệ thống, tuy nhiênMVC không phải toàn năng Bất cứ thiết kế nào cũng tồn tại hạn chế, với MVC thìcác hạn chế đó là:

• Còn nhiều khó khăn trong quá trình điều hướng dữ liệu và mã nguồn:Ưu điểm, cũng chính là nhược điểm của mô hình này, việc có các cấu phần táchbiệt yêu cầu người phát triển hệ thống thích ứng và hoạt động trên hệ thốngnhiều lớp và tách biệt với nhau, việc này sẽ dẫn đến một số khó khăn như khóđịnh hướng dữ liệu và cài đặt mã nguồn cho người mới làm quen.

• Không thích hợp để xây dựng những hệ thống nhỏ: Việc có quá nhiều filecấu hình trong thành phần khiến công việc phải thực hiện so với giá trị ứng dụngnhận lại là không quá khả quan với một mô hình ứng dụng nhỏ.

• Nhiều khung hiển thị hoạt động đồng thời: Việc chia nhỏ ứng dụng khiếnhệ thống dễ bị phân tán, chịu áp lực lớn khi phải duy trì đồng thời nhiều cấuphần hoạt động Tính nhất quán của ứng dụng cũng sẽ khiến người phát triểngặp khó khăn với những bước xây dựng đầu tiên.

Nói tóm lại, thiết kế MVC cung cấp việc mã hóa và mở rộng hệ thống nhanh chóng,tiện lợi Nếu người phát triển muốn hệ thống của mình dễ phát triển và cập nhật dễdàng thì MVC sẽ là một lựa chọn tốt Nếu vấn đề mà người phát triển quan tâm là tốcđộ xử lý và cấu trúc hệ thống đơn giản thì MVC có thể sẽ không phải là một trongnhững lựa chọn phù hợp.

2.2Java Spring Boot Framework

2.2.1Tổng quan về Java Spring

Java Spring là một framework ứng dụng (Application Framework) và là bộ chứatrình điều khiển đảo ngược (Investion of Control, viết tắt là IoC) cho ngôn ngữ lậptrình Java Bản chất của framework này có thể sử dụng được cho mọi ứng dụng Java.Trình điều khiển đảo ngược là một quy tắc lập trình rất hữu dụng Trong khi cácquy tắc lập trình truyền thống chß cho phép việc phần mềm gọi đến các thư viện cóthể tái sử dụng được thì IoC cho phép phần mềm và các hàm có thể gọi đến nhữnghàm đặc biệt, mã nguồn có thể tùy chßnh khác bằng cách đóng gói chúng lại khi chạychương trình và "tiêm" chúng vào các lớp thực thi Việc có thể gọi đến các hàm vàmã nguồn tự định nghĩa này cho phép phần mềm có thêm tính module và có thể mởrộng một cách dễ dàng Khi các liên kết điều khiển giữa các đối tượng trong lập trìnhtruyền thống là liên kết tĩnh, với IoC thì các liên kết điều khiển ấy về cơ bản là tĩnhnhưng mã nguồn được tìm và chạy bằng cách đọc những file cài đặt bên ngoài (externalconfiguration) thay vì sử dụng những liên kết trực tiếp bên trong file mã nguồn Việcsử dụng kỹ thuật IoC giúp giảm sự phụ thuộc trực tiếp của các mã nguồn tới nhauthay vào đó là phụ thuộc vào các lớp trừu tượng (Abtraction Class) Cơ chế IoC là cơchế trung tâm của Java Spring, việc đóng gói này cung cấp các đối tượng được gọi làbeans qua các file XML hoặc các chú thích (Annotation) trong mã nguồn.

Tiêm sự phụ thuộc (Dependency Injection) là một trong những kỹ thuật thể hiệnhiệu quả nhất của IoC Bằng cách tiêm các sự phụ thuộc, thay vì để các đối tượng phụthuộc trực tiếp thì chúng ta thể hiện một đối tượng (hoặc static method) cung cấp cácphụ thuộc của đối tượng khác.

Dưới đây là mô hình các cấu phần của Java Spring.

2.2.2Java Spring Boot

Java Spring Boot là một dự án mở rộng của Java Spring Spring Boot được coi làmột giải pháp cấu hình cài đặt dự án Spring sao cho dự án ấy có thể cài đặt và tự chạyđộc lập Với Java Spring thì việc khởi động ứng dụng bắt buộc phải có một máy chủđộc lập chạy ngoài, có thể là Tomcat hoặc deploy lên server Docker Spring Boot ngoàiviệc có thể chạy một mình còn nhiều lợi ích khác như:

• Được tạo ra để chạy một mình, lập trình và và thực thi.

• Được nhúng trực tiếp server TomCat hoặc Jetty, có thể chạy trực tiếp mà khôngcần xuất file War dùng để deploy.

• Cung cấp các đối tượng khởi tạo giúp việc cài đặt ứng dụng Maven/Gradle dễdàng hơn.

• Tự động cấu hình Spring bất cứ khi nào có thể.

• Cung cấp các tính năng sẵn sàng cho sản xuất như chß số, kiểm tra tình trạng vàcấu hình bên ngoài.

2.3Ứng dụng MVC, Spring Boot vào dự án

2.3.1Lý do lựa chọn Spring Boot

Spring Boot rõ ràng được tạo ra không phải dành cho công nghệ MVC Spring Bootđược tạo ra với mục đích sử dụng trong công nghệ API cụ thể là với Restful API, tuynhiên với lợi thế cực lớn từ việc dễ dàng cài đặt và thiết lập cấu hình để khởi chạy mộtmình, em chọn Spring Boot cho báo cáo này nhằm đơn giản hóa tối đa việc cài đặt cấuhình.

2.3.2ORM - Object Relational Mapping

ORM là một kỹ thuật lập trình giúp ánh xạ một bảng với các cột thuộc tính trongcơ sở dữ liệu với một đối tượng với các thuộc tính tương đương Điều này thì giúp gìcho việc triển khai MVC? với việc ánh xạ được nguồn dữ liệu, ta hoàn toàn có thể tạovà quản lý các đối tượng trong thành phần Model một cách dễ dàng, không những vậyviệc xử lý dữ liệu cũng đã được lược bỏ phần lớn độ phức tạp Việc khó khăn lớn nhấttrong phần xử lý Model có lẽ là viết các hàm Service và triển khai các hàm này trongxử lý logic của ứng dụng.

2.3.3HTML, CSS

Về cấu phần View, em chọn HTML và CSS để thể hiện những giao diện cho ngườidùng HTML và CSS là hai ngôn ngữ đơn giản và hiệu quả để tạo nên những khunggiao diện đơn giản.

Việc xây dựng Controller cho hệ thống thì với cơ chế IoC và các công cụ hỗ trợ đắclực của mình, SpringBoot đã hỗ trợ người dùng với một Annotation tên là @Controllerđể đánh dấu Beans và lưu vào container Application Context như đã trình bày ở trên.Việc định nghĩa Controller và sử dụng Controller để điều hướng các yêu cầu cũng sẽtương đối dễ dàng Việc khó khăn ở đây lại là làm sao để khiến Controller điều hướngyêu cầu đi đúng đường.

Về phía người quản lý cửa hàng, nhân viên, có một số yêu cầu như quản lý tàikhoản của khách hàng, của nhân viên, quản lý danh mục hàng hóa và danh sách sảnphẩm bán trong cửa hàng.

3.1.2Quy trình làm việc của hệ thốngPhía khách hàng:

• Khách hàng mới có thể tiếp cận trang web qua các phương thức khác nhau Khikhách hàng tiếp cận trang web của cửa hàng lần đầu tiên, cho phép khách hàngtra cứu và xem thông tin của đơn hàng Đồng thời khi khách hàng có nhu cầumua hàng sẽ phải đăng ký tài khoản.

Google, xem thông tin tài khoản và chßnh sửa thông tin tài khoản.

3.1.3Yêu cầu về chức năng của hệ thống

Mỗi người dùng, bao gồm cả nhân viên và khách hàng có thể đăng ký một tài khoảnduy nhất gắn theo email.

Khách hàng:

• Có thể đăng ký tài khoản (với khách hàng mới).

• Có thể xem thông tin tài khoản cá nhân.

• Có thể chßnh sửa thông tin tài khoản cá nhân.

• Có thể đăng nhập với tài khoản Google.

• Có thể xem thông tin sản phẩm.

• Có thể tìm kiếm thông tin sản phẩm.

• Có thể thêm sản phẩm vào giỏ hàng.

• Có thể xóa sản phẩm ra khỏi giỏ hàng.

• Có thể đặt mua các sản phẩm trong giỏ hàng.

• Có thể thanh toán hàng.

Nhân viên:

• Có thể xem thông tin tài khoản cá nhân.

• Có thể chßnh sửa thông tin tài khoản cá nhân.