본문 바로가기

JAVA/JSP

JSP - MVC 패턴 실습

반응형

** 프로젝트 만들때 Generate web.xml deployment descriptor 체크 한후 만듬

==> WebContent/WEB-INF에 web.xml 을 생성하기 위해서


프로젝트 만들고 난후 start.jsp파일 생성 및 서버 실행시키고 server.xml에서

프로젝트 이름에 Resource 추가(톰캣 홈페이지에서 복사한것)



** Controller 실습

1. 사용자의 모든 요청을 받아 들이는 servlet 생성(HanbController)

doGet, doPost에 proRequest(); 라는 메소드 생성

doGet 이던 doPost 이던 똑같은 일처리를 하기 위해서 메소드 만들어 호출하자


컨트롤러가 동작하는지 메소드에 sysout으로 콘솔에 메세지 뜨는지 확인

==> start.jsp 실행시켜서


@WebServlet("/HanbController") =='어노테이션 annotation'

위에 것을 지워줌 (이유 : )


2. 해당 프로젝트 - WebContent - WEB-INF - web.xml 에다가

servlet 등록해야함


// 우리가 만든 서블릿을 어플리케이션이 알 수 있도록 등록하는 것

<servlet>

   <servlet-name>hanb</servlet-name> // 내가 임의로 정해주는 것

   <servlet-class>com.hanb.controller.HanbController</servlet-class> // Controller 경로 지정

// 키보드 ctrl 누른채로 마우스 갖다대면 링크가 잡혀야 한다.

</servlet>


// 사용자가 웹브라우저에 어떤요청을 했을때 서블릿이 동작할지 설정하는 것

