Spring, java/Spring_MVC

[Web MVC] MVC 패턴

재코딩 2022. 8. 31. 00:03
반응형

 

 

본 리뷰는 인프런 김영한님의 스프링 MVC 리뷰를 한 포스팅입니다.

 

목차

  • 개요
  • 적용
  • 한계

 

 

1. 개요

앞서 JSP나 서블릿으로 웹 애플리케이션을 만들어봤다.

하지만 JSP와 서블릿은☝️비지니스 로직과 ✌️뷰 렌더링을 모두 처리하게 된다면 하나의 파일에서 너무 많은 역할을 하게 된다.

예를 들어서, 비지니스 로직을 변경할려고해도 다른 로직이 들어있는 파일을 수정을 해야하고, 뷰 렌더링쪽 변경을 하더라도 함께 변경을 해야할 가능성이 높아질 것이다. 그렇기 때문에 결론적으로 유지보수하기가 어려워질 것이다. 

 

이를 해소하고자 서블릿이나 JSP로 처리하던 것을 Controller와 View라는 영역으로 서로 역할을 나누는 MVC패턴을 사용한다.

컨트롤러

- HTTP 요청을 받아서 파라미터를 검증하고, 비즈니스 로직을 실행한다. 그리고 뷰에 전달할 결과 데이터를 조회해서 모델에 담는다.

모델

- 뷰에 출력할 데이터를 담아둔다. 뷰가 필요한 데이터를 모두 모델에 담아서 전달해주는 덕분에 뷰는 비즈니스 로직이나 데이터 접근을 몰라도 되고, 화면을 렌더링 하는 일에 집중할 수 있다.


뷰

- 모델에 담겨있는 데이터를 사용해서 화면을 그리는 일에 집중한다. 여기서는 HTML을 생성하는 부분을 말한다.

 

아래의 그림을 보면 이해가 더 잘될 것이다.

 

MVC패턴 이전 (서블릿, JSP)

 

 

MVC패턴 이후

 

비지니스 로직에 대한 내용은 아래 그림에 더욱 상세하게 나와있습니다.

 

 

 

 

 

비지니스 로직: 서비스 클래스에 작성되는 핵심 로직, 서비스에서 리포지토리를 사용.

사용자가 컨트롤러를 요청하면, 형식에 맞는 스팩을 확인 후 데이터를 저장, 주문 등의 로직을 실행한 후 결과를 받습니다. 결과를 통해서 model에 데이터를 전달을 한 후 뷰 로직에 넘긴 후 값을 출력을 해줄 수 있습니다.

 

2. 적용

MVC 패턴 적용

서블릿 👉 컨트롤러

JSP 👉 뷰

Model 👉 HttpRequest 객체

request는 내부 데이터 저장소를 가지고 있는데

request.setAttribute()
request.getAttribute()

을 사용해서 데이터를 보관하고, 조회할 수 있습니다.

 

서블릿 MVC

package hello.servlet.web.servletmvc;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet(name = "mvcMemberFormServlet", urlPatterns = "/servlet-mvc/members/new-form")
public class MvcMemberFormServlet extends HttpServlet {

    @Override
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        /**
         * WEB-INF: 이 경로안에 JSP가 있으면 외부에서 직접 JSP를 호출할 수 없다. 우리가 기대하는 것은 항상 컨트롤러를
         * 통해서 JSP를 호출하는 것이다.
         */
        String viewPath = "/WEB-INF/views/new-form.jsp";
        //서블릿에서 JSP호출
        RequestDispatcher dispatcher = request.getRequestDispatcher(viewPath);

        //다른 서블릿이나 JSP로 이동할 수 있는 기능이다.
        dispatcher.forward(request, response); //서버끼리 내부에서 호출

        /**
         * redirect vs forward
         *  리다이렉트는 실제 클라이언트(웹 브라우저)에 응답이 나갔다가, 클라이언트가 redirect 경로로 다시 요청한다.
         *  따라서 클라이언트가 인지할 수 있고, URL 경로도 실제로 변경된다.
         *  반면에 포워드는 서버 내부에서 일어나는 호출이기 때문에 클라이언트가 전혀 인지하지 못한다.
         */
    }
}

 

WEB-INF > views > 회원등록 JSP

 

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!-- 상대경로 사용, [현재 URL이 속한 계층 경로 + /save] -->
<form action="save" method="post">
    username: <input type="text" name="username" />
    age: <input type="text" name="age" />
    <button type="submit">전송</button>
