Xây dựng website thương mại điện tử ứng dụng công nghệ MVC của ASP NET

TRƢỜNG ĐẠI HỌC GIAO THÔNG VẬN TẢI TP. HCM
KHOA CÔNG NGHỆ THÔNG TIN
------

ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG WEBSITE THƢƠNG MẠI ĐIỆN TỬ
ỨNG DỤNG CÔNG NGHỆ MVC CỦA ASP.NET
Ngành:
CÔNG NGHỆ THÔNG TIN
Chuyên ngành: HỆ THỐNG THÔNG TIN

Giảng viên hƣớng dẫn: ThS.NGUYỄN LƢƠNG ANH TUẤN
Sinh viên thực hiện :
1. ĐỖ LONG HƢNG
MSSV: 11L1120027 LỚP: CN11LT
2. PHẠM TIẾN TRUNG
MSSV: 11L1120070 LỚP CN11LT

TP. Hồ Chí Minh, 2013


TRƢỜNG ĐẠI HỌC GIAO THÔNG VẬN TẢI TP. HCM
KHOA CÔNG NGHỆ THÔNG TIN
------

ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG WEBSITE THƢƠNG MẠI ĐIỆN TỬ
ỨNG DỤNG CÔNG NGHỆ MVC CỦA ASP.NET
Ngành:

CÔNG NGHỆ THÔNG TIN
Chuyên ngành: HỆ THỐNG THÔNG TIN

Giảng viên hƣớng dẫn: ThS.NGUYỄN LƢƠNG ANH TUẤN
Sinh viên thực hiện :
1. ĐỖ LONG HƢNG
MSSV: 11L1120027 LỚP: CN11LT
2. PHẠM TIẾN TRUNG
MSSV: 11L1120070 LỚP CN11LT

TP. Hồ Chí Minh, 2013


LỜI CAM ĐOAN
Chúng em xin cam đoan đây là bài luận văn tốt nghiệp do chúng em tự tìm
hiểu, tự viết ra sản phẩm, không hề sao chép của bất kỳ ai.
Chúng em hoàn toàn chịu trách nhiệm về lời cam đoan của mình !
TP.Hồ Chí Minh, ngày 25 tháng 12 năm 2013
Sinh viên thực hiện
Đỗ Long Hƣng
Phạm Tiến Trung


LỜI CÁM ƠN
Trong suốt quá trình chúng em thực hiện Luận văn tốt nghiệp, chúng em
luôn nhận đƣợc sự quan tâm giúp đỡ của quý thầy cô, ban chủ nhiệm Khoa Công
nghệ thông tin và Nhà trƣờng. Chúng em xin chân thành cảm ơn sự giúp đỡ quý
báu này.
Chúng em xin bày tỏ lòng biết ơn sâu sắc tới ThS.Nguyễn Lƣơng Anh Tuấn,
ngƣời đã dành nhiều sự quan tâm, giúp đỡ, hƣớng dẫn chúng em hoàn thành luận

văn tốt nghiệp.
Nhóm chúng em xin gửi lời cám ơn đến các bạn trong lớp CN11LT đã giúp
đỡ trong quá trình làm luận văn tốt nghiệp.
Chúng em cũng xin gửi lời cám ơn đến Công ty TNHH Thƣơng mại Dịch vụ
Viễn thông Quang Thành đã giúp đỡ nhóm hoàn thành đồ án tốt nghiệp.
Do thời gian học tập và nghiên cứu có hạn, nhận thức còn hạn chế, nên đồ
án tốt nghiệp chắc chắc còn nhiều thiếu sót, kính mong đƣợc các thày cô chỉ bảo
và giúp đỡ.
Chúng em xin chân thành cảm ơn!


NHẬN XÉT CỦA GIẢNG VIÊN HƢỚNG DẪN

..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................

..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................

TP. HCM, Ngày….…tháng………năm 2013


NHẬN XÉT CỦA GIẢNG VIÊN PHẢN BIỆN

..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................

..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................
..........................................................................................................................................

TP. HCM, Ngày….…tháng………năm 2013


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

MỤC LỤC
TRANG BÌA
TRANG BÌA PHỤ
LỜI CAM ĐOAN
LỜI CÁM ƠN
MỤC LỤC______________________________________________________ i
DANH MỤC BẢNG BIỂU VÀ HÌNH VẼ ____________________________ iv

