Bài 2. Tổng quan MVC
Nội dung
 1. Ví dụ về MVC
 2. Giới thiệu về thiết kế MVC
 3. Quá trình phát triển của kiến trúc ứng
dụng Web
 3.1. Model 1
 3.2. Model 2
 3.3. Application frameworks
2
Bài toán
3
Giải pháp ban đầu
 Xây dựng nhiều servlet
 Trong servlet: xử lý nghiệp vụ (business
logic), hiển thị 4
Giải pháp +: sử dụng JSP
 Sử dụng JSP cho việc hiển thị
 Servlet forward các yêu cầu tới JSP
 Tách business logic và presentation
5
Giải pháp ++: sử dụng MVC
 Đưa business logic ra khỏi servlet và đặt
trong Model – các lớp Java có thể sử dụng
lại
 Model: sự kết hợp của business data và các
phương thức theo tác trên dữ liệu
6
Giải pháp ++: sử dụng MVC
7
Ví dụ 1. Tư vấn bia
8
Trang JSP
Trang html
9
10
beer_v1
websrc
WEB-INF
web.xml
result.htmlform.htmlcom
BeerExpert
.java
example
web model
BeerSelect
.java
Cấu trúc thư mục lập trình
11
WEB-INF
beer_v1
classes
webapps
web.xml
result.htmlform.html
com
BeerExpert
.class
example
web model
BeerSelect
.class
Cấu trúc thư mục triển khai
tomcat
form.html
<form method="POST“
action="SelectBeer.do">
Select beer characteristics
<p>Color:
<select name="color" size="1">
<option value="light">light</option>
<option value="amber">amber</option>
<option value="brown">brown</option>
<option value="dark">dark</option>
</select>
<center> <input type="SUBMIT"> </center>
</form>
12
web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app …>
<servlet>
<servlet-name>ServletBeer</servlet-name>
<servlet-class>com.example.web.BeerSelect
</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>ServletBeer</servlet-name>
<url-pattern>/SelectBeer.do</url-pattern>
</servlet-mapping>
</web-app>
13
Servlet BeerSelect – version 1
public class BeerSelect extends HttpServlet {
@Override
protected void doPost(HttpServletRequest request,
HttpServletResponse response) throws ServletException,
IOException {
response.setContentType("text/html");
PrintWriter out = response.getWriter();
out.println("Beer Selection Advice<br>");
String c = request.getParameter("color");
out.println("<br>Got beer color "+c);
}
}
14
Test ứng dụng
15
Model BeerExpert
public class BeerExpert {
public List getBrands(String color){
List brands = new ArrayList();
if(color.equals("amber")){
brands.add("Jack Amber");
brands.add("Red Moose");
}
else{
brands.add("Jail Pale Ale");
brands.add("Gout Stout");
}
return brands;
}
}
16
Servlet BeerSelect – version 2
import package com.example.web;
…
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String c = request.getParameter("color");
BeerExpert be = new BeerExpert();
List result = be.getBrands(c);
response.setContentType("text/html");
PrintWriter out = response.getWriter();
out.println("Beer Selection Advice<br>");
Iterator it = result.iterator();
while(it.hasNext()){
out.print("<br>try: "+it.next());
}
}
17
Test ứng dụng
18
Kiến trúc hiện tại
19
Kiến trúc mong muốn
20
Result.jsp
<%@ page import="java.util.*"%>
<!DOCTYPE html>
<html>
<body>
<h1 align="center">Beer Recommendation </h1> <p>
<%
List styles=(List) request.getAttribute("styles");
Iterator it = styles.iterator();
while(it.hasNext()){
out.print("<br>try: "+it.next());
}
%>
</body>
</html>
21
Servlet BeerSelect – version 3
import package com.example.web;
…
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String c = request.getParameter("color");
BeerExpert be = new BeerExpert();
List result = be.getBrands(c);
request.setAttribute("styles", result);
RequestDispatcher view = request.getRequestDispatcher("result.jsp");
view.forward(request, response);
}
22
Test lại ứng dụng
23
Nội dung
 1. Giới thiệu về mẫu thiết kế MVC
 2. Quá trình phát triển của kiến trúc ứng
