JAVA개념&실습

WEB : [0608] MVC패턴 실습02

u_SZero 2023. 6. 15. 19:02

! 배워가고 있는 주인장이 쓴 글이니 정보의 정확성에 유의하시기 바랍니다 !


WebApp25

 


■■■ 모델2 기반의 MVC 패턴 ■■■

더보기

○ 개요

   MVC 패턴에서 MVC 는 각각 Model, View, Controller 를 의미하는 것으로
   Model 은 데이터 또는 기본 기능(업무 로직)을 말하며,
   View 는 유저 인터페이스를 말한다.
   이 두 가지는 시스템 개발에 있어서 반드시 필요한 부분이다.
 
   MVC 패턴은 C 패턴이라고 불러도 괜찮을만큼
   한 마디로 말해 Controller 라는 레이어 계층을 두는 것이 가장 중요하다.
   즉, Graphical User Interface 를 활용하는 과정에서
   Model 과 View 계층 사이에
   Controller 계층을 만들어 사용할 수 있도록 하는 것이다.

   이렇게 필수적인 두 계층 사이에
   필수적이지 않은 다른 계층을 두는 이유는
   두 계층(Model 과 View)이 직접적으로 결합되는 것을 막는 것으로
   Controller 계층은 Model 계층과 View 계층 사이에서 결합을 막아준다.
   Model 과 View 의 직접적인 결합은 이 둘을 함께 바뀌도록 만들어버린다.
   이것을 Controller 계층이 막아준다는 것이다.
   따라서... Controller 계층의 로직은 간단하게 설계해야 한다.

○ Web Application 에서의 MVC 구조

   JSP 는 로직과 프리젠테이션을 알맞게 구분하기 위해
   Model2 구조를 지원하고 있으며,
   Model2 구조의 개념과 구현 방법, 장단점 등을 이해하고
   적용시키는 것이 중요하다.

   - Model1 구조 _JSP로 운영하는 방식
     모델1 구조는 일반적으로 JSP 페이지만으로 구성되어 있는 구조를 말한다.
     즉, JSP 페이지에서 동적인 부분(로직 부분)은 크르립릿으로 처리하고
     그 외 나머지 부분은 템플릿으로 처리하는 구조인 것이다.
     모델1 과 모델2의 가장 큰 차이점은
     ★클라이언트의 요청이 진입하는 지점이 다르다★는 것이다.
 
     ·장점
       개발 시간이 단축된다.
       단순한 페이지의 흐름을 바탕으로 MVC 구조에 대한
       추가적인 이해가 필요하지 않다.

     ·단점
       HTML, Javascript, JSP 로직이 한 페이지에 작성되어
       어플리케이션이 복잡해질수록 유지보수가 힘들어진다. (거의 불가능)
       디자이너와 개발자 사이에 밀접하고 원할한 소통이 요구된다.
   
   - Model2 구조
     모델2 구조는 JSP와 Servlet 그리고 JavaBean 컴포넌트를 함께 사용하며,
     모델2의 ★클라이언트의 요청이 진입하는 지점은 컨트롤러★이며,
     대부분의 웹 어플리케이션의 컨트롤러는 Servlet 이 담당한다.

     ·장점
      로직과 프리젠테이션(_뷰 페이지)의 분리로 인해 어플리케이션이 명료해지고
      유지보수나 확장이 용이하다.
      디자이너와의 작업이 분리되어 있기 때문에
      업무 진행이 원활하고 ★책임의 소재가 명확★해진다.
  
     ·단점
       개발 초기에 아키텍처 디자인을 위한 분석... 구성... 등의
       시간 소요로 개발 기간이 전체적으로 늘어난다.
       MVC 구조에 대한 개발자들의 이해를 필요로하며,
       이에 대한 이유로 사전 교육 기간 등이 소요될 수 있다.

※ MVC(Model2) 구조
 
   - 모델(Model)
     비지니스 로직과 관련된 부분만 처리
     데이터베이스 관련 로직 구현
     Java Bean

   - 뷰(View)
     사용자에게 알맞은 화면을 보여주는 역할을 수행
     JSP

   - 컨트롤러(Controller)
     어플리케이션의 흐름 제어나 사용자의 요청 구현
     사용자 인증, 보안 설정, 전체 어플리케이션에 공통으로 영향을 주는 요소 구현
     사용자의 요청에 알맞은 모델 사용
     사용자에게 보여줄 뷰 선택
     Servlet


※ MVC(Model2) 구현
   
   - JSP 기반의 웹 어플리케이션에서 Controller 에 포함되어야 할 작업
     ·웹 브라우저(클라이언트)의 요청을 받는다.
     ·웹 브라우저(클라이언트)가 요구하는 작업을 분석한다.
     ·요청한 작업을 처리하는 비지니스 로직을 수행하는
       모델(Model:JavaBean)을 사용한다.
     ·처리 결과를 request 또는 session에 저장한다.
     ·적절한 뷰(View:JSP)를 선택하여
       해당 뷰로 포워딩(forwarding)한다.

   - JSP 기반의 웹 어플리케이션에서 View 에 포함되어야 할 작업
     ·서블릿에서 dispatcher.forward(request, response)로
       해당 JSP 페이지와 request, response 를 공유한 경우
       해당 JSP 페이지에서 request.getAttribute("result")와 같이
       바인디이한 데이터를 활용하여 결과를 화면에 표현한다.

   - JSP 기반의 웹 어플리케이션에서 Model 에 포한되어야 할 작업
     ·컨트롤러(Controller)의 요청을 받는다.
     ·비즈니스 로직을 처리한다.
     ·처리한 비즈니스 로직의 결과를 컨트롤러(Controller)로 반환한다.

 

 




 


 

 

 

 

 