DANH MỤC CÁC TỪ VIẾT TẮT __________________________________ vi
PHẦN MỞ ĐẦU _________________________________________________ 1
CHƢƠNG 1: TÌM HIỂU VỀ MÔ HÌNH ASP.NET – MVC _______________ 4
1.1. Lịch sử phát triển của ASP.NET MVC. ____________________________________ 4
1.2.Tổng quan về MVC. ___________________________________________________ 5
1.3.Mô hình ASP.NET truyền thống (mô hình Web Form) _________________________ 7
1.4.Mô hình ASP.NET MVC _______________________________________________ 8
1.4.1.Đặc điểm chung của mô hình ASP.NET MVC ____________________________ 8
1.4.2.So sánh mô hình MVC và mô hình 3 lớp thông thường. ____________________ 10
1.4.3 Kiến trúc ________________________________________________________ 11
1.4.4.Định tuyến URL (URL Routing) ______________________________________ 11
1.4.5.Mô hình MVC và Postback __________________________________________ 11
1.4.6.Ưu điểm của MVC ________________________________________________ 13
1.4.7.Nhược điểm của MVC _____________________________________________ 13
1.5.Controller và Routing _________________________________________________ 13
1.5.1 Controller và Action Method ________________________________________ 13
1.5.2 ASP.NET MVC Routing ____________________________________________ 19
1.6.View ______________________________________________________________ 20
1.6.1.Razor View Engine ________________________________________________ 20
1.6.2.Master Page _____________________________________________________ 21
1.6.3.Partial View _____________________________________________________ 23
1.6.4.HTML Helpers ___________________________________________________ 24
1.6.5.Validation Form Data _____________________________________________ 24
1.7. Model(Data) ________________________________________________________ 25
1.7.1.ORM(Object-Relational Mapping) ____________________________________ 25
1.7.2.Entity Framework. ________________________________________________ 25
1.8. AJAX trên ASP.NET MVC ____________________________________________ 26
1.8.1. AJAX __________________________________________________________ 26

i

Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

1.8.2.ASP.NET MVC AJAX Helpers _______________________________________
1.9.Giới thiệu mô hình ASP.NET MVC4 _____________________________________
1.9.1.Môi trường làm việc. ______________________________________________
1.9.2.Các tính năng mới của MVC4 _______________________________________

27
28
29
29

CHƢƠNG 2: MÔ HÌNH CƠ SỞ DỮ LIỆU ___________________________ 31
2.1.Bảng dữ liệu. ________________________________________________________ 31
2.2.Mô hình vật lý dữ liệu. _______________________________________________ 33
2.3.Mô hình quan hệ dữ liệu. _______________________________________________ 36

CHƢƠNG 3: CẤU TRÚC WEBSITE _______________________________ 38
3.1.Cấu trúc thiết kế của Website ___________________________________________
3.1.1.Khởi tạo Website. _________________________________________________
3.1.2.Source code thực hiện. _____________________________________________
3.2.Mô hình chức năng ___________________________________________________

38
38
38

39

CHƢƠNG 4: DEMO SẢN PHẨM __________________________________ 41
4.1.Các thành phần chính của Website. _______________________________________
4.1.1.Trang chủ _______________________________________________________
4.1.2.Trang bảo hành. __________________________________________________
4.1.3.Trang liên hệ. ____________________________________________________
4.1.4.Trang quản trị. ___________________________________________________
4.1.5.Trang chi tiết sản phẩm. ____________________________________________
4.1.6.Logo ___________________________________________________________
4.1.7. Danh mục sản phẩm. ______________________________________________
4.1.8.Thanh menu và banner. ____________________________________________
4.2.Các trang trƣng bày sản phẩm. __________________________________________
4.2.1.Gian hàng tại trang chủ.____________________________________________
4.2.2.Gian hàng theo hãng sản phẩm. ______________________________________
4.2.3.Gian hàng bán chạy._______________________________________________
4.3.Chức năng đăng ký, đăng nhập.__________________________________________
4.3.1.Chức năng đăng ký. _______________________________________________
4.3.2.Chức năng đăng nhập. _____________________________________________
4.4.Chức năng tìm kiếm. __________________________________________________
4.4.1.Tìm kiếm theo tên. ________________________________________________
4.4.2.Tìm kiếm nâng cao. _______________________________________________
4.5.Chức năng đặt hàng. __________________________________________________
4.5.1.Giỏ hàng. _______________________________________________________
4.5.2.Cập nhật giỏ hàng ________________________________________________
4.5.3.Đặt mua sản phẩm ________________________________________________
4.6.Chức năng quản trị. ___________________________________________________

