xây dựng website thương mại điện tử ứng dụng công nghệ mvc của asp.net

 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ânquyề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 ASP.NET MVC Kiến trúc

- -ĐỒ Á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

- -ĐỒ Á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

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

Trong suốt quá trình chúng em thực hiện Luận văn tốt nghiệp, chúng emluôn nhận được sự quan tâm giúp đỡ của quý thầy cô, ban chủ nhiệm Khoa Côngnghệ 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ậnvă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!

1.1 Lịch sử phát triển của ASP.NET MVC. 41.2.Tổng quan về MVC. _51.3.Mô hình ASP.NET truyền thống (mô hình Web Form) 71.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 _131.5.Controller và Routing _13

1.5.1 Controller và Action Method 13

1.5.2 ASP.NET MVC Routing 191.6.View 20

1.6.1.Razor View Engine 20

1.8.1 AJAX 26

1.8.2.ASP.NET MVC AJAX Helpers _271.9.Giới thiệu mô hình ASP.NET MVC4 _28

1.9.1.Môi trường làm việc. 29

1.9.2.Các tính năng mới của MVC4 _29

CHƯƠNG 2: MÔ HÌNH CƠ SỞ DỮ LIỆU _31

2.1.Bảng dữ liệu. 312.2.Mô hình vật lý dữ liệu. _332.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 _38

3.1.1.Khởi tạo Website. _38 3.1.2.Source code thực hiện. _383.2.Mô hình chức năng _39

4.3.1.Chức năng đăng ký. _50

4.3.2.Chức năng đăng nhập. _514.4.Chức năng tìm kiếm. 51

4.4.1.Tìm kiếm theo tên. 51

4.4.2.Tìm kiếm nâng cao. _534.5.Chức năng đặt hàng. 54

4.5.1.Giỏ hàng. _54

4.5.2.Cập nhật giỏ hàng 54

4.7.1.Đếm số lượng truy cập. 62

4.7.2.Hỗ trợ trực tuyến _62

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

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

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

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

ASP Active Server PagesHTML HyperText Markup Language

UI User Interface

VB Visual BasicTDD Test Driven DevelopmentURL Uniform Resource Locator

DI Dependency InjectionIOC Inversion Of ControlOMR Object-Relational Mapping

Nhưng Asp.net Webform lại có những nhược điểm, việc dùng các webcontrolsinh ra các event để thực hiện cho UI(user interface) khi có sự tương tác với ngườidù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 racòn hỗ trợ nhiều View engine, cơ chế định tuyến Routing mềm dẻo giúp người pháttriể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 3lớ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ànghơ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

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ệtthì 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úpcá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ẽ thaythế cho Asp.net Webform trong tương lai gần Vì thế áp dụng ASP.NET MVC 4

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

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ớitên gọi ban đầu là ASP+, tên chính thức sau này là ASP.NET Với ASP.NET, khôngnhữ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 Editorpattern, nhưng sau đó nó được đặt tên lại là Model View Controller pattern ASP.NETMVC lần đầu tiên xuất hiện đó là trong dự án mã nguồn mở MonoRail Và nguồn gốcthật sự để cho ra đời công nghệ Microsoft ASP.NET MVC là do Scott Guthrie(mộttrong 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.NETMVC 1.0 (released) được ra đời Các năm sau đó các phiên bản tiếp theo ra đời vớinhữ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ó đượcthiế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.NETMVC được thiết kế để làm sao có thể bổ sung các nguyên lý và các patterns phát triểnphầ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ử

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)

ứ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

