2.1.1. Khung kiến trúc MVC
Kho câu hỏi trắc nghiệm theo chuẩn QTI là một ứng dụng cơ sở dữ liệu dựa trên nền Web. Một ứng dụng điển hình dạng này thƣờng có kiến trúc 3 tầng, gồm tầng giao diện ngƣời sử dụng, tầng truy cập dữ liệu và tầng xử lý. Khung kiến trúc MVC đƣợc sáng tạo ra để thiết kế các ứng dụng dạng này.
Kiến trúc mô hình - khung nhìn - trình điều khiển hay MVC (Model – View – Controller) là một kiến trúc phần mềm theo khuôn mẫu, tách biệt phần thực hiện chức năng xử lý với dữ liệu đầu vào và trình bày trang giao diện dành cho ngƣời sử dụng. Mục đích của MVC là thông qua việc tách biệt xử lý dữ liệu với hiển thị trang web sẽ làm thiết kế kiến trúc đơn giản hơn cho phép tăng tính linh hoạt, có thể phát triển, kiểm thử và bảo trì từng phần độc lập nhau.
Nói ngắn gọn, phần mô hình (model) là nói về mô hình biểu diễn dữ liệu và xử lý nghiệp vụ đặc thù cho bài toán ứng dụng. Khung nhìn (view) là phần biểu hiện dữ liệu do mô hình cung cấp sao cho dễ tƣơng tác, thƣờng là dƣới dạng các phần tử giao diện ngƣời sử dụng. Trình điều khiển (controller) xử lý sự kiện, chuyển các hành động của ngƣời sử dụng thành các phép xử lý của mô hình.
Controller
View Model
Trong hình trên, mũi tên biểu thị mối quan hệ một thành phần quan tâm theo dõi (is aware of) thành phần kia. Đƣờng nét đứt biểu thị rằng mối quan tâm là gián tiếp.
Ví dụ về một mô hình thực tế tiếp cận khái niệm của mô hình MVC. Mô hình này mô tả về công việc xem truyền hình, mô hình đƣợc mô tả nhƣ sau:
- Một ngƣời A muốn xem các phim chọn lọc đƣợc lựa chọn từ các đĩa CD/DVD trên màn hình Tivi của nhà A
- Để đọc đƣợc đĩa CD/DVD thì phải dùng đầu máy đọc đĩa của nhà A - Đầu máy này không có nút điều khiển trực tiếp, đầu máy này nhận hàng loạt các đĩa – tối đa là 5 cái, do vậy muốn kích hoạt và chọn đĩa xem A bắt buộc phải sử dụng remote control – điều khiển từ xa
Nhƣ vậy, để xem phim A sẽ làm nhƣ sau:
- A sẽ sử dụng remote control điều khiển đầu máy để chọn đĩa mà A thích xem nhất để mở nó ra
- Đĩa đƣợc chọn đọc đĩa và trình chiếu trên màn hình Tivi
- Khi dữ liệu đã hiển thị trên màn hình Tivi thì A sẽ thấy đƣợc nội dung - Và cách thức này sẽ đƣợc lặp đi lặp lại khi A chọn một phim khác, đó là vẫn dùng điều khiển để chọn đĩa và đầu đĩa đƣa dữ liệu lên màn hình Tivi và A nhìn thấy.
Mô hình đƣợc mô tả nhƣ hình vẽ sau:
Qua hình ảnh mô tả trên, chúng ta thấy rằng:
- Đầu máy là nơi xử lý dữ liệu, chọn lựa cách thức xử lý, nội dung cần thiết, nghĩa là đầu máy là Model
- Màn hình Tivi chỉ làm nhiệm vụ duy nhất để trình bày kết quả mà đầu máy – Model đã thực hiện, đƣợc lựa chọn. Màn hình Tivi không thể lựa chọn và không có cách chọn lựa là trình bày các thành phần truyền đến đã đƣợc xử lý. Màn hình Tivi là View
- Thành phần hỗ trợ đƣa dữ liệu từ Model đến View đó là điều khiển, ngoài ra điều khiển cũng là nơi kết nối ngƣời dùng với đầu máy với màn hình Tivi. Chức năng của điều khiển là chọn đúng model để đƣa ra view. Điều khiển – remote control là một Controller
Dựa vào ví dụ trên ta thấy đƣợc sự tối ƣu của MVC đó là:
- Khi thay đổi màn hình Tivi đang xem thành màn hình Tivi khác thì việc thay đổi không ảnh hƣởng gì đến toàn hệ thống
- Tƣơng tự nhƣ thế nếu đầu máy hƣ thì thay đổi máy khác vẫn không ảnh hƣởng gì lớn
Nhƣ vậy, việc tách biệt giúp ta có nhiều lợi ích trong việc phân chia công việc và các xử lý công việc
2.1.2. Lịch sử MVC
MVC đƣợc hình thành bởi các nghiên cứu của Trygve Reenskaug vào khoảng các năm 1978-1979. Sau đó nó đƣợc điều chỉnh và đƣợc cài đặt lần đầu tiên vào các lớp của thƣ viện Xerox PARC Smalltalk-80. Hiện tại MVC đƣợc sử dụng rộng rãi nhƣ là kiến trúc cơ bản trong các môi trƣờng lập trình web, chúng ta có thể liệt kê sự có mặt của mô hình MVC trong nhiều các nền tảng lập trình nhƣ:
- Swing Components của Java
- QT4(KDE)
- Apple’s Cocoa (Core Data)
Quá trình phát triển của MVC gồm các giai đoạn sau:
- Không có khái niệm gì về mô hình: Tất cả thiết kế đều tập trung viết code trực tiếp trên các ngôn ngữ script và ngôn ngữ tag để hỗ trợ trình bày dữ liệu trên Browser – dạng web tĩnh. Đây chính là các trang html có nhúng javascript. Với kiểu thiết kế này sẽ rất phức tạp và rắc rối cho ngƣời phát triển web khi cần chỉnh sửa các trang web đã hoàn tất.
- Mô hình MVC1: Là mô hình tƣơng tự nhƣ html nhƣng các trang web ở dạng động có thể đón nhận và trình bày dữ liệu từ server nhƣng tất cả các trang liên kết đều là các đƣờng dẫn tĩnh và các cách thức xử lý đều thực hiện trực tiếp trên trang. Ngoài ra, các trang thực hiện gọi trực tiếp lẫn nhau. Mô hình này chỉ phù hợp với ứng dụng nhỏ vì các đƣờng dẫn rất khó để tìm kiếm và sửa đổi, đặc biệt với trang trộn lẫn giữa code html, javascript, xml, javacode …
Hình 2.3: Cơ chế thực hiện của Mô hình MVC1
BROWSER JSP JavaBean XML or File Web Server Server chọn trang JSP xử lý theo yêu cầu gửi từ browser 1 Request Response 5 3 2 4
Hình 2.4: Ví dụ về mô hình MVC1
- Mô hình MVC2: Đây là mô hình thực tế áp dụng tiếp cận theo đúng khái niệm đã nêu ở trên, tách biệt từng thành phần, tạo nên sự uyển chuyển khi vận dụng và cài đặt, đặc biệt là bảo trì, nâng cấp.
Hình 2.5: Cơ chế thực hiện của Mô hình MVC2
BROWSER (Controller) Servlet (Model) JavaBean XML File Web Server
Controller đón nhận request và xác định Model
1
Request
Response
Controller gửi View qua response
(EIS)
Controller tạo ra instance của JavaBean để đón nhận các giá trị nhập từ request (View) JSP 8 5 7
Servlet Controller thực hiện tạo hay lựa chọn View
3 2 4
6
Model đƣa kết quả xử lý hay dữ liệu cập nhật lại trang kết quả View
Cơ chế thực hiện của mô hình MVC2:
+ Web Browser gửi request đến server thông qua các control trên form HTML hay JSP, hay query string url hay qua cookies.
+ Servlet – Controller đón nhận request và xác định Model tƣơng ứng để tạo ra instance của JavaBean để đón nhận các giá trị nhập từ request để lƣu trữ và xử lý
+ Model thực hiện xử lý, kết nối dữ liệu vật lý dƣới DBMS (nếu có) và trả kết quả trả về cho Controller
+ Kết quả xử lý đƣợc chuyển vào Servlet – Controller, Servlet Controller thực hiện tạo hay lựa chọn View để từ đó đƣa kết quả xử lý hay dữ liệu lấy từ Model để cập nhật lại trang kết quả View.
+ Controller gửi View qua response cho ngƣời dùng để browser có thể trình bày dữ liệu trong Web Browser
Cơ chế thực hiện trên cho thấy mọi tập trung xử lý và kết xuất đều hƣớng vào Controller
2.1.3. Các thành phần trong MVC 2.1.3.1. Mô hình
Mô hình (model) là nói về mô hình biểu diễn dữ liệu và tính toán xử lý mà ứng dụng thực hiện. Trong MVC mô hình là phần chứa các mã lệnh thực hiện truy vấn, xử lý dữ liệu. Khi có thay đổi dữ liệu trong mô hình, nó sẽ báo cho khung nhìn để làm tƣơi lại, phản ánh kịp thời những thay đổi đó. Nhìn chung các ứng dụng sử dụng một cơ sở dữ liệu để lƣu trữ dữ liệu bền vững. Trong khung kiến trúc MVC, tầng truy cập dữ liệu đƣợc hiểu là nằm trong phần mô hình. Phần mô hình không quan tâm đến cách hiển thị kết quả.
Nhƣ vậy, mô hình là một tập hợp nhiều hàm công cộng để thực hiện các chức năng xử lý mong muốn. Trong đó có các truy vấn cho phép ngƣời sử dụng lấy thông tin về trạng thái hiện tại của mô hình. Mô hình cũng có các
phƣơng thức cho phép biến đổi trạng thái. Mô hình phải có khả năng đăng ký các khung nhìn và có thể thông báo cho tất cả các khung nhìn đã đăng ký mỗi khi một hàm nào đó của nó gây ra thay đổi trạng thái. Một mô hình trong MVC có thể có vài khung nhìn khác nhau.
2.1.3.2. Khung nhìn
Khung nhìn (view) là phần biểu hiện mô hình xử lý sao cho dễ tƣơng tác, thƣờng là dƣới dạng các phần tử giao diện ngƣời sử dụng. Khung nhìn chứa các mã lệnh để hiển thị dữ liệu và các thành phần GUI tƣơng tác với ngƣời sử dụng. Trong các ứng dụng web, khung nhìn chính là các trang web khác nhau. Có thể có nhiều khung nhìn đối với một mô hình dành cho từng mục đích khác nhau.
Trong mô hình ứng dụng Web thì html, servlet, jsp … là những thành phần đại diện cho khung nhìn.
2.1.3.3. Trình điều khiển
Các khung nhìn trong MVC gắn với các trình điều khiển (controller). Khi ngƣời sử dụng tƣơng tác với khung nhìn, trình điều khiển sẽ cập nhật mô hình dữ liệu. Trình điều khiển gọi các phƣơng thức (thuộc mô hình) để thay đổi trạng thái của mô hình. Dĩ nhiên, sau đó mô hình sẽ thông báo tới tất cả các khung nhìn đã đăng ký rằng đã có sự thay đổi và các khung nhìn này sẽ cập nhật lại hiển thị của chúng một cách thích hợp.
Trong môi trƣờng Java, các trình điều khiển là các trình lắng nghe sự kiện (listeners) trong hệ thống xử lý sự kiện. Với ứng dụng Web thì Servlet đóng vai trò của trình điều khiển, trình điều khiển nhận yêu cầu HTTP (request) và khởi tạo các đáp ứng HTTP (response) bằng cách gọi các servlet hay các kịch bản lệnh (script) thích hợp để xử lý.
2.1.4. Mối quan hệ giữa các thành phần trong mô hình MVC
Một ứng dụng MVC có thể là một tập hợp các bộ ba mô hình/ khung nhìn/ bộ điều khiển, mỗi bộ ba chịu trách nhiệm về một phần tử giao diện ngƣời sử dụng khác nhau.
Giữa Controller và Model thì controller phụ thuộc vào model bởi vì controller đƣợc thiết kế để kết nối với model, điều khiển, truy xuất model. Do vậy, model có sự thay đổi là controller phải thay đổi theo để có thể truy xuất và điều khiển model cho phù hợp
Giữa Model và View thì View lệ thuộc vào Model bởi vì khi các tổ chức interface của Model thay đổi nghĩa là View phải thay đổi theo.
Giữa View và Controller thì Controller sẽ là đối tƣợng lựa chọn View tùy thuộc theo việc yêu cầu sử dụng của ngƣời dùng, tùy thuộc theo kết quả xử lý của Model
2.1.5. Ƣu điểm của MVC
Kiến trúc MVC nhằm tách biệt các mối quan tâm, tách phần trình bày dữ liệu ở mặt trƣớc khỏi phần tổ chức và xử lý dữ liệu ở mặt sau. Nó mang lại các lợi thế sau:
- Cho phép phát huy tốt nhất kỹ năng chuyên sâu của nhà phát triển ứng dụng.
- Cho phép duy trì song song cùng một lúc nhiều sơ đồ, nhiều cách trình bày dữ liệu khác nhau.
- Giữ cho ứng dụng có kiến trúc nhất quán, thuận tiện làm việc theo nhóm, dễ dàng sửa đổi và bảo trì nâng cấp.
2.1.6. Luồng công việc trong kiến trúc MVC
Hình 2.6: Luồng công việc trong kiến trúc MVC cho ứng dụng web
Hình trên minh họa luồng công việc trong kiến trúc MVC, trong đó: (1) Trình điều khiển tiếp nhận dữ liệu từ các yêu cầu GET hay POST (2) Trình điều khiển khởi tạo các đáp ứng (response) bằng cách gọi các hàm xử lý thuộc mô hình.
(3) Hàm xử lý trả kết quả về cho trình điều khiển
(4) Tùy theo kết quả xử lý, trình điều khiển chọn khung nhìn thích hợp để hiển thị dữ liệu và giao diện tƣơng tác với ngƣời sử dụng
(5) Khung nhìn lấy dữ liệu từ mô hình
(6) Hàm xử lý trả kết quả để khung nhìn hiển thị
Các bƣớc 2, 3, và 5, 6 là tùy chọn theo từng trƣờng hợp.
2.1.7. Khung kiến trúc MVC cho một ứng dụng web
MVC thƣờng áp dụng cho các ứng dụng web. Trong ứng dụng web, khung nhìn là tài liệu HTML/XHTML mà ứng dụng sinh ra. Các trình điều khiển tiếp nhận dữ liệu từ các yêu cầu HTTP kiểu GET hay POST và quyết định chuyển giao xử lý tới các đối tƣợng (các servlet, thuộc phần mô hình) chứa quy tắc xử lý.
Dựa trên khung kiến trúc MVC cho một ứng dụng web với phía khách gầy (thin-client), hình dƣới đây minh họa kiến trúc MVC cho ứng dụng web
Controller View Model (2) function calls http req (1) data (3) select (4) view (6) data (5) function calls
triển khai mô đun xử lý bài thi của thí sinh theo chuẩn QTI dựa trên hệ cơ sở dữ liệu XML.
Hình 2.7: Kiến trúc MVC của mô đun xử lý bài thi theo chuẩn QTI với cơ sở dữ liệu XML
2.2. Xây dựng ứng dụng Web theo khung kiến trúc MVC bằng XQuery và cơ sở dữ liệu XML và cơ sở dữ liệu XML
Giả sử ta phát triển một ứng dụng XQuery đơn giản quản lý dữ liệu liên hệ với ngƣời sử dụng (user contact). Mỗi mối liên hệ gồm có họ tên và địa chỉ thƣ điện tử. Toàn bộ dữ liệu chứa trong một tệp XML tên là contacts.xml, gồm nhiều phần tử user nhƣ dƣới đây:
<user id=“1”>
<fname>Eric</fname>
<lname>Palmitesta</lname>
<email>eric.palmitesta@...</email </user>
Mô hình (Model)
Mô hình chứa mã lệnh thực hiện các chức năng xử lý. Ví dụ dƣới đây cho thấy các hàm xử lý sau:
db-exists(): Hàm kiểm tra xem có tồn tại CSDL (ở đây là tệp contacts.xml) hay không.
Trình duyệt Web Sự kiện vào Yêu cầu
HTTP
Trang HTML
Controller View
Các công cụ xử lý bài thi
(lựa chọn môn thi, xử lý bài làm, tính điểm) (Model) Luồng ra Tầng trình bày Tầng model
list(): Hàm lấy ra tất cả các phần tử user có trong tệp dữ liệu contacts.xml.
create(): Hàm tạo một phần tử user mới và chèn thêm vào tệp dữ liệu. Dữ liệu đầu vào nhận từ trình điều khiển. Trình điều khiển lấy dữ liệu này từ yêu cầu HTTP, do ngƣời sử dụng nhập.
xquery version "1.0-ml";
module namespace contacts = "contacts"; declare variable $db := '/contacts.xml'; declare function db-exists() {
fn:doc-available($db)};
declare function list()as element(user)* {
fn:doc($db)/users/user};
declare function create($email as xs:string,
$first-name as xs:string,
$last-name as xs:string){
if (everything checks out...) then ( xdmp:node-insert-child(...),
fn:true() )
else fn:false()};
Khung nhìn (View)
Để minh họa việc duy trì song song cùng một lúc nhiều cách trình bày hiển thị dữ liệu, ở đây xây dựng hai khung nhìn: trang web HTML thông thƣờng và tài liệu XML
Khung nhìn HTML
xquery version "1.0-ml";
import module namespace contacts = "contacts" at "contacts-model.xqy";
<table><tr><th>Email</th> <th>First</th> <th>Last</th> </tr> {
for $contact in contacts:list() return <tr>
<td>{ $contact/email/text()}</td> <td>{ $contact/fname/text() }</td>
<td>{ $contact/lname/text() }</td> </tr>
</table>
Khung nhìn XML
xquery version "1.0-ml";
import module namespace contacts = "contacts" at "contacts-model.xqy";
<contacts>{
for $contact in contacts:list() return
<email> { $contact/email/text() }</email> }</contacts>
Trình điều khiển (Controller)
Theo quy ƣớc, tệp trình điều khiển XQuery có tên là controller.xql. Trong bản phân phối chuẩn của eXist, trình điều khiển chính nằm trong webapp/controller.xql. Các trình điều khiển khác nằm trong thƣ mục con webapp/sandbox hay webapp/admin. Các tệp trình điều khiển đặt trong các thƣ mục khác nhau, tạo thành một hệ phân cấp các trình điều khiển của ứng dụng đang xét.
Một vài chú ý khi xây dựng ứng dụng Web theo khung MVC
- Mô hình và trình điều khiển không nên chứa mã lệnh xhtml.
- Trình điều khiển và khung nhìn không nên chứa mã lệnh truy cập CSDL.
- Trình điều khiển không nên trực tiếp đọc các biến yêu cầu.