ii

41
41
42
43
43
44
45
45
46
47
47
48
49
50
50
51
51
51
53
54
54
54
55
56


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

4.6.1.Quản lý đặt hàng. _________________________________________________
4.6.2.Quản lý danh mục. ________________________________________________
4.6.3.Quản lý sản phẩm. ________________________________________________
4.6.4.Quản lý tài khoản. ________________________________________________
4.6.5.Quản lý liên hệ. __________________________________________________
4.7.Các chức năng khác. __________________________________________________
4.7.1.Đếm số lượng truy cập. ____________________________________________
4.7.2.Hỗ trợ trực tuyến _________________________________________________

57
58
59
60
61
62
62
62

KẾT LUẬN ____________________________________________________ 63
TÀI LIỆU THAM KHẢO

iii


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

DANH MỤC BẢNG BIỂU VÀ HÌNH VẼ
Bảng 1.1: Lịch sử phát triển của công nghệ ASP.NET MVC ......................... Trang 5

Bảng 1.2: So sánh mô hình Webform và MVC ............................................... Trang 9
Bảng 1.3: Liệt kê các kiểu action result và các phƣơng thức hỗ trợ để trả về .Trang 16
Hình 1.1: Mô hình MVC .................................................................................. Trang 5
Hình 1.2: Cách thức làm việc của mô hình MVC ............................................Trang 7
Hình 1.3: So sánh mô hình MVC và 3 Layer................................................... Trang 10
Hình 1.4: Cấu trúc của mô hình MVC4 ........................................................... Trang 12
Hình 1.5: Mô hình xử lý của MVC4 ................................................................ Trang 28
Hình 1.6: ASP.NET MVC4 trong Visual Stuido 2012 ....................................Trang 29
Hình 2.1: Mô hình quan hệ dữ liệu ..................................................................Trang 37
Hình 3.1: Dự án MVC 4 ................................................................................... Trang 38
Hình 3.3: Mô hình chức năng của Website ...................................................... Trang 40
Hình 4.1: Trang chủ ......................................................................................... Trang 41
Hình 4.2: Trang bảo hành................................................................................. Trang 42
Hình 4.3: Trang liên hệ .................................................................................... Trang 43
Hình 4.4: Trang quản trị ................................................................................... Trang 43
Hình 4.5: Trang chi tiết sản phẩm ....................................................................Trang 44
Hình 4.6: Logo .................................................................................................Trang 45
Hình 4.7: Danh mục sản phẩm .........................................................................Trang 45
Hình 4.8: Thanh menu và Banner ....................................................................Trang 46
Hình 4.9: Gian hàng tại trang chủ ....................................................................Trang 47
Hình 4.10: Gian hàng theo hãng sản phẩm ...................................................... Trang 48
Hình 4.11: Gian hàng bán chạy ........................................................................Trang 49
Hình 4.12: Đăng ký tài khoản ..........................................................................Trang 50
Hình 4.13: Đăng nhập tài khoản ......................................................................Trang 51
Hình 4.14: Đăng nhập thành công....................................................................Trang 51

iv


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

Hình 4.15: Bắt đầu tìm kiếm theo tên .............................................................. Trang 51
Hình 4.16: Kết quả tìm kiếm theo tên .............................................................. Trang 52
Hình 4.17: Bắt đầu tìm kiếm nâng cao ............................................................. Trang 53
Hình 4.18: Kết quả tìm kiếm nâng cao ............................................................ Trang 53
Hình 4.19: Giỏ hàng ......................................................................................... Trang 54
Hình 4.20: Bắt đầu giỏ hàng ............................................................................Trang 54
Hình 4.21: Giỏ hàng của khách ........................................................................Trang 55
Hình 4.22: Tiến hành đặt hàng .........................................................................Trang 55
Hình 4.23: Đặt hàng thành công ......................................................................Trang 56
Hình 4.24: Trang quản trị ................................................................................. Trang 56
Hình 4.25: Quản lý đơn hàng ...........................................................................Trang 57
Hình 4.26: Chi tiết và xóa đơn hàng ................................................................ Trang 57
Hình 4.27: Quản lý danh mục, xóa danh mục .................................................. Trang 58
Hình 4.28: Thêm và sửa danh mục ..................................................................Trang 59
Hình 4.29: Quản lý sản phẩm, xóa sản phẩm................................................... Trang 59
Hình 4.30: Thêm và sửa sản phẩm ...................................................................Trang 60
Hình 4.31: Quản lý đăng nhập, xóa tài khoản .................................................. Trang 61
Hình 4.32: Thêm và sửa tài khoản ...................................................................Trang 61
Hình 4.33: Quản lý liên hệ ............................................................................... Trang 62
Hình 4.34: Lƣợng truy cập ............................................................................... Trang 62
Hình 4.35: Hỗ trợ trực tuyến ............................................................................Trang 62