dụng Web
 2.1. Model 1
 2.2. Model 2
 2.3. Application frameworks
24
2. Giới thiệu MVC
25
MVC Pattern
26
Model
 Model (Business process layer)
 Mô hình hóa dữ liệu và hành vi (data & behavior)
trong xử lý nghiệp vụ (business process)
 Chịu trách nhiệm
 Thực hiện các truy vấn DB
 Tính toán trong các nghiệp vụ
 VD: Xử lý các orders
 Đóng gói dữ liệu và hành vi, độc lập với tầng
presentation
27
View
 View (Presentation layer)
 Hiển thị thông tin tùy thuộc vào loại client
 Biểu diễn kết quả của tầng business logic
(Model)
 Không cần quan tâm làm thế nào có được thông
tin, hoặc thông tin ở đâu (Model chịu trách
nhiệm)
28
Controller
 Controller (Control layer)
 Kết nối tương tác của người dùng với các nghiệp
vụ cung cấp phía sau
 Chọn ra cách biểu diễn phù hợp
 Ví dụ: ngôn ngữ, biến đối định dạng thông tin theo
vùng, quyền hạn người dùng
 Một request tới ứng dụng sẽ chuyển cho tầng
Control.
 Tầng này quyết định request được xử lý như thế nào,
và thông tin sẽ được trả lại như thế nào
29
3. Quá trình phát triển của
kiến trúc ứng dụng Web
30
3. Quá trình phát triển của kiến trúc MVC
 No MVC
 MVC Model 1 (Page-centric)
 MVC Model 2 (Servlet-centric)
 Web application frameworks
 Struts
 Standard-based Web application framework
 JavaServer Faces (JSR-127)
31
3. Quá trình phát triển của kiến trúc ứng
dụng Web cho đến khi Model 1 ra đời
Model 1 architectureNo MVC
32
3.1. Model 1
(Page-Centric Architecture)
33
3.1. Model 1 Architecture (Page-centric)
Request
1
JSP
pages
Java Bean
Response
4
2
3
BROWSER
Servlet
Container
Enterprise Information
Systems (EIS)
34
Kiến trúc Page-centric
 Bao gồm 1 loạt các trang JSP có liên hệ chặt chẽ
với nhau
 Các trang JSP xử lý tất cả: presentation, control, và
business process
 Business process logic và control được CODE
CỨNG trong các trang JSP
 Dưới dạng JavaBeans, scriptlets, expression
 Chuyển trang được thực hiện
 Khi user click vào 1 liên kết. Ví dụ: <A HERF="find.jsp>
 Qua hành động submit form. Ví dụ: <FORM
ACTION="search.jsp">
35
Kiến trúc Page-centric
memu.jsp catalog.jsp checkout.jsp
dataBase
page–centric catalog application 36
Kịch bản sử dụng trong kiến trúc Page-
centric
Client
View
search.html
list.jsp
Model
JavaBeans
Controller
find.jsp
delete.jsp
redirect
forward
Request 1
Request 2
Request 3
response
response
37
3.2. Model 2
(Servlet-Centric Architecture)
38
Model 2 Architecture (Servlet-centric)
Request
1
(Controller)
Servlet
(View)
JSPResponse
5
3
4
BROWSER
Servlet Container (EIS)
Redirect
2
(Model)
Java Bean
MVC Design Pattern
39
Tại sao sử dụng kiến trúc Model 2?
 Nếu muốn biểu diễn các trang JSP khác
nhau, tùy theo dữ liệu nhận được?
 Riêng JSP với JavaBeans và custom tags
(Model 1) chưa xử lý tốt được
 Giải pháp
 Sử dụng đồng thời Servlet và JSP (Model 2)
 Servlet xử lý request gửi tới, xử lý 1 phần dữ
