BÀI 3 : MƠ HÌNH MVC CHO TRIỂN KHAI ỨNG DỤNG WEB
1. Khái niệm
1.2. Khái niệm MVC ASP.NET
ASP.NET MVC là nền tảng công nghệ mới nhất của Microsoft hiện nay là ASP.NET MVC, nó được thiết kế từ suy nghĩ là làm thế nào để xây dựng một phần mềm
cấp, nó kết hợp giữa tính hiệu quả và nhỏ gọn của mơ hình Model-ViewController (MVC), những ý tƣởng và công nghệ hiện đại nhất, cùng với những thành phần tốt nhất của nền tảng ASP.NET hiện thời. ASP.NET MVC ra đời không phải để thay thế cho ASP.NET Web Form mà nó phát triển theo một nhánh khác trong gia đình ASP.NET Framework.
Mơ hình MVC (Model - View -1 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. 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.
Lợi ích của ứng dụng web dựa trên mơ hình MVC:
- Có tính mở rộng do có thể thay thế từng thành phần một cách dễ dàng - Không sử dụng viewstate, điều này làm các nhà phát triển dễ dàng điều khiển ứng dụng của mình.
- Hệ thống định tuyến mới mạnh mẽ
- Hỗ trợ tốt hơn cho test-driven development (TDD) cài đặt các unit tests tự động, xác định và kiểm tra lại các yêu cầu trước khi bắt tay vào viết code.
- Hỗ trợ kết hợp rất tốt giữa người lập trình và người thiết kế giao diện. - Sử dụng các tính năng tốt nhất đã có của ASP.NET.
Nhược điểm của ASP.NET MVC:
- Không hướng đến sự kiện làm cho các nhà phát triển ASP.NET webform khó khăn.
- Yêu cầu hiểu biết về HTTP, HTML, CSS và JavaScript. - Thư viện của nhà phân phối thứ ba khơng mạnh bằng.
1.3. Mơ hình MVC trong JAVA: Lịch sử hình thành
MVC được phát minh bởi 1 giáo sư người Na Uy tên là Trygve Reenskaug và được ơng cơng bố, trình bày ngày 10/12/1979 tại phịng thí nghiệm Xerox PARC ở Palo Alto. - Ý niệm chính của mơ hình MVC là tách biệt phần ánh xạ, lưu trữ và xử lý dữ liệu (model) với thành phần trình bày giao diện kết quả cho người dùng hay phần giao diện giúp đón nhận dữ liệu nhập xuất cho người dùng (View).
xây dựng chức năng và xây dựng giao diện cho người dùng.
- Bên cạnh đó, ý niệm trên cho phép việc thay đổi thành phần của dữ liệu (Model) sẽ không ảnh hưởng nhiều đến giao diện (View) của người dùng.
- Tuy nhiên, một ứng dụng có thể có rất nhiều Model và nhiều View, do vậy, mơ hình cần có một thành phần lựa chọn và kết nối các thành phần này lại với nhau theo cách hiệu quả nhất mà người ta gọi là Controller.
Ví dụ thực tế:
2. Triển khai mơ hình MVC
- Triển khai ứng dụng web đó là việc cài đặt ứng dụng web lên web server để nó có thể được truy xuất bởi người dùng.
- Các yếu tố cần thiết cho việc triển khai ASP.NET MVC là + IIS phiên bản 5.1 trở lên
+ .Net framework phiên bản 3.5
2.1 Cài đặt IIS 7.0 trên window 7
- Vào control panel, chọn category Programs (Unistall a program) (Chế độ ViewBy là Category), xuất hiện màn hình như sau:
- Chọn các checkbox giống như hình trên, nhấn ok.
- Sau khi chọn xong, vào control panel, đổi chế độ viewby là Large icons, chọn mục Administrative Tools
- Sau khi cài xong IIS, mở browser, gõ “localhost” vào thanh address ta được kết quả sau:
2.2 Ánh xạ ứng dụng web asp.net MVC
Có 2 cách:
a. Triển khai web mvc lên localhost bằng chính cơng cụ visual studio - Nhấp phải chuột vào project, chọn property
- Sau khi chọn xong, nhấn vào nút Create Virtual Directory - Kết quả sau khi visual studio thực hiện đưa web lên localhost.
+ Triển khai web trên localhost bằng trình quản lý IIS
- Vào trình quản lý IIS, chọn như hình bên dưới
- Sau khi nhập xong thơng tin, nhấn ok, sau đó nhấp phải vào thư mục vừa mới tạo, và chọn Convert to Application.
- Cuối cùng, nhấp phải chuột vào ứng dụng web như hình bên dưới, và ta thu được kết quả như cách làm 1
3. Làm việc với Model 3.1. Khái niệm Model
- Models chứa tất cả các xử lý mang tính nghiệp vụ, tính logic trong truy
xuất cơ sở dữ liệu, cũng như tính hợp lệ trong ứng dụng. Nói cách khác, model chứa tất cả các logic ứng dụng, ngoại trừ logic view và controller.
3.2. Tạo Database:
- Chọn Item Sql Server Database, và gõ Products.mdf vào textbox Name, chọn Add
- Sau khi thêm mới cơ sở dữ liệu, nó sẽ nằm trong thư mục App_Data,
trong cửa sổ Server Explorer, nhấp phải chuột vào thư mục Tables, chọn Add New Table, Table gồm 4 cột. Cột đầu tiên là Id là khóa chính và mang giá trị tự động tăng
4. Làm việc với View4.1. Khái niệmView 4.1. Khái niệmView
View trong ứng dụng ASP.NET MVC được xem là giao diện của ứng dụng, View có tác dụng trả về cho trình duyệt trang HTML khi người dùng ghé thăm website của chúng ta. Views chứa các tag tương tự như HTML, chúng ta có thể đặt mọi thứ vào trong view như hình ảnh, iframes, java applets, flash và silverlight.
Cách tạo view dễ nhất là nhấp chuột phải vào action nào đó trong controller chọn Add View
Hình 3.1 Thêm một view mơi tứ controller action
thứ hai sẽ xuất hiện trong tag <body> của văn bản HTML.
* Lưu ý: chúng ta có thể tích hợp các scrip vào trong view thơng qua <% %>
Hình 3.4. Cách chèn scripts vào trong view
4.2. Cách sử dụng Views:
- Đôi lúc chúng ta muốn truyền thông tin qua lại giữa View và Controller,
đơn giản chúng ta sử dụng cơ chế ViewData được hỗ trợ bởi ASP.NET MVC . Trong đó, ViewData có thể miêu tả bất kỳ loại thơng tin nào như strings, objects và các mẫu tin cơ sở dữ
liệu
- ViewData giống như kiểu từ điển, nó bao gồm cặp thuộc tính khóa và giá trị, trong đó, khóa phải là chuỗi, cịn giá trị có thể là bất kỳ kiểu dữ liệu gì. - Khi sử dụng ViewData, chúng ta chú ý cần ép kiểu về kiểu dữ liệu mong
muốn, vì nó có thể chứa bất kỳ kiểu dữ liệu nào nên khi gán dữ liệu cho ViewData, ViewData tự dộng gán về kiểu objects
Ví dụ:
Hình 3.5. Cách tạo ViewData trong controller
Hình 3.7. Kết quả thu được
Nếu như chúng ta không muốn sử dụng view bằng cách ép kiểu, chúng ta có thể tạo một strongly typed view, khi đó từ điển viewdata triển khai một thuộc tính được đặt tên là Model
Hình 3.8. Cách tạo strongly typed view
5. Làm việc với Controller5.1. Khái niệmController 5.1. Khái niệmController
Controllers đảm nhận việc xử lý logic ở phía ứng dụng bao gồm việc
nhận giá trị đầu vào của ứng dụng, phát sinh các lệnh thực thi, nhận dữ liệu từ miền model, và đưa người dùng đi đến những UIs khác nhau.
Hình 3.11: HomeController được tạo ra bởi Visual
Từ hình 3.1 ta rút ra nhận xét rằng: khi user request vào trang index.aspx
thì controller sẽ xử lý yêu cầu của user bởi action “Index()”, khi user request muốn xem thông tin
Hình 3.12: Controller đáp ứng request từ user
5.2. Controller Actions
- Sau khi controller xác định và gọi action nào thì action đó có nhiệm vụ
trả kết quả về cho trình duyệt. Một controller có thể trả về một view, một file, hoặc đưa chúng ta
đến một action khác
* Controller action luôn trả về một ActionResult. Bộ khung ASP.NET MVC bao gồm các kiểu trả về như sau:
Bài tập thực hành của học sinh, sinh viên:
Bài tập 1: Tạo 1 project ASP.Net MVC đơn giản xuất ra câu chào” Hello Howkteam”
Hướng dẫn thực hiện như sau:
Ở phần thứ nhất chúng ta đã nắm được cách hoạt động của View, Controller rồi, bây giờ chúng ta cùng tạo 1 ví dụ đơn giản đó là xuất ra câu “Hello Howkteam” . Đầu tiên vào Controllers > Add > Controller
Tiếp theo, để hiển thị câu “Hello Howkteam” chúng ta cần có View hiển thị, cách tạo View như sau
Click phải chuột vào Index > chọn Add View. Sau đó các bạn làm theo các bước sau
Tại Template chọn Empty (without model), các bước cịn lại làm theo hình nhé. Sau khi tạo View Index xong thì để xuất câu “Hello Howkteam” thì thay đổi 1 chút:
Tại thẻ <h2></h2> chúng ta thay đổi nội dung bên trong: “Index” > “Hello Howkteam”. Sau đó các bạn vào RouteConfig trong App_Start để thay đổi Controller và Action > để chúng ta mặc định hiển thị trang chứa dòng chữ “Hello Howkteam” hiện lên đầu tiên
Tại controller chúng ta thay đổi nội dung bên trong Home > Example, cịn action thì các bạn giữ ngun giá trị là Index sau đó các bạn Run project lên kiểm tra, nếu màn hình chạy đúng như hình phía dưới thì các bạn đã tạo ví dụ thành cơng
BÀI 4: CÁC ĐỐI TƯỢNG VÀ QUẢN LÝ TRẠNG THÁIMã bài: MĐLTV-04 Mã bài: MĐLTV-04
Mục tiêu:
- Hiểu và trình bày được vài trò, cách sử dụng các đối tượng Request, Response, Server, Viewsate, Session, Cookie, Application
- Sử dụng các đối tượng Request, Response, Server, Viewsate, Session, Cookie, Application
trong việc triển khai ứng dụng web.
Nội dung chính: 1. Đối tượng Request
Đối tượng Request được dùng để nhận những thơng tin từ trình duyệt của người dùng gởi về cho Web Server. Những thông tin này gồm các thông số của Form khi được Submit dùng phương thức POST hoặc GET hay các tham số được ghi cùng với trang ASP.NET trong lời gọi đến trang đó.
Dùng đối tượng Request có thể chia sẻ thơng tin qua lại giữa các trang ASP.NET trong một ứng dụng và để lấy giá trị các Cookie lưu trữ trên máy Client.
Bảng thuộc tính và phương thức của Request
Phương thức /
thuộc tính Diễn giải
AccepTypes
Trả về mảng chuỗi của MIME được hỗ trợ bằng trình khách
ApplicationPath Trả về đường dẫn ảo của ứng dụng
BinayRead
Trả về mảng Byte chứa đựng thông tin nhị phân gởi đến Server
Browser Trả về đối tượng HttpBrowserCapabilities trình bày thơng tin của trình duyệt
ClientCertificate Trả về đối tượng HttpClientCertificate
ContentEncoding Tập kí tự của thực thểBody
ContentLength Chiều dài tính bằng byte của yêu cầu
ContentType Loại MILE của yêu cầu
Cookies Trả về đối tượng HttpCookiesCollection
Filepath Trả về đường dẫn ảo của yêu cầu
Files Trả về HttpFileCollection của tập nhiều tập tin được tải lên Server
Form Trả về tập dữ liệu của nội dung từForm
Header Trả về tập dữ liệu của nội dung từ HTTP Header
HttpMethod Trả về phương thức HTTP sử dụng cho yêu cầu
InputStream Là luồng dữ liệu chứa đựng các Input của Form
Params Lấy giá trị của phương thức trong Form, QueryString
Path Đường dẫnảo của yêu cầu
PathInfo Đường dẫn ảo của yêu cầu
PhysicalPath Đường dẫn vật lí của yêu cầu
QueryString Trả về một tập dữ liệu của nội dung từ QueryString
RawURL URL của yêu cầu
RequestType Phương thức HTTP sử dụng cho Resquest
TotalByte Dung lượng của Stream trong luồng dữ liệu
URL Đối tượng URL chứa đựng chi tiết của yêu cầu
MapPath Chuyển đổi đường dẫn ảo thành đường dẫn vật lý
SaveAs Lưu yêu cầu HTTP vào đĩa
Có 2 cách để gởi thơng tin đặc biệt từ trình duyệt đến Web server, đó là thơng tin từ phần <FORM> trong trang được đưa vào HTTP header hay được đưa trực tiếp vào chuỗi truy vấn trong địa chỉ liên kết URL. Đó chính là vai trị của 2 tập hợp QueryString và Form của đối tượng Request.
- Tập hợp QueryString:
- Để lấy được giá trị từ chuỗi truy vấn ta dùng: - Request.QueryString (“tên biến”).
- Khi đó thuộc tính của <FORM> phải được dung là METHOD = GET - Tập hợp Form:
- Để lấy được giá trị từ từ phần Header của HTTP ta dùng: - Request.QueryString (“tên biến”).
- Khi đó thuộc tính của <FORM> phải được dung là METHOD = POST - So sánh giữa hai tập hợp Form và QueryString:
- Theo phương pháp dùng QueryString có hạn chế đó là giới hạn chiều dài của chuỗi địa chỉ URL (khoảng 1000 kí tự) đây chính là yêu cầu của giao thức HTTP. Do đó sẽ rất phiền phức khi có yêu cầu gởi đi quá dài. Mặc khác, giá trị mà ta gởi đi được hiển thị rõ ràng trong ô địa chỉ URL trên trình duyệt máy Client nên dễ dàng bị người khác đọc được.
- Phương pháp dùng POST đã khắc phục được nhược điểm trên bằng cách đưa dữ liệu vào trong phần Header của HTTP.
2. Đối tượng Response
Trong hệ thống các đối tượng xây dựng sẵn của ASP.NET thì đối tượng Response đóng vai trị rất quan trọng. Khi mà đối tượng Request bao gồm những thông tin gởi đến Web server từ trình duyệt thì đối tượng Response nắm giữ những gì mà Web server phải gởi trả lại cho trình duyệt. Tóm lại, ta dùng đối tượng Response để gởi thông tin ra User, gồm có ghi thơng tin trực tiếp ra Browser, chuyển Browser đến địa chỉ URL khác hay để thiết lập các Cookie trên máy Client.
Bảng các thuộc tính và phương thức của đối tượng Response
Thuộc tính /
phương thức Diễn giải
BufferOutput Có sử dụng hay khơng bộ nhớ đệm cho kết xuất dữ liệu
Cache Trả về đối tượng HttpCachePolicy chứa đựng thông tin về quy định Cache của phúc đáp hiện hành
CacheControl Mặc dù còn hỗ trợ nhưng phương thức này còn đối nghịch trong phương thức của HttpCachePolicy
ContentEncoding Tập nhận dạng kết xuất, là một trong các giá trị như UnicodeEncoding, UTF7Encoding, UTF8Encoding
Output Trả về đối tượng TextWriter
OutputStream Đối tượng Stream dùng để trình bày hàng dữ liệu của
Status Gán trạng thái HTTP trả về cho trình khách
StatusCode Trạng thái HTTP Response
StatusDescription Gán diễn giải trạng thái HTTP và trả về cho trình khách, thuộc tính này đượcưu tiên hơn thuộc tính Status
ClearContent Xóa nội dung từBuffer Stream
ClearHeaders Xóa header từBuffer Stream
Close Đóng kết nối với Client
Redirect Chuyển hướng đến địa chỉ file trong cùng ứng dụng hay URL khác trong lúc thi hành
Writeln Ghi một luồng dữ liệu ra tập tin chỉ định
Write Ghi thơng tin từ các kiểu dữ liệu nhưChar, Object, String,
Ví dụ : Minh họa sử dụng đối tượng Request và Response
Bước 1 :Tạo 2 trang ASP.NET gồm trang NhapTen.aspx và trang XemChiTiet.aspx.
Bảng mơ tả các thuộc tính của các controls trang NhapTen.aspx.
Control Tên thuộc tính Giá trị thuộc tính
Lable Text Nhập tên
Lable Text Ngày Sinh
TextBox ID txtTen
TextBox ID txtNgaySinh
Button Text Xem chi tiết
Bảng mơ tả các thuộc tính của các controls trang XemChiTiet.aspx.
Control Tên thuộc tính Giá trị thuộc tính
Lable ID lblXemChiTiet
Bước 2 :Viết lệnh xử lý cho các trang như sau :
public partial class NhapTen : System.Web.UI.Page {
protected void Page_Load(object sender, EventArgs e) { } protected void btnXemChiTiet_Click(object sender, EventArgs e) {
//Lấy các giá trị đã nhập vào các TextBox string strHoTen = txtTen.Text;
string strNgaySinh = txtNgaySinh.Text; //Chuyển quan trang XemChiTiet.aspx
Response.Redirect("XemChiTiet.aspx?Ten="+strHoTen+"&NgaySinh="+strNgaySinh ); } }
Minh họa phần mã của trang NhapTen.aspx
public partial class XemChiTiet : System.Web.UI.Page {
protected void Page_Load(object sender, EventArgs e) {
//Lấy các giá trị từ trang NhapTen.aspx
string strNgaySinh = Request.QueryString["NgaySinh"]; lblXemChiTiet.Text = "Xin chào bạn :"+strHoTen+"<br>"+
"Ngày sinh của bạn là :"+strNgaySinh; }
}
Minh họa phần mã của trang XemChiTiet.aspx
Bước 3: Nhấn Ctrl+F5 để thi hành ứng dụng. Nhập tên và ngày sinh và nhấn nút
Xem chi tiếtKết qủa như hình sau.
public partial class LayThongTinTrinhDuyet : System.Web.UI.Page{ protected void Page_Load(object sender, EventArgs e)
{
Response.Write("Browser:" + Request.Browser.Browser+"<br>"); Response.Write("Version:" + Request.Browser.Version + "<br>");
Response.Write("Platform:" + Request.Browser.Platform + "<br>"); Response.Write("JavaScript:" + Request.Browser.JavaScript); }
Hình 5.3: Kết quả thi hành trang LayThongTinTrinhDuyet.aspx
3. Đối tượng Server
Đối tượng Server được sử dụng để cung cấp thơng tin của Server cho ứng dụng. +Thuộc tính MachineName
Thuộc tính này được dùng để lấy tên của Web Server.
+ Phương thức MapPath
Phương thức Mappath được dùng để lấy đường dẫn vật lý hoặc đường dẫn ảo đến một thư