v


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

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

Active Server Pages

HTML

HyperText Markup Language

UI

User Interface

VB

Visual Basic

TDD

Test Driven Development

URL

Uniform Resource Locator

DI

Dependency Injection

IOC

Inversion Of Control

OMR

Object-Relational Mapping

DF

Database First

MF

Model First

DDL

Data Definition Language

CF

Code First

API

Application Programming Interface

CSS

Cascading Style Sheets

DOM

Doucument Object Model

EBML

Extensible Binary Meta Language

XML

Extensible Markup Language

CSDL

Cơ sở dữ liệu

vi


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

PHẦN MỞ ĐẦU
1. Lý do chọn đề tài.
Hiện nay việc thiết kế trang web Asp.Net là rất dễ dàng đối với các lập trình
viên, chúng ta có thể tìm các tài liệu hƣớng dẫn, tham khảo các project để nghiên cứu

và phát triển. Microsoft muốn tạo ra công cụ để ngƣời sử dụng dễ dàng làm việc và xây
dựng trang web nhanh chóng nhất.
Asp.net Webform đƣợc thiết kế để thực hiện điều đó. Asp.net Webform đƣợc
thiết kế để ngƣời viết cảm thấy nhƣ đang thiết kế một chƣơng trình winform vậy, bằng
cách kéo thả các button, textbox..., tự sinh mã html, đơn giản và dễ hiểu. Chính vì thế
Asp.net Webform dù đã ra đời cách đây hơn mƣời năm nhƣng vẫn còn đƣợc dùng cho
tới ngày nay.
Nhƣng Asp.net Webform lại có những nhƣợc điểm, việc dùng các webcontrol
sinh ra các event để thực hiện cho UI(user interface) khi có sự tƣơng tác với ngƣời
dùng thì tiến trình diễn ra chậm, gây ra các hạn chế. Việc sử dụng ViewState để quan
lý các trang web đều có lifecycle, postback.
Asp.net MVC chính là sự lựa chọn hợp lý thay thế cho Asp.net Webform, nó đã
và đang trở nên phổ biến và sẽ thành nền tảng để xây dựng website trong thời gian tới
đây. Những ƣu điểm của Asp.net MVC là phân tích rõ ràng 3 thành phần chính là:
Model(lớp dữ liệu), View(lớp giao diện), Controller(lớp điều khiển), cung cấp nhiều cơ
chế xử lý Request khác nhau, dựa trên nền tảng Asp.net vốn đã rất mạnh mẽ, ngoài ra
còn hỗ trợ nhiều View engine, cơ chế định tuyến Routing mềm dẻo giúp ngƣời phát
triển có thể tạo các URL thân thiện với ngƣời dùng cũng nhƣ với SEO. Với cấu trúc 3
lớp nhƣ trên thì việc nâng cấp, sữa chữa hay thay đổi các chức năng trở nên dễ dàng
hơn và cũng giúp cho việc xây dựng website chặt chẽ, rõ ràng, dễ hiểu hơn.
Vào giữa năm 2013 thì công nghệ mới nhất là ASP.NET MVC 4.0 đã ra đời,
đƣợc tích hợp sẵn trong bản Visual Studio 2012. Nó còn rất mới mẻ đối với các bạn

1


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

sinh viên cũng nhƣ những ngƣời phát triển Website. Chính vì thế, nhóm em đã mạnh
dạn chọn đề tài "Xây dựng Website thương mại điện tử ứng dụng công nghệ MVC
của ASP.NET" để làm đề tài báo cáo tốt nghiệp của mình.
2. Tình hình nghiên cứu.
Hiện nay các tài liệu về MVC là không nhiều và tài liệu về MVC4 bằng tiếng việt
thì càng hiếm. Vì thế chúng em gặp nhiều khó khăn trong việc tìm hiểu và hầu hết là
tham khảo các tài liệu tiếng anh. Nhƣng quan trọng là chúng em cũng đã nắm đƣợc về
công nghệ mới này.
3. Mục đích nghiên cứu:
 Học hỏi công nghệ, kiến thức mới.
 Phục vụ cho việc xây dựng website thƣơng mại điện tử bằng công nghệ MVC 4.
