MVC 패턴 - 적용

shinyeongwoon·2022년 12월 25일
MVCSpring
0

spring MVC

목록 보기
12/32
post-custom-banner

MVC Pattern 적용

서블릿을 컨트롤러로 사용하고, JSP를 뷰로 사용해서 MVC Pattern 적용하기
Model은 HttpServletRequest 객체를 사용한다.
request는 내부에 데이터 저장소를 가지고 있는데, request.setAttribute(), request.getAttribute()를 사용하면 데이터를 보관하고, 조회할 수 있다.

회원 등록

경로 : hello.servlet.web.servletmvc.MvcMemberFormServlet

package hello.servlet1.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 {
        String viewPath = "/WEB-INF/views/new-form.jsp";
        RequestDispatcher dispatcher = request.getRequestDispatcher(viewPath);
        dispatcher.forward(request,response);
    }
}

dispacher.forward() :
다른 servlet이나 JSP로 이동할 수 있는 기능.
서버 내부에서 다시 호출이 발생 한다.

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

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

회원 등록 폼 - 뷰

경로 ) main/webapp/WEB-INF/view/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>

여기서 form의 action을 보면 절대경로(/로 시작) 아니라 상대경로(/로 시작 X)인 것을 확인할 수 있다. 이렇게 상대경로를 사용하면 폼 전송시 현재 URL이 속한 계층 경로 + save가 호출된다.
현재 계층 경로 : /servlet-mcv/members
결과 : /servlet-mvc/members/save

실행 : http://localhost:8080/servlet-mvc/members/new-form
HTML Form이 잘 나오는 것을 확인할 수 있다.

📍 주의!
이후 코드에서 해당 jsp를 계속 사용하기 때문에 상대 경로를 사용한 부분을 그대로 유지

회원 저장

경로) hello.servlet.web.servlet

package hello.servlet1.web.servletmvc;


import hello.servlet1.domain.member.Member;
import hello.servlet1.domain.member.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);
        System.out.println("member = " + member);
        memberRepository.save(member);

        request.setAttribute("member",member);

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

        dispatcher.forward(request,response);

    }
}

HttpServletRequest를 Model로 사용한다.
request가 제공하는 setAttribute()를 사용하면 request 객체에 데이터를 보관해서 뷰에 전달 할 수 있다.
뷰는 request.getAttribute()를 사용해서 데이터를 꺼내면 된다.

회원 저장 - 뷰

경로 : main/webapp/WEB-INF/views/save-result.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의 arrtibute에 담긴 데이터를 편리하게 조회할 수 있다.

실행 : http://localhost:8080/servlet-mvc/members/new-form

MVC 덕분에 컨트롤러 로직과 뷰 로직을 확실하게 분리한 것을 확인할 수 있다.
향후 화면에 수정이 발생하면 뷰 로직만 변경하면 된다.

회원 목록 조회 - 컨트롤러

경로) hello.servlet.domain.servletmvc

package hello.servlet1.web.servletmvc;

import hello.servlet1.domain.member.Member;
import hello.servlet1.domain.member.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 {
        System.out.println("MvcMemberListServlet.service");

        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);

    }
}

request 객체를 사용해서 List<Member> members를 모델에 보관했다.

회원 목록 조회 - 뷰

경로) 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>

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

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

해당 기능을 사용하지 않고 다음과 같이 출력해도 되지만 매우 지저분하다.

<%
      for (Member member : members) {
          out.write("    <tr>");
out.write("
out.write("
out.write("
out.write("    </tr>");
<td>" + member.getId() + "</td>");
<td>" + member.getUsername() + "</td>");
<td>" + member.getAge() + "</td>");
}
%>

JSP와 같은 뷰 템플릿은 이렇게 화면을 렌더링 하는데 특화된 다양한 기능을 제공한다.
실행 : http://localhost:8080/servlet-mvc/members

MVC 패턴 - 한계

컨트롤러는 딱 봐도 중복이 많고, 필요하지 않는 코드들도 많이 보인다.

  1. 포워드 중복
    view로 이동하는 코드가 항상 중복 호출되어야 한다. 물론 이부분은 메서드로 공통화해도 되지만, 해당 메서드도 항상 직접 호출 해야 한다.
RequestDispatcher dispatcher = request.getRequestDispatcher(viewPatg);
dispatcher.forward(request,response);
  1. viewPath 중복
String viewPath = "/WEB-INF/views/new-form.jsp";

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

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

HttpServletRequest request, HttpServletResponse response

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

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

정리 하면 공통 처리가 어렵다는 문제가 있다.
이 문제를 해결하려면 컨트롤러 호출전에 먼저 공통 기능을 처리해야 한다.
소위 수문장 역할을 하는 기능이 필요하다.
프론트 컨트롤러(Front Controller)패턴을 도입하면 이런 문제를 깔끔하게 해결할 수 있다.(입구를 하나로 만들기)

profile
shinyeongwoon
binubibi
이전 포스트

MVC Pattern

다음 포스트

프론트 컨트롤러

post-custom-banner

0개의 댓글