liệu, thiết lập các beans, forward kết quả cho 1
trong nhiều trang JSP nào đó
40
Servlet-centric Architecture
 JSP chỉ được sử dụng để biểu diễn kết quả
(presentation)
 Xử lý điều khiển (Control) thực hiện bởi servlets
 Servlet hoạt động như một gatekeeper
 Cung cấp các services thông dụng, như authentication,
authorization, login, error handling, …
 Servlet hoạt động như một central controller
 Quyết định logic phù hợp để xử lý các request, sẽ gửi
request đến những nơi nào, …
 Thực hiện việc điều hướng (redirecting)
41
Servlet-centric Scenario
Client
View
search.html
list.jsp
Model
JavaBeans
Controller
forward
Request 1
Request 2
Request 3
response
response
servlet
42
3.3. Web Application
Frameworks
43
Web Application Frameworks
 Dựa trên kiến trúc MVC Model 2
 Hầu hết các ứng dụng Web phải cung cấp
các chức năng
 Nhận (receive) và gửi tiếp (Dispatching) HTTP
requests
 Gọi các phương thức từ tầng model
 Tổng hợp và chọn ra các views trả về cho client
 Cung cấp các classes và interfaces cho lập
trình viên sử dụng/mở rộng
44
Tại sao sử dụng các Web Application
Framework?
 Phân tách tầng presentation và các business logic
thành các components
 Cung cấp 1 điểm điều khiển trung tâm
 Cung cấp các tính năng mở rộng
 Dễ dàng kiểm thử unit (unit-testing) và bảo trì
 Nhiều công cụ hỗ trợ
 Ổn định
 Có cộng đồng hỗ trợ mạnh mẽ
 Đơn giản hóa chế độ đa ngôn ngữ (internationalization)
 Đơn giản hóa việc validate đầu vào
45
Tại sao sử dụng các Web Application
Framework?
 Frameworks đang phát triển mạnh mẽ
 JSP/Servlets vẫn còn khó sử dụng
 Frameworks định nghĩa các components
chuẩn, cho phép tái sử dụng.
 Frameworks còn chỉ rõ cách thức phối hợp
các components trong 1 ứng dụng
46
Một số Web Application Frameworks
 Apache Struts I and II
 Spring Framework MVC
 JavaServer Faces (JSR-127)
 Echo
 Tapestry
 Wicket
 ...
47