4. Nhiệm vụ nghiên cứu:
 ASP.NET MVC 4.0.
 Xây dựng website thƣơng mại điện tử.
5. Phƣơng pháp nghiên cứu:
 Nghiên cứu lý thuyết thông qua các bài báo, tài liệu trên mạng.
 Thông qua các demo hƣớng dẫn trên internet.
 Tổng hợp kiến thức và dữ liệu thực tế.
6. Ý nghĩa khoa học và thực tiễn:
 Hiện nay ASP.NET MVC 4 là công nghệ mới nhất và có thể ít các bạn biết đến,
chính vì thế khi hoàn thành luận văn tốt nghiệp này sẽ là một tài liệu nhỏ giúp
các bạn sinh viên và những ngƣời đam mê thiết kế Website có thể nghiên cứu và
phát triển.
 Công nghệ ASP.NET MVC 4 có nhiều ƣu điểm vƣợt trội và chắc chắn sẽ thay
thế cho Asp.net Webform trong tƣơng lai gần. Vì thế áp dụng ASP.NET MVC 4
vào thực tiễn có một ý nghĩa rất lớn.

2

Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

7. Các kết quả đạt đƣợc.
 Tìm hiểu đƣợc công nghệ ASP.NET MVC 4.
 Xây dựng đƣợc Website thƣơng mại điện tử theo công nghệ MVC4.0 với đầy đủ
các chức năng cần thiết.
8. Cấu trúc của luận văn.
 Chƣơng 1: Tìm hiểu về mô hình ASP.NET MVC.
 Chƣơng 2: Mô hình cơ sở dữ liệu.
 Chƣơng 3: Cấu trúc của Website
 Chƣơng 4: Demo sản phẩm

3


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

CHƢƠNG 1: TÌM HIỂU VỀ MÔ HÌNH ASP.NET – MVC
1.1. Lịch sử phát triển của ASP.NET MVC.
Đầu năm 2002, Microsoft giới thiệu một kỹ thuật lập trình Web khá mới mẻ với
tên gọi ban đầu là ASP+, tên chính thức sau này là ASP.NET. Với ASP.NET, không
những không cần đòi hỏi bạn phải biết các tab HTML, thiết kế web, mà nó còn hỗ trợ
mạnh lập trình hƣớng đối tƣợng trong quá trình xây dựng và phát triển ứng dụng Web.
ASP.NET là kỹ thuật lập trình và phát triển ứng dụng web ở phía Server
(Server-side) dựa trên nền tảng của Microsoft .Net Framework.
Công nghệ ASP.NET MVC là công nghệ mới hiện nay, tuy nhiên nó có lịch sử

lâu đời. Nền tảng MVC đƣợc phát minh bởi Trygve Renskaug, ông đã viết trang giấy
đầu tiên nói về MVC vào năm 1978. Ban đầu nó đƣợc gọi là Thing Model View Editor
pattern, nhƣng sau đó nó đƣợc đặt tên lại là Model View Controller pattern. ASP.NET
MVC lần đầu tiên xuất hiện đó là trong dự án mã nguồn mở MonoRail. Và nguồn gốc
thật sự để cho ra đời công nghệ Microsoft ASP.NET MVC là do Scott Guthrie(một
trong những nhà sáng tạo ra ASP.NET) trên chuyến bay đến Austin, Texas để nói về
hội thảo Alt.NET vào tháng 10-2007. Cuối cùng thì đầu năm 2009 phiên bản ASP.NET
MVC 1.0 (released) đƣợc ra đời. Các năm sau đó các phiên bản tiếp theo ra đời với
những tính năng nổi trội.
ASP.NET MVC là nền tảng công nghệ mới nhất của Microsoft hiện, nó đƣợc
thiết kế từ suy nghĩ là làm thế nào để xây dựng một phần mềm tốt (phần mềm tốt là
phần mềm bạn muốn tạo ra và nó dễ dàng đƣợc thay đổi -Stephen Walther). ASP.NET
MVC đƣợc thiết kế để làm sao có thể bổ sung các nguyên lý và các patterns phát triển
phần mềm khi xây dựng các ứng dụng web. Bên cạnh đó, nó đƣợc thiết kế để hỗ trợ
trong việc kiểm thử.

4


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

Bảng 1: Lịch sử phát triển của công nghệ ASP.NET MVC
Năm ra đời

Công nghệ

1996

ASP(Active Server Pages)

2002