web.xml

: 해당 url패턴을 가진 주소가 실행되면 servlet-name이 같은 servlet-class 태그에 지정된 경로의 파일로 이동

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns="http://xmlns.jcp.org/xml/ns/javaee"
	xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
	id="WebApp_ID" version="3.1">
	<display-name>WebApp00</display-name>
	<welcome-file-list>
		<welcome-file>index.html</welcome-file>
		<welcome-file>index.htm</welcome-file>
		<welcome-file>index.jsp</welcome-file>
		<welcome-file>default.html</welcome-file>
		<welcome-file>default.htm</welcome-file>
		<welcome-file>default.jsp</welcome-file>
	</welcome-file-list>
	
	<!-- 	
	<servlet>
		<servlet-name></servlet-name>
		<servlet-class></servlet-class>
	</servlet>
	
	<servlet-mapping>
		<servlet-name></servlet-name>
		<url-pattern></url-pattern>
	</servlet-mapping>
	-->
	
	<!-- MVCTest01 -->
	<servlet>
		<servlet-name>MVCTest01</servlet-name>
		<servlet-class>com.svt.MVCTest01</servlet-class>
	</servlet>
	
	<servlet-mapping>
		<servlet-name>MVCTest01</servlet-name>
		<url-pattern>/mvctest01</url-pattern>
	</servlet-mapping>
	
	<!-- MVCTest02 -->
	<servlet>
		<servlet-name>MVCTest02</servlet-name>
		<servlet-class>com.svt.MVCTest02</servlet-class>
	</servlet>
	
	<servlet-mapping>
		<servlet-name>MVCTest02</servlet-name>
		<url-pattern>/mvctest02</url-pattern>
	</servlet-mapping>
	
</web-app>

 

 

1. MVCTest01.java → MVCTest01.jsp

 

2. MVCTest02.java → MVCTest02Model.jsp → MVCTest02.jsp

 

 

 


[1]

 

------------------------------------------------------------------------------

○ MVC 관련 실습2
   
   - prj : WebApp25

   - 물리적 파일 구성
     ·MVCTest01.jsp     → View 역할(JSP 페이지)
     ·MVCTest01.java    → Controller 역할(서블릿 클래스)
     ·web.xml           → URL 매핑

   - 사용자 최초 요청 주소
     http://localhost:8090/WebApp24/mvctest01

--------------------------------------------------------------------------------

 

 

mvctest01 의 파일명을 가진 빈 파일을 생성하여 web.xml을 통해

Java Resources > src > com.svt > MVCTest01.java파일에 접근한다.

MVCTest01.java

/*======================
    MVCTest01.java
=======================*/

package com.svt;

import java.util.ArrayList;
import java.util.List;
import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import javax.servlet.RequestDispatcher;

public class MVCTest01 extends HttpServlet
{
	private static final long serialVersionUID = 1L;
	
	@Override
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
	{
		doGetPost(request, response);
	}
	
	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
	{
		doGetPost(request, response);
	}
	
	protected void doGetPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
	{
		// 서블릿 관련 코딩
		
		// 1 부터 100 까지의 수를 객체(컬렉션)에 저장하는 과정
		List<String> lists = new ArrayList<String>();
		
		for (int i=1; i<=100; i++)
		{
			lists.add(String.valueOf(i));
		}
		
		request.setAttribute("lists", lists);
		
		RequestDispatcher dispatcher = request.getRequestDispatcher("WEB-INF/view/MVCTest01.jsp");
		dispatcher.forward(request, response);
		
	}
	
}

1~100까지의 수를 lists에 저장후 request.setAttribute로 list를 request를 통해 MVCTest01.jsp로 넘긴다.

 

 

 

MVCTest01.jsp

<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<% 
	request.setCharacterEncoding("UTF-8");
	String cp = request.getContextPath();
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>MVCTest01.jsp</title>
<link rel="stylesheet" type="text/CSS" href="<%=cp %>/css/main.css">
</head>
<body>

<div>
	<h1>MVC 관련 실습 2</h1>
	<hr>
</div>

<div>
	<h2>1부터 100 까지의 결과물을 가지고 클라이언트 만나기</h2>
	<h3>(컨트롤러로부터 수신한 결과)</h3>
	<!-- 
	<ul>
		<li>1</li>
		<li>...</li>
		<li>100</li>
	</ul> 
	-->
	
	<ul>
		<c:forEach var="i" items="${lists }">
			<li>${i }</li>
		</c:forEach>
	</ul>
	