</form>
</body>
</html>

 

여기서 form의 action을 보면 절대 경로( / 로 시작)가 아니라 상대경로( / 로 시작X)인 것을 확인할 수 있다. 

상대경로를 사용하면 폼 전송시 현재 URL이 속한 계층 경로 + save가 호출된다.
현재 계층 경로: /servlet-mvc/members/
결과: /servlet-mvc/members/save

 

회원 저장

package hello.servlet.web.servletmvc;

import hello.servlet.domain.member.Member;
import hello.servlet.domain.repository.MemberRepository;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet(name = "mvcMemberSaveServlet", urlPatterns = "/servlet-mvc/members/save")
public class MvcMemberSaveServlet extends HttpServlet {

    private MemberRepository memberRepository = MemberRepository.getInstance();

    @Override
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        String username = request.getParameter("username");
        int age = Integer.parseInt(request.getParameter("age"));

        Member member = new Member(username, age);
        memberRepository.save(member);

        //Model 데이터 보관
        request.setAttribute("member", member);

        String viewPath = "/WEB-INF/views/save-result.jsp";
        RequestDispatcher dispatcher = request.getRequestDispatcher(viewPath);
        dispatcher.forward(request, response);
    }
}

 

회원저장 JSP

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body>
성공
<ul>
    <li>id=${member.id}</li>
    <li>username=${member.username}</li>
    <li>age=${member.age}</li>
</ul>
<a href="/index.html">메인</a>
</body>
</html>

 

<%= request.getAttribute("member")%> 로 모델에 저장한 member 객체를 꺼낼 수 있지만, 너무 복잡해진다.
JSP는 ${} 문법을 제공하는데, 이 문법을 사용하면 request의 attribute에 담긴 데이터를 편리하게 조회할 수 있다.

 

 

회원 목록 조회 

package hello.servlet.web.servletmvc;

import hello.servlet.domain.member.Member;
import hello.servlet.domain.repository.MemberRepository;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.List;

@WebServlet(name = "mvcMemberListServlet", urlPatterns = "/servlet-mvc/members")
public class MvcMemberListServlet extends HttpServlet {

    private MemberRepository memberRepository = MemberRepository.getInstance();
    @Override
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        List<Member> members = memberRepository.findAll();
        request.setAttribute("members", members);

        String viewPath = "/WEB-INF/views/members.jsp";
        RequestDispatcher dispatcher = request.getRequestDispatcher(viewPath);
        dispatcher.forward(request, response);
    }
}

 

회원 목록 JSP

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<a href="/index.html">메인</a>
<table>
    <thead>
    <th>id</th>
    <th>username</th>
    <th>age</th>
    </thead>
    <tbody>
    <c:forEach var="item" items="${members}">
        <tr>
            <td>${item.id}</td>
            <td>${item.username}</td>
            <td>${item.age}</td>
        </tr>
    </c:forEach>
    </tbody>
</table>
</body>
</html>

 

모델에 담아둔 members를 JSP가 제공하는 taglib기능을 사용해서 반복하면서 출력 👉 members 리스트에서 member 를 순서대로 꺼내서 item 변수에 담고, 출력하는 과정을 반복

 

⭐️ <c:forEach> 이 기능을 사용하려면 다음과 같이 선언해야 한다⭐️ 
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

 

이렇게 JSP로 MVC패턴을 만들어보았는데 컨트롤러와 뷰에 대한 로직이 확실하게 분리된 것을 확인할 수 있다.

 

 

3. 한계

뷰: 화면을 그리는 역할이 충실한 덕분에 코드가 직관적이다

컨트롤러: 중복이 많고 필요하지 않은 코드들이 많다.

1) forward중복

RequestDispatcher dispatcher = request.getRequestDispatcher(viewPath);
  dispatcher.forward(request, response);

 

2) viewPath중복 

String viewPath = "/WEB-INF/views/new-form.jsp";

prefix와 suffix의 중복이 일어난다.

 

3) 사용하지 않는 코드: request, response

객체 생성으로 인하여 테스트 코드를 만들기 어렵다.

 

4) 공통 처리가 어렵다.

Ex) 로그 출력, 포워드 중복, 뷰 중복, 사용하지 않는 코드 중복 등등으로 인한...

 

문제를 해결하기 위해선? 컨트롤러(서블릿)이 호출되기 전에 공통 처리를 미리해야한다!

프론트 컨트롤러 패턴을 도입해야한다~!

 

반응형
저작자표시 (새창열림)