ASP.NET 1.0

2005

ASP.NET 2.0

2007

ASP.NET AJAX

2008

ASP.NET 3.5

2009

ASP.NET MVC 1.0

2010

ASP.NET 4.0
ASP.NET MVC 2.0

2011

ASP.NET MVC 3.0

2012

ASP.NET 4.5

2013

ASP.NET MVC 4.0

1.2.Tổng quan về MVC.
Mô hình MVC (Model - View - Controller) là một kiến trúc phần mềm hay mô
hình thiết kế đƣợc sử dụng trong kỹ thuật phần mềm. Nó giúp cho các developer tách
ứng dụng của họ ra 3 thành phần khác nhau Model, View và Controller (Hình 1.1).
Mỗi thành phần có một nhiệm vụ riêng biệt và độc lập với các thành phần khác.

Hình 1.1. Mô hình MVC

5


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

 Model
Đây là thành phần chứa tất cả các nghiệp vụ logic, phƣơng thức xử lý, truy xuất
database, đối tƣợng mô tả dữ liệu nhƣ các Class, hàm xử lý...
 View
Đảm nhận việc hiển thị thông tin, tƣơng tác với ngƣời dùng, nơi chứa tất cả các
đối tƣợng GUI nhƣ textbox, images...Hiểu một cách đơn giản, nó là tập hợp các form

hoặc các file HTML.
 Controller
Giữ nhiệm vụ nhận điều hƣớng các yêu cầu từ ngƣời dùng và gọi đúng những
phƣơng thức xử lý chúng... Chẳng hạn thành phần này sẽ nhận request từ url và form
để thao tác trực tiếp với Model.
 MVC làm việc như thế nào ?
 Đây là một cách đơn giản để mô tả lại luồng sự kiện đƣợc xử lý trong MVC:
 User tƣơng tác với View, bằng cách click vào button, user gửi yêu cầu đi.
 Controller nhận, xử lý và điều hƣớng chúng đến đúng phƣơng thức xử lý ở
Model.
 Model nhận thông tin và thực thi các yêu cầu.
 Khi Model hoàn tất việc xử lý, View sẽ nhận kết quả từ Model và hiển thị lại
cho ngƣời dùng.

6


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

Hình 1.2: Cách thức làm việc của MVC
1.3.Mô hình ASP.NET truyền thống (mô hình Web Form)
Dựa trên nền .NET hỗ trợ đa ngôn ngữ nhƣ C#, VB.NET,… Microsoft hƣớng
đến việc giấu đi giao thức HTTP (ẩn đi bản chất bên trong) và code HTML bằng việc
đƣa ra mô hình UI (user interface) nhƣ là các đối tƣợng control phía server (mỗi
control có trạng thái của riêng mình, tự động sinh mã HTML khi cần, và tự động kết
nối với các sự kiện phía client). Các nhà phát triển Web không còn phải làm việc với
các request và response trong từng HTTP độc lập. Thay thế nó chính là thuật ngữ
StateFull UI(tạm dịch là trạng thái giao diện ngƣời dùng). Các nhà phát triển Web chỉ

cần kéo-thả, và tƣởng tƣợng ra điều gì sẽ xảy ra trên server khi thiết kế giao diện Web
Nhƣợc điểm:
 ViewState: là cơ chế chính để duy trì trạng thái qua mỗi lần request, điều này
dẫn đến một khối lƣợng dữ liệu lớn đƣợc truyền đi giữa client-server.

7


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

 Chu kì sống của 1 trang web: là cơ chế kết nối giữa trình điều khiển sự kiện
client và server, điều này có thể trở nên phức tạp, và dễ phá vỡ.
 Các control bị giới hạn trên mã HTML: vài control server sinh mã HTML,
nhƣng đó không phải là mã HTML mà ta mong muốn. Ví dụ vài control server
sinh ra giá trị ID phức tạp, và khó truy xuất bởi JavaScript.
 Cảm nhận sai trong việc phân tách code ra khỏi mã HTML bằng cách tạo
code-behind bên dƣới trang: Trong thực tế thì các nhà phát triển Web đã khuyến
khích nên trộn việc trình bày code (ví dụ: việc quản lý control phía server) với
tính logic trong ứng dụng của họ (ví dụ: thao tác cơ sở dữ liệu) với nhau. Tốt
hơn hết là không nên tách riêng chúng ra vì kết quả thƣờng là khó hiểu và dễ vỡ.
 Không thể kiểm thử: Khi lần đầu tiên các nhà thiết kế ASP.NET đƣa ra nền thiết