</div>

</body>
</html>

1 ~ 100 까지 출력

 

 

 

 


 

 

 

[2]

 

--------------------------------------------------------------------------------

○ MVC 관련 실습2
   
   - prj : WebApp25

   - 물리적 파일 구성
     ·MVCTest01.jsp      → View 역할(JSP 페이지)
     ·MVCTest01.java    → Controller 역할(서블릿 클래스)
     ·web.xml                 → URL 매핑

   - 사용자 최초 요청 주소
     http://localhost:8090/WebApp24/mvctest01

--------------------------------------------------------------------------------

 

 

mvctest02 의 파일명을 가진 빈 파일을 생성하여 web.xml을 통해

Java Resources > src > com.svt > MVCTest02.java파일에 접근한다.

 

MVCTest02.java

/*======================
    MVCTest02.java
=======================*/

package com.svt;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.test.MVCTest02Model;

import javax.servlet.RequestDispatcher;

public class MVCTest02 extends HttpServlet
{
	private static final long serialVersionUID = 1L;
	
	@Override
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
	{
		doGetPost(request, response);
	}
	
	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
	{
		doGetPost(request, response);
	}
	
	protected void doGetPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
	{
		// 서블릿 관련 코딩
		
		// 1 부터 100 까지의 수를 객체(컬렉션)에 저장하는 과정
		/*
		List<String> lists = new ArrayList<String>();
		
		for (int i=1; i<=100; i++)
		{
			lists.add(String.valueOf(i));
		}
		
		request.setAttribute("lists", lists);
		
		RequestDispatcher dispatcher = request.getRequestDispatcher("WEB-INF/view/MVCTest01.jsp");		
		dispatcher.forward(request, response);
		//→ 이건 서빙알바한테 손님에게 나가라고 컨트롤러가 만들어서 쥐어줌
		//  → 주방(Model)에서 만든걸 가지고 나가게 하자
		*/
		
		// 모델 객체 생성 및 모델이 처리한 결과 수신 (MVCTest02Model.java) (+ View 정보 획득)
		MVCTest02Model model = new MVCTest02Model();
		String view = model.actionCount(request, response);		//_컨트롤러에게 "이 view가 필요할 것 같아요" 라고 이야기 해주는 개념
		
		// view += "추가경로";
		
		// 추가적인 상황 파악(추가 로직 수행)
		
		// view += "추가경로";
		
		RequestDispatcher rd = request.getRequestDispatcher(view);	//_model에서 컨트롤러에게 request에 담아서 lists를 넘겨줌 -> view에서도 호출가능 (다 같은 request)
		//_RequestDispatcher rd = request.getRequestDispatcher(view + "문자열 추가"); // 이런것도 가능
		rd.forward(request, response);
		
		
	}
	
}

 

 

 

MVCTest02Model.java

: MVC 패턴에서 Model 역할을 수행하는 파일

  1 ~ 100까지의  수를 객체에 저장하는 업무를 처리

  "WEB-INF/view/MVCTest02.jsp"로 보냄.

/*===============================
   MVCTest02Model.java
   - Model 역할을 수행할 클래스
   - 비지니스 로직 처리
================================*/

package com.test;

import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class MVCTest02Model
{
	public String actionCount(HttpServletRequest request, HttpServletResponse response)		// 꼭 String으로 return해야하는 것이 아님 / 실제 모델은 뷰와의 결합이 적을수록 좋다.(WebStudy > 16~.txt
	{
		String result = "";
		
		// 1 부터 100 까지의 수를 객체(컬렉션)에 저장하는 업무 처리
		List<String> lists = new ArrayList<String>();
		
		for(int i=1; i<=100; i++)
		{
			lists.add(String.valueOf(i));
		}
		
		request.setAttribute("lists", lists);
		
		result="WEB-INF/view/MVCTest02.jsp";
		/*
		 * result="soci/..."; 
		 * result="math/..."; 
		 * result="science/..."; 뒤에 어떤 결과가 올지 예상가능하게 함
		 */
		
		return result;
	}
}

 

 

 

MVCTest02.jsp

: Model에서 수행한 결과를 request로 전달받아서 출력

<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<% 
	request.setCharacterEncoding("UTF-8");
	String cp = request.getContextPath();
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>MVCTest02.jsp</title>
<link rel="stylesheet" type="text/CSS" href="<%=cp %>/css/main.css">
</head>
<body>

<div>
	<h1>MVC 관련 실습 3</h1>
	<hr>
</div>

<div>
	<h2>1부터 100 까지의 결과물을 가지고 클라이언트 만나기</h2>
	<h3>(컨트롤러로부터 수신한 결과)</h3>
	<!-- 
	<ul>
		<li>1</li>
		<li>...</li>
		<li>100</li>
	</ul> 
	-->
	
	<ul>
		<c:forEach var="i" items="${lists }">
			<li>${i }</li>
		</c:forEach>
	</ul>
	
</div>

</body>
</html>

 


! 배워가고 있는 주인장이 쓴 글이니 정보의 정확성에 유의하시기 바랍니다 !