Đả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 formhoặ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ữngphươ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ạicho người dùng

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ỗicontrol có trạng thái của riêng mình, tự động sinh mã HTML khi cần, và tự động kếtnố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ớicá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

 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 serversinh 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ếnkhích nên trộn việc trình bày code (ví dụ: việc quản lý control phía server) vớitính logic trong ứng dụng của họ (ví dụ: thao tác cơ sở dữ liệu) với nhau Tốthơ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áttriể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ợpvớ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à logicgiao 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áchriêng của mình bằng việc sử dụng engineer view riêng, định tuyếnURL(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épngườ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ượngcủ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

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ềunà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ânquyề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 ASP.NET MVC

Kiến trúc chương trình Kiến trúc mô hình 3 lớp

WebForm: Presentation Business - Data Access

-Kiến trúc sử dụng việcphân chia chương trìnhthành Controllers, Models,Views

Truy cập dữ liệu Sử dụng hầu hết các công

nghệ truy cập dữ liệu trongứng dụng

Phần lớn dùng LINQ toSQL class để tạo mô hìnhtruy cập đối tượng

Debug Debug chương trình phải

thực hiện tất cả bao gồmcác lớp truy cập dữ liệu, sựhiển thị, điều khiển cáccontrols

Debug có thể sử dụng cácunit test kiểm tra cácphương thức trongcontroller

Tốc độ tải Tốc độ tải chậm khi trong

trang có quá nhiều các

Tải nhanh hơn do khôngphải quản lý ViewState để

controls vì ViewState quálớn

quản lý các control trongtrang

Tương tác với Javascript Khó khăn Dễ dàng

URL Address Cấu trúc địa chỉ URL có

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

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ớinhau 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ệnHTML để 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ấplinh 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ườngkhả năng kiểm thử Đỗng nghĩa với việc View state của ASP.NET và vòng đời trongWeb 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

 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, hayProductController

 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ếnURL, 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ứcdatabase 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ừnglớ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áoloạ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

ASP.NET MVC ánh xạ URL đến các lớp gọi là Controller Controller xử lý yêucầu gửi đến, các đầu vào của người dùng và tương tác, trả về các giao diện sử dụngthích hợp Một Controller thường gọi đến một thành phần View để sinh mã HTML trả

về

Lớp cơ sở cho tất cả các Controller là lớp ControllerBase, cung cấp các xử líMVC Controller kế thừa từ ControllerBase Controller chịu trách nhiêm cho các giaiđoạn xử lí sau đây:

 Định vị các Action Method thích hợp để gọi và xác nhận rằng nó có thể đượcgọi

 Nhận các giá trị để sử dụng như tham số của Action Method

 Xử lí các lỗi xảy ra trong khi thực hiện Action Method

 Cung cấp lớp WebFormViewEngine để sinh thành phần View

Tất cả Controller đều phải đặt tên có hậu tố “Controller” Ví dụ sau đây mô tảHomeController, Controller này chứa các Action Method, sinh ra các View

 Action Method

Trong các ứng dụng ASP.NET không sử dụng nền tảng MVC, sự tương tác củangười dùng được tổ chức theo các trang và theo việc phát ra và quản lý các sự kiện củatrang và các điều khiển trên trang đó Để so sánh, thì với các mô hình MVC, sự tươngtác với người dùng được tổ chức theo các controllers và các action của chúng Lớpcontroller sẽ định nghĩa các phương thức action Các controller có thể có bao nhiêuaction tùy nhu cầu

Các phương thức action thường được ánh xạ 1-1 với các tương tác của ngườidùng Ví dụ như người dùng điền một URL vào trình duyệt, hoặc nhấn vào một liênkết, hoặc gởi lên một form Các tương tác nói trên tạo ra request được gởi lên choserver Khi đó, URL của request được gởi lên sẽ có các thông tin mà nền tảng MVC sẽ

sử dụng để tìm kiếm và thực thi phương thức action

Khi người dùng gõ một URL vào trình duyệt, ứng dụng MVC sẽ sử dụng cácquy tắc định tuyến (routing rules) được định nghĩa ở tập tin Global.asax để phân tíchURL và xác định đường dẫn của controller Sau đó controller sẽ xác định action tương

ứng để xử lý request Ví dụ như, trong trường người dùng gõ vào địa chỉ URL là http://

contoso.com/MyWebSite/Products/Categories thì đường dẫn con sẽ như sau: /Products/Categories Tuyến mặc định (default routing) sẽ xem Products như là phần

tiền tố của tên controller, nghĩa là controller được chọn có tên là ProductsController

Và “Categories” được xem như là tên của action, như vậy thì phương thức Categoriescủa ProductsController sẽ được thực thi để xử lý request Nếu URL kết thúc bằng

/Products/Detail/5 tuyến mặc định sẽ xem như Detail là tên của Acion, và phương thức

Detail của ProductController sẽ được gọi để xử lú request Theo tuyến mặc định, thì giátrị “5” trong URL sẽ được truyền vào phương thức Detail như là một tham số

Ví dụ dưới đây cho thấy cài đặt của một action có tên là CN11LT

public class MyController : Controller

{

public ActionResult CN11LT() {

ViewBag["Message"] = "Công nghệ thông tin liên thông khóa 11!";

return View();

} }

 Kiểu trả về ActionResult

Phần lớn các phương thức action đều trả về một đối tượng thuộc lớp kế thừa từlớp ActionResult Lớp ActionResult là lớp cơ sở cho các kết quả trả về của các action.Tuy nhiên, có nhiều loại kết quả trả về từ action Ví dụ, phần lớp các action khi đượcgọi đều trả về lời gọi phương thức View Phương thức View sẽ trả về một đối tượngcủa lớp ViewResult, lớp này lại là lớp kế thừa từ ActionResult Bạn có thể tạo cácphương thức action có thể trả về một đối tượng thuộc bất kỳ kiểu nào, có thể là kiểuchuỗi, số nghuyên, hay là kiểu bool Các kết quả trả về sẽ được bọc bởi một đối tượng

kế thừa từ lớp ActionResult trước khi chúng được trả về cho Response Stream.

Bảng 1.3: Liệt kê các kiểu action result và các phương thức hỗ trợ để trả về

Action Result Helper Method Mô tả

ViewResult View Trả về view như là một trang web PartialViewResult PartialView Trả về như là một phần của trang web RedirectResult Redirect Chuyển đến các action khác bằng cách

sử dụng URL của chúng RedirectToRouteResult RedirectToAction

RedirectToRoute

Chuyển đến một action khác

định nghĩa JsonResult Json Trả về một đối tượng được kết xuất

theo định dạng JSON JavaScriptResult JavaScript Trả về đoạn mã javascript để có thể

thực thi được ở client FileResult File Trả về kết quả nhị phân để ghi lên kết

quả trả về EmptyResult (None) Đại diện cho giá trị trả về mà nó được

dùng khi phương thức action phải trả

về một giá trị null

.

 Đánh dấu các phương thức Public để chúng không được xem là các action

Mặc định, MVC sẽ xem tất cả các phương thức public của controller như làaction Nếu lớp controller của bạn có chứa phương thức public như bạn lại khôngmuốn nó là một action, bạn phải sử dụng thuộc tính NonActionAttribute để quy định

 Các tham số truyền vào Action Method

Các giá trị được truyền qua tham số của các action được lấy từ tập dữ liệu củađối tượng request, từ đối tượng RouteData và từ form dữ liệu được gửii lên Nếu giá trịtham số không được truyền vào, và nếu kiểu dữ liệu của tham số là một kiểu tham

chiếu (reference type) hoặc là một kiểu dữ liệu có thể chấp nhận giá trị null, thì null sẽ

được gửii vào như là giá trị của tham số Ngược lại, sẽ có ngoại lệ được ném ra Ngoàicách truy xuất bằng cách tham số được định nghĩa một cách tường mình, bạn có thể sửdụng các thuộc tính Response và Request của lớp Controller để truy xuất đến các tham

số Hai tham số này chính là hai đối tượng HttpRequestvà HttpResponse trong mô hìnhASP.NET truyền thống Đoạn mã ví dụ dưới đây cho thấy cách sử dụng đối tượngRequest để lấy về giá trị của tham số có tên là id:

public void Detail()

{

int id = Convert.ToInt32(Request["id"]);

}

 Tự động ánh xạ các tham số của action

Nền tảng ASP.NET MVC có thể tự động ánh xạ tham số từ URL đến các tham

số của action Khi bạn định nghĩa action có tham số, MVC sẽ kiểm tra dữ liệu củarequest và xác định xem có giá trị nào trùng tên với các tham số không, nếu có thì sẽlấy các giá trị đó để truyền vào các tham số Ví dụ dưới đây sẽ không sử dụngRequest[“id”] như ở phương thức ví dụ ở trên, thay vào đó, action sẽ được quy địnhtham số id một cách tường minh, và MVC sẽ tự động ánh xạ giá trị của Request[“id”]vào tham số id:

public ResultAction Detail(int id)

{

ViewData["DetailInfo"] = id;

return View();

}

Bạn cũng có thể thêm tham số như là một phần của URL thay vì sử dụng các

chuỗi truy vấn Ví dụ, thay vì sử dụng /Products/Detail?id=3, bạn có thể sử dụng một URL có dạng /Products/Detail/3 Quy tắc ánh xạ tuyến mặc định có định dạng là

/{controller}/{action}/{id} Và lúc đó 3 sẽ là giá trị của tham số id Ngoài ra bạn cũng

có thể quy định kiểu chấp nhận giá trị (null-able type) để truyền các tham số có thểkhông có giá trị được gửi lên như sau:

{

if(!date.HasValue) {

Khi xử lý những incoming url, công việc của routing system là tìm pattern nàokhớp với url Sau khi routing system tìm được pattern phù hợp, nó bắt đầu tiến hànhchiết những giá trị từ url cho các biến segment được định nghĩa trong pattern Chúng tadùng cặp dấu {} để “đóng dấu” các biến segment

Có nhiều route trong ứng dụng của chúng ta Routing system sẽ tìm cho tới khinào có một route khớp với pattern của incoming url

Khi ứng dụng MVC chạy, hàm Application_Start() sẽ được gọi, hàm này gọi lại hàm

RegisterRoutes() Hàm RegisterRoutes() sẽ tạo ra bảng ánh xạ Routing

1.6.View

1.6.1.Razor View Engine

ASP.NET MVC hỗ trợ khái niệm “View Engine”, đó là các Module cài đặt cácmẫu tùy chọn cú pháp khác nhau View Engine mặc định được sử dụng là các mẫu nhưfile aspx, ascx như trong mô hình Web Form cũ Bên cạnh đấy còn có Spark ViewEngine và Nhaml Hiện tại View Engine mới nhất dành cho ASP.NET là Razor, đây làEngine được đánh giá là tối ưu mạnh code HTML, cú pháp thân thiện cho lập trìnhviên Trong nội dung chuyên đề này, chúng ta sẽ tìm hiểu kỹ về Razor

Những điểm mạnh của Razor:

 Nhỏ gọn: Razor giảm thiểu số lượng ký tự và thao tác gõ phím cần thiết trong

một tệp tin Không giống như phần lớn các cú pháp khác, bạn không cần ngắt

các đoạn code để chỉ thị thực hiện câu lệnh ở Server, cú pháp được phân tíchthông minh để thực hiện điều này

 Dễ học: Razor rất dễ học, bạn có thể nhanh chóng làm quen với cú pháp này, tất

cả bạn cần là sử dụng những kỹ năng code HTML và các ngôn ngữ khác mà bạnbiết

 Không phải ngôn ngữ mới: Razor là sự kết hợp của HTML và các ngôn ngữ

lập trình xử lý trong NET như C# và VB

 Làm việc với nhiều trình soạn thảo: Razor không đòi hỏi một công cụ soạn

thảo cụ thể nào, bạn có thể sử dụng bất kỳ công cụ nào mình thích kể cảNotepad

 Khả năng nhắc lệnh (Intellisense): Nếu sử dụng Razor cùng Visual Studio,

bạn có thể sử dụng khả năng gợi ý lệnh tuyệt vời này

 Hỗ trợ Unit Test: Razor cho phép kiểm thử từng thành phần mà không yêu cầu

thông qua Controller hay một Web server

Razor View Engine có đuôi mở rộng là cshtml

1.6.2.Master Page

Master Page là một khái niệm đã có trong lập trình Web Form, trong MVC thì

nó có tên là Layout Mục đích thì giống nhau, nhằm bố cục cho toàn bộ Website

<link rel="shortcut icon" href="@Url.Content("~/Content/images/fav.ico")">

<script src="@Url.Content("~/Scripts/jquery-1.7.1.js")" type="text/javascript"></script>

<link href="@Url.Content("~/Content/style.css")" rel="stylesheet" type="text/css" />

</head>

<body>

<div id="header">

<div id="header_wrap" class="row">

<p id="logo"><a href="/">Lost and<span class="semi"> Found</span></ a><span id="tagline">Found Any things</span></p>

Với code trên, chú ý đến RenderBody() chính là vị trí mà code HTML của các

site con được chèn vào Có thể có nhiều file Layout vì thế ở site phải được định nghĩa

nó được kế thừa từ site nào, mặc định là sẽ ké thừa từ _Layout.cshtml:

1.6.3.Partial View

Trong đoạn code phía trên, chúng ta thấy có dòng lệnh @Html.Partial

("_LogOnPartial”) đây là cách gọi đến 1 Partial View Thực chất đây là một đoạn

View và cải thiện khả năng sử dụng của một trang web đồng thời giảm bớt khả năngtrùng viết mã trùng lặp hay phải viết lại mã lệnh đã có trước, khái niệm này tươngđương với UserControl trong lập trình Web Form

1.6.4.HTML Helpers

HTML Helpers là các phương thức trong View, nó hoàn trả lại nội dung HTML,phần lớn trả về một chuỗi Chúng ta có thể xây dựng ứng dụng ASP.NET MVC màkhông cần HTML Helpers, tuy nhiên, HTML Helpers giúp cho các nhà phát triển Web

dễ dàng thao tác hơn trong việc code HTML

HTML Link có thể được tạo ra như sau :

@Html.ActionLink("About this Website", "About")

Ngoài ra, HTML Helper có thể dùng để sinh ra các thành phần HTML như

1.6.5.Validation Form Data

Validation form data cho phép chúng ta kiểm tra xem liệu người dùng đã nhậpđúng dữ liệu được yêu cầu hay chưa Và trong ASP.NET MVC, chúng ta miêu tả lỗi

hợp lệ (validation errors) của form bởi thuật ngữ Model State Dictionary

Model state, bản thân nó giống như một cuốn từ điển, chứa một tập các trạng thái mẫu(Model state), nhằm biểu diễn trạng thái của các thuộc tính đặc biệt Chúng ta truyềnlỗi hợp lệ từ Action Controller đến View và ngược lại, bằng việc truyền thông qua từ

đều chứa thuộc tính được đặt tên là ModelSate, thuộc tính này triển khai từ điển trạngthái mẫu

Validation Helpers:là một trong số các cách bạn có thể sử dụng để phát hiện tính khônghợp lệ do người dùng nhập sai

1.7 Model(Data)

1.7.1.ORM(Object-Relational Mapping)

Bên cạnh cách truy vấn dữ liệu thông qua các SQL query truyền thống ,ASP.NET còn hỗ trợ việc truy vấn dữ liệu thông qua mô hinh ORM(Object-RelationalMapping) ORM là một phương pháp lập trình để chuyển đổi từ mô hình database sang

mô hình đối tượng

ORM có nhiều thuận lợi hơn so với những phương pháp truy cập dữ liệu (data access)khác:

 ORM tự động hóa việc chuyển đổi từ object sang table và từ table sang object,giúp giảm thời gian và chi phí phát triển

 ORM cần ít code hơn store procedures, thay thế số lượng lớn store procedudrescần phát triển

 Tăng tốc độ thực thi của hệ thống

Ở ASP.NET MVC, ORM được cụ thể hóa bằng Entity Framework

Nếu bạn đã có cơ sở dữ liệu, DF có thể sinh ra mô hình dữ liệu bao gồm các lớp

và các thuộc tính tương ứng với các đối tượng trọng CSDL như bảng và cột Các thôngtin về cấu trúc CSDL (Schema), dữ liệu và liên kết giữa chúng được lưu thành một cấu

trúc XML trong file edmx Visual Studio cho phép bạn có thể chỉnh sửa các nội dungnày

 Model First (MF)

Nếu chưa có CSDL, bạn có thể tạo ra một mô hình dữ liệu quan hệ bằng cách sửdụng công cụ thiết kế trong Visual Studio Khi tạo xong, có thể sinh DDL(datadefinition language hay ngôn ngữ định nghĩa dữ liệu) Cách tiếp cận này cũng sử dụngfile edmx để lưu trữ mô hình dữ liệu quan hệ mà các thông tin liên kết

 Code First (CF)

Dù bạn có CSDL hay không, bạn hoàn toàn có thể tạo ra các lớp và các thuộctính tương ứng với các bảng và cột trong CSDL mà không cần file edmx Đó lànguyên tắc của cách tiếp cận Code First Bạn viết các lớp để định nghĩa dữ liệu, CSDL

sẽ được sinh ra khi hệ thống thực thi Cấu trúc của CSDL và dữ liệu thực được xử lýtheo một ánh xạ API đặc biệt

1.8 AJAX trên ASP.NET MVC

1.8.1 AJAX

AJAX(Asynchronous JavaScript and XML) là một nhóm các công nghệ pháttriển web được sử dụng để tạo các ứng dụng web động hay các ứng dụng giàu tínhInternet (rich Internet application) Ajax là một kỹ thuật phát triển web có tính tươngtác cao bằng cách kết hợp các ngôn ngữ:

 HTML (hoặc XHTML) với CSS trong việc hiển thị thông tin

 Mô hình DOM (Document Object Model), được thực hiện thông qua JavaScript,nhằm hiển thị thông tin động và tương tác với những thông tin được hiển thị

 Đối tượng XMLHttpRequest để trao đổi dữ liệu một cách không đồng bộ vớimáy chủ web (Mặc dù, việc trao đổi này có thể được thực hiện với nhiều địnhdạng như HTML, văn bản thường, JSON và thậm chí EBML, nhưng XML làngôn ngữ thường được sử dụng)