kế của họ, họ không thể lƣờng trƣớc việc kiểm thử sẽ trở thành xu hƣớng phát
triển phần mềm hiện nay. Và kiến trúc họ xây dựng không hoàn toàn thích hợp
với việc kiểm thử tự động.
1.4.Mô hình ASP.NET MVC
1.4.1.Đặc điểm chung của mô hình ASP.NET MVC
 Tách biệt các thành phần của ứng dụng(logic đầu vào, logic nghiệp vụ và logic
giao diện), hỗ trợ kiểm thử và test-driven development (TDD)

 Mô hình mở và tùy biến cao. Các thành phần của ASP.NET MVC đƣợc thiết kế
để có thể dễ dàng thay thế và tùy biến. Ngƣời dùng có thể thiết lập theo cách
riêng của mình bằng việc sử dụng engineer view riêng, định tuyến
URL(routing), và các thành phần khác. ASP.NET MVC cũng hỗ trợ việc sử
dụng Dependency Injection (DI) và Inversion of Control (IOC). DI cho phép
ngƣời lập trình thêm các đối tƣợng vào class thay vì từ class tạo ra các đối tƣợng
của chính nó. IOC quy định rằng nếu một đối tƣợng truy vấn đến một đối tƣợng

8


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

khác, đối tƣợng thứ nhất sẽ coi nhƣ đối tƣợng thứ 2 là một tập tin cấu hình. Điều
này giúp việc kiểm thử dễ dàng hơn.
 Hỗ trợ việc tùy biến URL mạnh mẽ thông qua việc định tuyến. URL không cần
đuôi mở rộng, ánh xạ đến các contronller. Giúp tăng cƣờng các hoạt động SEO.
 Thừa kế các tính năng của ASP.NET truyền thống, hỗ trợ xác thực form, phân
quyền, tạo phiên đăng nhâp…
Bảng 1.2: So sánh mô hình Webform và MVC
Tính năng

ASP.NET

Kiến trúc chƣơng trình

Kiến trúc mô hình 3 lớp Kiến trúc sử dụng việc

ASP.NET MVC

WebForm: Presentation - phân chia chƣơng trình
Business - Data Access

thành Controllers, Models,
Views

Cú pháp chƣơng trình

Sử dụng cú pháp của Các sự kiện đƣợc điều
webform, tất cả các sự kiện khiển bởi controllers, các
và controls do server quản controls không do server
quản lý

lý
Truy cập dữ liệu

Sử dụng hầu hết các công Phần lớn dùng LINQ to
nghệ truy cập dữ liệu trong SQL class để tạo mô hình
ứng dụng

Debug

truy cập đối tƣợng

Debug chƣơng trình phải Debug có thể sử dụng các
thực hiện tất cả bao gồm unit test kiểm tra các
các lớp truy cập dữ liệu, sự phƣơng
hiển thị, điều khiển các controller

controls

9

thức

trong


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

Tốc độ tải

Tốc độ tải chậm khi trong Tải nhanh hơn do không
trang có quá nhiều các phải quản lý ViewState để
controls vì ViewState quá quản lý các control trong
lớn.

trang

Tƣơng tác với Javascript

Khó khăn

Dễ dàng

URL Address

Cấu trúc địa chỉ URL có Cấu trúc địa chỉ rành mạch
dạng

theo

<filename>.aspx?&
Controllers/Action/Id

dạng

tham số=tham số>
1.4.2.So sánh mô hình MVC và mô hình 3 lớp thông thường.
Giống nhau: Tách rời Programming core/business logic ra khỏi những phụ thuộc về tài
nguyên và môi trƣờng.
Presentation Layer thể hiện giống nhƣ chức năng của View và Controller
Business Layer và Data Access Layer thể hiện giống nhƣ chức năng của Model
Khác nhau

Hình 1.3: So sánh mô hình MVC và 3 Layer

10


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

Trong mô hình 3 lớp thông thƣờng, việc xử lý sẽ đi từ trên xuống dƣới rồi từ
dƣới đi lên, đi qua lần lƣợt các tầng, nên việc thực thi sẽ phƣc tạp hơn,