Bai2 tong quan_mvc_0567

  • 1.
  • 2.
    Nội dung  1.Ví dụ về MVC  2. Giới thiệu về thiết kế MVC  3. Quá trình phát triển của kiến trúc ứng dụng Web  3.1. Model 1  3.2. Model 2  3.3. Application frameworks 2
  • 3.
  • 4.
    Giải pháp banđầu  Xây dựng nhiều servlet  Trong servlet: xử lý nghiệp vụ (business logic), hiển thị 4
  • 5.
    Giải pháp +:sử dụng JSP  Sử dụng JSP cho việc hiển thị  Servlet forward các yêu cầu tới JSP  Tách business logic và presentation 5
  • 6.
    Giải pháp ++:sử dụng MVC  Đưa business logic ra khỏi servlet và đặt trong Model – các lớp Java có thể sử dụng lại  Model: sự kết hợp của business data và các phương thức theo tác trên dữ liệu 6
  • 7.
    Giải pháp ++:sử dụng MVC 7
  • 8.
    Ví dụ 1.Tư vấn bia 8 Trang JSP Trang html
  • 9.
  • 10.
  • 11.
  • 12.
    form.html <form method="POST“ action="SelectBeer.do"> Select beercharacteristics <p>Color: <select name="color" size="1"> <option value="light">light</option> <option value="amber">amber</option> <option value="brown">brown</option> <option value="dark">dark</option> </select> <center> <input type="SUBMIT"> </center> </form> 12
  • 13.
    web.xml <?xml version="1.0" encoding="UTF-8"?> <web-app…> <servlet> <servlet-name>ServletBeer</servlet-name> <servlet-class>com.example.web.BeerSelect </servlet-class> </servlet> <servlet-mapping> <servlet-name>ServletBeer</servlet-name> <url-pattern>/SelectBeer.do</url-pattern> </servlet-mapping> </web-app> 13
  • 14.
    Servlet BeerSelect –version 1 public class BeerSelect extends HttpServlet { @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html"); PrintWriter out = response.getWriter(); out.println("Beer Selection Advice<br>"); String c = request.getParameter("color"); out.println("<br>Got beer color "+c); } } 14
  • 15.
  • 16.
    Model BeerExpert public classBeerExpert { public List getBrands(String color){ List brands = new ArrayList(); if(color.equals("amber")){ brands.add("Jack Amber"); brands.add("Red Moose"); } else{ brands.add("Jail Pale Ale"); brands.add("Gout Stout"); } return brands; } } 16
  • 17.
    Servlet BeerSelect –version 2 import package com.example.web; … protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String c = request.getParameter("color"); BeerExpert be = new BeerExpert(); List result = be.getBrands(c); response.setContentType("text/html"); PrintWriter out = response.getWriter(); out.println("Beer Selection Advice<br>"); Iterator it = result.iterator(); while(it.hasNext()){ out.print("<br>try: "+it.next()); } } 17
  • 18.
  • 19.
  • 20.
  • 21.
    Result.jsp <%@ page import="java.util.*"%> <!DOCTYPEhtml> <html> <body> <h1 align="center">Beer Recommendation </h1> <p> <% List styles=(List) request.getAttribute("styles"); Iterator it = styles.iterator(); while(it.hasNext()){ out.print("<br>try: "+it.next()); } %> </body> </html> 21
  • 22.
    Servlet BeerSelect –version 3 import package com.example.web; … protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String c = request.getParameter("color"); BeerExpert be = new BeerExpert(); List result = be.getBrands(c); request.setAttribute("styles", result); RequestDispatcher view = request.getRequestDispatcher("result.jsp"); view.forward(request, response); } 22
  • 23.
  • 24.
    Nội dung  1.Giới thiệu về mẫu thiết kế MVC  2. Quá trình phát triển của kiến trúc ứng dụng Web  2.1. Model 1  2.2. Model 2  2.3. Application frameworks 24
  • 25.
  • 26.
  • 27.
    Model  Model (Businessprocess layer)  Mô hình hóa dữ liệu và hành vi (data & behavior) trong xử lý nghiệp vụ (business process)  Chịu trách nhiệm  Thực hiện các truy vấn DB  Tính toán trong các nghiệp vụ  VD: Xử lý các orders  Đóng gói dữ liệu và hành vi, độc lập với tầng presentation 27
  • 28.
    View  View (Presentationlayer)  Hiển thị thông tin tùy thuộc vào loại client  Biểu diễn kết quả của tầng business logic (Model)  Không cần quan tâm làm thế nào có được thông tin, hoặc thông tin ở đâu (Model chịu trách nhiệm) 28
  • 29.
    Controller  Controller (Controllayer)  Kết nối tương tác của người dùng với các nghiệp vụ cung cấp phía sau  Chọn ra cách biểu diễn phù hợp  Ví dụ: ngôn ngữ, biến đối định dạng thông tin theo vùng, quyền hạn người dùng  Một request tới ứng dụng sẽ chuyển cho tầng Control.  Tầng này quyết định request được xử lý như thế nào, và thông tin sẽ được trả lại như thế nào 29
  • 30.
    3. Quá trìnhphát triển của kiến trúc ứng dụng Web 30
  • 31.
    3. Quá trìnhphát triển của kiến trúc MVC  No MVC  MVC Model 1 (Page-centric)  MVC Model 2 (Servlet-centric)  Web application frameworks  Struts  Standard-based Web application framework  JavaServer Faces (JSR-127) 31
  • 32.
    3. Quá trìnhphát triển của kiến trúc ứng dụng Web cho đến khi Model 1 ra đời Model 1 architectureNo MVC 32
  • 33.
  • 34.
    3.1. Model 1Architecture (Page-centric) Request 1 JSP pages Java Bean Response 4 2 3 BROWSER Servlet Container Enterprise Information Systems (EIS) 34
  • 35.
    Kiến trúc Page-centric Bao gồm 1 loạt các trang JSP có liên hệ chặt chẽ với nhau  Các trang JSP xử lý tất cả: presentation, control, và business process  Business process logic và control được CODE CỨNG trong các trang JSP  Dưới dạng JavaBeans, scriptlets, expression  Chuyển trang được thực hiện  Khi user click vào 1 liên kết. Ví dụ: <A HERF="find.jsp>  Qua hành động submit form. Ví dụ: <FORM ACTION="search.jsp"> 35
  • 36.
    Kiến trúc Page-centric memu.jspcatalog.jsp checkout.jsp dataBase page–centric catalog application 36
  • 37.
    Kịch bản sửdụng trong kiến trúc Page- centric Client View search.html list.jsp Model JavaBeans Controller find.jsp delete.jsp redirect forward Request 1 Request 2 Request 3 response response 37
  • 38.
  • 39.
    Model 2 Architecture(Servlet-centric) Request 1 (Controller) Servlet (View) JSPResponse 5 3 4 BROWSER Servlet Container (EIS) Redirect 2 (Model) Java Bean MVC Design Pattern 39
  • 40.
    Tại sao sửdụng kiến trúc Model 2?  Nếu muốn biểu diễn các trang JSP khác nhau, tùy theo dữ liệu nhận được?  Riêng JSP với JavaBeans và custom tags (Model 1) chưa xử lý tốt được  Giải pháp  Sử dụng đồng thời Servlet và JSP (Model 2)  Servlet xử lý request gửi tới, xử lý 1 phần dữ liệu, thiết lập các beans, forward kết quả cho 1 trong nhiều trang JSP nào đó 40
  • 41.
    Servlet-centric Architecture  JSPchỉ được sử dụng để biểu diễn kết quả (presentation)  Xử lý điều khiển (Control) thực hiện bởi servlets  Servlet hoạt động như một gatekeeper  Cung cấp các services thông dụng, như authentication, authorization, login, error handling, …  Servlet hoạt động như một central controller  Quyết định logic phù hợp để xử lý các request, sẽ gửi request đến những nơi nào, …  Thực hiện việc điều hướng (redirecting) 41
  • 42.
  • 43.
  • 44.
    Web Application Frameworks Dựa trên kiến trúc MVC Model 2  Hầu hết các ứng dụng Web phải cung cấp các chức năng  Nhận (receive) và gửi tiếp (Dispatching) HTTP requests  Gọi các phương thức từ tầng model  Tổng hợp và chọn ra các views trả về cho client  Cung cấp các classes và interfaces cho lập trình viên sử dụng/mở rộng 44
  • 45.
    Tại sao sửdụng các Web Application Framework?  Phân tách tầng presentation và các business logic thành các components  Cung cấp 1 điểm điều khiển trung tâm  Cung cấp các tính năng mở rộng  Dễ dàng kiểm thử unit (unit-testing) và bảo trì  Nhiều công cụ hỗ trợ  Ổn định  Có cộng đồng hỗ trợ mạnh mẽ  Đơn giản hóa chế độ đa ngôn ngữ (internationalization)  Đơn giản hóa việc validate đầu vào 45
  • 46.
    Tại sao sửdụng các Web Application Framework?  Frameworks đang phát triển mạnh mẽ  JSP/Servlets vẫn còn khó sử dụng  Frameworks định nghĩa các components chuẩn, cho phép tái sử dụng.  Frameworks còn chỉ rõ cách thức phối hợp các components trong 1 ứng dụng 46
  • 47.
    Một số WebApplication Frameworks  Apache Struts I and II  Spring Framework MVC  JavaServer Faces (JSR-127)  Echo  Tapestry  Wicket  ... 47