서블릿, JSP, MVC 패턴(2)

Web Development/스프링 MVC 1편

서블릿, JSP, MVC 패턴(2)

_dear 2024. 10. 20. 15:33

MVC 패턴 - 개요

- "너무 많은 역할"

=> 유지보수가 너무 어려워짐

- "변경의 라이프 사이클"

=> UI변경/비즈니스 로직을 수정하는 일은 각각 다르게 발생할 가능성이 매우 높음

이러한 것을 하나의 코드로 관리하는 것은 유지보수하기 좋지 않다.

"기능 특화"

=> JSP같은 뷰 템플릿은 화면을 렌더링 하는데 최적화되어 있기 때문에 이 부분의 업무만 담당하는 것이 가장 효과적이다.

MVC(Model View Controller)

MVC 패턴은 지금까지 학습한 것 처럼 하나의 서블릿이나, JSP로 처리하던 것을 컨트롤러(Controller)와 뷰(View)라 는 영역으로 서로 역할을 나눈 것을 말한다. 웹 애플리케이션은 보통 이 MVC 패턴을 사용한다.

- 컨트롤러: HTTP 요청을 받아서 파라미터를 검증하고, 비즈니스 로직을 실행한다. 그리고 뷰에 전달할 결과 데이터를 조회해서 모델에 담는다.
- 모델: 뷰에 출력할 데이터를 담아둔다. 뷰가 필요한 데이터를 모두 모델에 담아서 전달해주는 덕분에 뷰는 비즈니스 로 직이나 데이터 접근을 몰라도 되고, 화면을 렌더링 하는 일에 집중할 수 있다.
- 뷰: 모델에 담겨있는 데이터를 사용해서 화면을 그리는 일에 집중한다. 여기서는 HTML을 생성하는 부분을 말한다

MVC 패턴 - 적용

서블릿을 컨트롤러로 사용하고, JSP를 뷰로 사용해서 MVC 패턴을 적용해보자.

Model은 HttpServletRequest 객체를 사용한다.

request는 내부에 데이터 저장소를 가지고 있는데, request.setAttribute() , request.getAttribute() 를 사용하면 데이터를 보관하고, 조회할 수 있다.

1. 회원 등록

회원 등록 폼 - 컨트롤러

MvcMemberFormServlet.java

package hello.servlet.web.servletmvc;

import jakarta.servlet.RequestDispatcher;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.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 {
        String viewPath = "/WEB-INF/views/new-form.jsp";
        RequestDispatcher dispatcher = request.getRequestDispatcher(viewPath);
        dispatcher.forward(request, response); //JSP호출
    }
}

/WEB-INF

이 경로안에 JSP가 있으면 외부에서 직접 JSP를 호출할 수 없다. 우리가 기대하는 것은 항상 컨트롤러를 통해서 JSP를 호출하는 것이다.

redirect vs forward
리다이렉트는 실제 클라이언트(웹 브라우저)에 응답이 나갔다가, 클라이언트가 redirect 경로로 다시 요청한다. 따라서 클라이언트가 인지할 수 있고, URL 경로도 실제로 변경된다.

반면에 포워드는 서버 내부에서 일어나는 호출이기 때문에 클라이언트가 전혀 인지하지 못한다.

회원등록 폼 - 뷰

new-form.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>

- webapp 아래에 WEB-INF/views 패키지 생성후, new-form.jsp 작성하기

결과확인

- <form action="save" ~> => 상대경로로 작성했기 때문에 해당 경로에서 save로 변경

만약, <form action="/save"~> 로 작성했다면 localhost:8080/save로 url이 이동한다.

2. 회원 저장

회원 저장 - 컨트롤러

MvcMemberSaveServlet.java

package hello.servlet.web.servletmvc;

import hello.servlet.domain.member.Member;
import hello.servlet.domain.member.MemberRepository;
import jakarta.servlet.RequestDispatcher;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import org.apache.coyote.Request;

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-request.jsp";
        RequestDispatcher dispatcher =  request.getRequestDispatcher(viewPath);
        dispatcher.forward(request, response);
    }
}

회원 저장 - 뷰

main/webapp/WEB-INF/views/save-result.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>Title</title>
</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>

결과확인

3. 회원 목록 조회

회원 목록 조회 - 컨트롤러

MvcMemberListServlet.java

package hello.servlet.web.servletmvc;

import hello.servlet.domain.member.Member;
import hello.servlet.domain.member.MemberRepository;
import jakarta.servlet.RequestDispatcher;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.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);
    }
}

회원 목록 조회 - 뷰

main/webapp/WEB-INF/views/members.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>

결과확인

MVC 패턴 - 한계

1. MBC 컨트롤러의 단점

"포워드 중복"

: View로 이동하는 코드가 항상 중복 호출되어야한다. 물론 이 부분을 공통화해도 되지만, 해당 메서드도 항상 직접 호출해야한다.

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

"ViewPath에 중복"

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

- prefix: /WEB-INF/views/
- suffix: .jsp

그리고 만약 jsp가 아닌 thymeleaf 와 같은 다른 뷰로 변경한다면 전체 코드를 다 변경해야한다.

"사용하지 않는 코드"

다음 코드를 사용할 때도 있고, 사용하지 않을 때도 있다. 특히 response는 현재 코드에서 사용되지 않는다.

HttpServletRequest request, HttpServletResponse response

그리고 이런 HttpServletRequest , HttpServletResponse를 사용하는 코드는 테스트 케이스를 작성하기도 어렵다.

"공통 처리가 어렵다"

기능이 복잡해질 수록 컨트롤러에서 공통으로 처리해야 하는 부분이 더 많이 증가할 것이다. 단순히 공통 기능을 메서드로 뽑으면 될 것 같지만, 결과적으로 해당 메서드를 항상 호출해야하고, 실수로 호출하지 않으면 문제가 될 것이다. 그리고 호출하는 것 자체도 중복이다.

"정리하면 공통 처리가 어렵다는 문제가 있다"

이 문제를 해결하려면 컨트롤러 호출 전에 먼저 공통 기능을 처리해야 한다.

소위 "수문장 역할"을 하는 기능이 필요하다. "프론트 컨트롤러(Front Controller) 패턴"을 도입하면 이런 문제를 깔끔히 해결할 수 있다. (입구를 하나로 !!)

스프링 MVC의 핵심도 바로 이 프론트 컨트롤러에 있다.