Còn trong mô hình MVC, Model-View-Controller sẽ thực thi các thao tác với
nhau mà không cần phải qua lần lƣợt các tầng.
1.4.3 Kiến trúc
Trong mô hình ASP.NET truyền thống, URL thƣờng đƣợc ánh xạ đến các file
cụ thể có trên server(ví dụ nhƣ file .aspx). Những file này chứa các mã xử lý yêu cầu từ
client.
Ở ASP.NET MVC, việc ánh xạ URL hoàn toàn khác với mô hình truyền thống.
Thay vì ánh xạ URL đến một trang .aspx cụ thể, nó đƣợc ánh xạ đến 1 lớp Controller.
Lớp này xử lí yêu cầu gửi đến, sau đó chuyển kết quả xử lí này đến một giao diện
HTML để hiển thị cho ngƣời dùng.
ASP.NET MVC phân tách hệ thống thành ba phần Model, View và Controller.
Model đại diện cho logic xử lí nghiệp vụ/phạm vi của ứng dụng, thƣờng gắn liền với
cơ sở dữ liệu. View đƣợc gọi từ Controller, là giao diện tƣơng tác với ngƣời dùng. Mặc
định ASP.NET MVC sử dụng các trang .aspx, master page .master) hay user control
(.ascx) để hiển thị phía trình duyệt. Controller nhận giá trị gửi lên từ client, từ đấy chọn
action method phù hợp để xử lí.
1.4.4.Định tuyến URL (URL Routing)
Mô hình ASP.NET MVC sử dụng các engine định tuyến ASP.NET, cung cấp
linh hoạt các ánh xạ các URL đến các Controller. Ngƣời dùng có thể đặt ra các quy tắc
định tuyến riêng của mình để xử lí các URL theo các Controller mong muốn
1.4.5.Mô hình MVC và Postback
ASP.NET MVC không sử dụng mô hình postback của ASP.NET Web Form để
tƣơng tác với server. Thay vào đó tất cả các tƣơng tác vủa ngƣời dùng đƣợc chuyển
đến một Controller. Điều này tách biệt giữa giao diện và xử lí nghiệp vụ, tăng cƣờng

11


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

khả năng kiểm thử. Đỗng nghĩa với việc View state của ASP.NET và vòng đời trong
Web Form không đƣợc tích hợp vào mô hình MVC.
Mặc định, một ứng dụng MVC sẽ bao gồm các thƣ mục sau:

Hình 1.4: Cấu trúc mô hình MVC 4
 App_Data, thƣ mục lƣu trữ dữ liệu, chẳng hạn nhƣ CSDL

12


Luận văn tốt nghiệp

GVHD: ThS.Nguyễn Lƣơng Anh Tuấn

 Content, đƣợc khuyến nghị dùng để lƣu các file css, hình ảnh…
 Controllers, thƣ mục lƣu các Controller. ASP.NET MVC đặt tên các controller
có kết thúc là Controller, chẳng hạn nhƣ HomeController, LoginController, hay
ProductController.
 Models, lƣu các class đại diện cho các đối tƣợng của ứng dụng
 Scripts, lƣu các file java script hỗ trợ cho ứng dụng, mặc định nó đã chức các
file có sẵn của Asp.NET MVC
 Views, lƣu các file hiển thị giao dện ngƣời dùng, nhƣ HTML, CSHTML,
.aspx…
Ngoài ra trong thƣ mục mặc định còn có các file Global.asax để định tuyến
URL, file Web.config để cấu hình ứng dụng.
1.4.6.Ưu điểm của MVC
 Phát triển phần mềm: có tính chuyên nghiệp hóa, có thể chia cho nhiều nhóm
đƣợc đào tạo nhiều kỹ năng khác nhau, từ việc thiết kế cho đến lập trình tổ chức

database. Giúp phát triển ứng dụng nhanh hơn, đơn giản hơn, dễ nâng cấp ...
 Bảo trì: Với các lớp đƣợc phân chia nhƣ đã nói, thì các thành phần của một hệ
thống dễ dàng đƣợc thay đổi, nhƣng sự thay đổi có thể đƣợc cô lập trong từng
lớp hoặc chỉ ảnh hƣởng nhỏ tới lớp ngay gần kề nó chứ không làm phát tán, náo
loạn cho cả chƣơng trình.
 Mở rộng: Với các lớp đƣợc phân chia nhƣ đã nói, việc thêm chức năng mới vào
từng lớp sẽ dễ dàng hơn. Vì các lớp này hoạt động dƣờng nhƣ độc lập.
1.4.7.Nhược điểm của MVC
 Đối với các dự án nhỏ thì việc áp dụng mô hình MVC là một sự lãng phí.
1.5.Controller và Routing
1.5.1 Controller và Action Method
 Controller

13