<servlet-mapping>

   <servlet-name>hanb</servlet-name> // 위에 설정한 서블릿 이름과 동일해야함

   <url-pattern>/*</url-pattern> // '/*' 모든 요청을 의미 , '.do' ~~.do라고 치고들어오는 것만 처리

</servlet-mapping>

 


3. start.jsp 열어서 실행

http:// ~~~ / 이뒤에 어떠한것을 써도 컨트롤러가 작동됨


4. 사용자 요청에 따라 각각 다른 view 페이지로 이동하도록 해보자.

ListBoard.do 라고 요청하면 listBoard.jsp

InsertBoard.do 라고 요청하면 insertBoard.jsp로 이동하도록 하자


http://localhost:8088/day0420a/start.jsp ==>url

day0420a/start.jsp ==> uri

start.jsp ==> 서비스명


요청한 uri로 부터 사용자가 요구하는 서비스명을 파악한다.

uri는 request로부터 얻어올수 있다. 

==> String uri = request.getRequestURI();

System.out.println(uri);


방법 : 일단 listBoard.jsp , insertBoard.jsp 파일 생성 후 HanbController 에 proRequest 메소드에 작성

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

// uri는 request로부터 얻어올수 있다.

String uri = request.getRequestURI();

//System.out.println(uri);

// 이동해야될 뷰페이지를 변수처리

String view = "";

if(uri.equals("/day0420a/listBoard.do")){

view = "listBoard.jsp";

}else if(uri.equals("/day0420a/insertBoard.do")){

view = "insertBoard.jsp";

}

RequestDispatcher dispatcher = request.getRequestDispatcher(view);

dispatcher.forward(request, response);

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

그리고 

<url-pattern>*.do</url-pattern> 로 바꿔줌 ( /* 에서 *.do로 바꿈)


5. 전날했던 dao, vo, db 복사해 오고 db 는 context 로 커넥션하는걸로 바꿔줌


6. 인터페이스 만들기- 모든 액션들이 가져야할 메소드를 일반화 시키기 위해서 생성


7. ListBoardAction 클래스 생성 com.hanb.action 패키지 아래로


8. InsertBoardAction 클래스 생성 동일


9. HanbController 에 액션을 생성

바꾸기 전

if(uri.equals("/day0420a/listBoard.do")){

view = "listBoard.jsp";

}else if(uri.equals("/day0420a/insertBoard.do")){

view = "insertBoard.jsp";

}


바꾼 후

HanbAction action =null;


if(uri.equals("/day0420a/listBoard.do")){

action = new ListBoardAction();

}else if(uri.equals("/day0420a/insertBoard.do")){

action = new InsertBoardAction();

}

view = action.proRequest(request, response);



10. 전날했던 insertBoard.jsp 에 form 부분을 가져온다.

<form action="InsertBoard" method="post" enctype="multipart/form-data">

<input type="hidden" name="no" value="${no}">

글제목 : 

<input type="text" name="title" value="${title }">

<!-- 답글이라면 "[답글]부모글제목"의 형태로 답글이 아니라면 ""의 형태로 

서블릿에서 설정해 둔다. -->

<br>

작성자 : <input type="text" name="writer"><br>

글내용 : <br>

<textarea rows="10" cols="60" name="content"></textarea><br>

글암호 : <input type="password" name="pwd"><br>

첨부파일 : <input type="file" name="fname"><br>

<input type="submit" value="등록">&nbsp;&nbsp;&nbsp;

<input type="reset" value="취소">

</form>


11. 전날했던 listBoard.jsp 에 form 부분 가져온다.

<!-- 게시물 상세보기에 대한 기능을 구현합니다. -->

<h2>게시물 목록</h2>

<hr>

<a href="insertBoard.html">게시물 등록</a><br>

<table border="1" width="80%">

<tr>

<td>글번호</td>

<td>글제목</td>

<td>첨부파일</td>

<td>작성자</td>

<td>날짜</td>

<td>조회수</td>

</tr>



<c:forEach items="${list }" var="b">

<tr>

<td>${b.no }</td>

<td>

<c:if test="${b.b_level > 0 }">

<!-- 답글의 깊이(b_level)만큼 들여쓰기(빈칸)를 출력한다. -->

<c:forEach var="i" begin="1" end="${b.b_level }">

&nbsp;&nbsp;

</c:forEach>

<!-- 답글은 이미지 삽입 -->

<img src="re.png">

</c:if>

<a href="DetailBoard?no=${b.no }">${b.title } </a>

</td>


<td>

<c:if test="${b.fname != null}">

<img src="file.png">

${b.fsize }

</c:if>

</td>

<td>${b.writer }</td>

<td>${b.regdate }</td>

<td>${b.hit }</td>

</tr>

</c:forEach>

</table>

<hr>

<center>${pageStr }</center>


12. jar 파일 복사 


13. start.jsp 에 링크 걸기

<a href="listBoard.do">게시물 목록</a><br>

<a href="insertBoard.do">게시물 등록</a><br>


14. listBoard.jsp 에서 

추가 : <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

수정 : insertBoard.html 을 insertBoard.do 로 수정


15. 게시물 목록에 쓰이는 사진파일 file.png 와 re.png을 WEB-INF에 복사


16. 


17. HanbController.java의 if부분을 간소화 해야하는 이유

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

HanbAction action =null; 


if(uri.equals("/day0420a/listBoard.do")){

action = new ListBoardAction(); // 사용자의 서비스명이 listBoard.do 이면 ListBoardAction객체를 생성

}else if(uri.equals("/day0420a/insertBoard.do")){

action = new InsertBoardAction(); // 사용자의 서비스명이 insertBoard.do 이면 InsertBoardAction객체를 생성

}


// 해당 액션의 일처리를 위한 proRequest를 호출한다.

// proRequest 메소드는 해당 일처리를 수행하고 어디로 가야할지 viewPage를 반환한다.

// 반환한 것을 view에 담아준다.


view = action.proRequest(request, response);

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


 : 실제로 웹 서비스를 할 때는 지금처럼 서비스가 한 두가지는 아니다.

서비스의 수가 수십개 그 이상이 될 수 있을 텐데 그렇다면 front controller 가 if~else로 이만저만 복잡해질수 있다.


그래서 이를 간소화 할 필요가 있다.

서비스명과 처리를 위한 Action을 한쌍으로 map에 미리 등록해 둔다.


HanbController_a.java 재정의 함

맵 정의 HanbController_a

프로퍼티 파일 생성 

==> WEB-INF 밑에 만듬

==> new - file - 파일명 : hanb.properties

** 주의 사항

 : 모든 환경설정 파일들은 공백이 없어야 한다.

 : 가지고있는 경로와 일치해야 한다.

==> 내용 입력

==> HanbController 로 이동

프로퍼티 파일 정의 HanbController_b




** 역할 설명 

HanbController : 사용자의 모든 *.do 요청을 받아 들이는 front Controller를 정의

proRequest : 사용자가 get방식으로 요청하던지 post방식으로 요청하던지 수행되는 메소드

HanbAction : 사용자가 요청한 서비스명에 따라 어떠한 액션이라도 바라볼수 있도록 HanbAction의 참조변수를 선언한다.




** 수정하기 만드는 순서

1. properties 만들기

UpdateBoard.do = ~~.UpdateBoardAction

2. Action 만들기

UpdateBoardAction.java

return 은 jsp

3. detailBoard.jsp 버튼에 링크된거 수정

4. updateBoard.jsp 만들기

지난시간꺼 복사

** 수정에 대한 처리

5. updateBoard.jsp 수정

Form action 에 UpdateBoard.do 으로 수정

6. properties 만들기

UpdateBoardOk.do=~~.UpdateBoardOkAction

7. UpdateBoardOkAction 만들기

지난시간꺼 복사

return 은 view


여기서 view 생성

성공시 view = "listBoard.do";

실패시 view = "UpdateBoard.do?no="+multi.getParameter("no");

(만약 view = "UpdateBoard.do"; 만 준다면 error 뜸)


반응형