티스토리 뷰
자주 사용하는 웹프로그래밍 페이지 이동 방법에 대해서 정리해 보려고 합니다.
JSP 위주로 정리하겠지만 Javascript 방식이나 Meta 태그는 다른 언어에서도 똑같이 적용 가능하므로 잘 봐두시면 좋을 것 같네요.
먼저 언제 이런 페이지 이동을 사용할까요?
예를 들어, http://www.word.pe.kr/에 접속한 사용자를 http://www.word.pe.kr/home/index.html 로 이동시킨다든지~
로그인한 사용자를 특정 위치로 이동시킬 때 이런 페이지 이동이 필요하게 됩니다.
자~ 그럼 페이지 이동에 대해서 살펴보도록 하죠.
Javascript를 활용한 페이지 이동
Javascript를 활용한 예제는 모든 언어에서 이용 가능합니다. 왜냐하면 자바스크립트 자체가 대부분의 언어에서 지원하기 때문이죠.
그럼 예제를 한번 보도록 하겠습니다.
<script>window.location.href="home/index.jsp";</script>
현재 창에서 home/index.jsp 파일이 열리게 되겠죠.
이와 유사한 것으로 replace가 있습니다.
<script>window.location.replace("home/index.jsp");</script>
일단 둘의 공통점은 현재 창에서 home/index.jsp 파일이 열린다는 것이죠.
차이점은 window.location.href는 뒤로가기 버튼을 눌렀을 때 호출한 페이지로 이동할 수 있지만,
window.location.replace는 호출한 페이지로 이동할 수 없다는 데 있습니다.
마지막으로 팝업으로 띄울 때는 다음과 같이 할 수 있죠.
창의 크기나 다른 사항들은 옵션으로 설정할 수 있습니다. (여기서는 간단하게 팝업 띄우는 것만 정리하죠.. )
<script>window.open("popup.jsp");</script>
meta 태그 이용하여 페이지 이동
예전에 ASP를 할 때 많이 사용하던 방법입니다.
0초 후에 페이지를 이동하는 것인데요. 브라우저의 특성을 따르기는 합니다만 대부분의 브라우저에서 잘 동작하므로 무난하게 사용하실 수 있습니다.
<meta http-equiv=refresh content="0;url=home/index.jsp">
content 다음에 0 대신 1을 넣으면 1초 후에 이동하게 됩니다.
여기까지는 꼭 jsp가 아니어도 가능한 부분이었습니다. 이제부터는 JSP에서 페이지 이동에 사용하는 방법을 정리해 보려고 합니다.
jsp:forward를 사용하여 페이지 이동
jsp:forward를 활용하여 이동할 경우, 서버측에서 바로 포워딩 하기 때문에 클라이언트에서는 빠르다고 느낄 수 있습니다.
다음 그림을 한번 보시죠..
소스는 다음과 같이 사용합니다.
<jsp:forward page="home/index.jsp"/>
만약 home/index.jsp 파일 내부에 상대 경로로 이미지나 css 파일의 경로가 지정되어 있다면, 적용되지 않습니다.
왜냐하면 현재 디렉토리를 기준으로 상대 경로를 체크하기 때문입니다.
또한 <jsp:forward>를 호출 한 이후의 JSP 코드는 실행되지 않는 것이 원칙입니다. (위 그림에서 보면 a.jsp의 다른 소스들이 해당 되겠죠.)
그러나 try .. catch .. finally로 설정한 구문이 있을 경우, finally 절은 실행이 됩니다.
response.sendRedirect를 사용하여 페이지 이동
마지막으로 살펴볼 것은 jsp의 response 객체의 sendRedirect를 이용해서 페이지를 이동하는 것입니다.
공식적인 용어로 response.sendRedirect는 내장객체를 활용한 것이고, jsp:forward는 액션 태그를 활용한 것이라고 하죠..
소스 코드를 살펴보시죠~
<%
response.sendRedirect("home/index.jsp");
%>
response.sendRedirect는 그 아래에 있는 모든 jsp 코드들을 모두 실행하게 됩니다.
그러므로 response.sendRedirect는 다른 JSP 로직이 처리된 후 맨 마지막에 넣는게 바람직하겠죠..
이상으로 JSP에서 페이지 이동하는 것에 대해서 정리해 봤습니다.
각각 조금씩 다르게 설계되어 있으므로 각자의 필요에 따라 적절한 것을 찾아서 활용하시면 될 것 같습니다.
'프로그래밍 > Web' 카테고리의 다른 글
웹 브라우저 크기에 따라 내용 부분을 자동으로 늘리기~ (0) | 2012.08.25 |
---|---|
CSS 호환성을 위하여 MS의 인터넷익스플로러 브라우저 구분하는 방법 (0) | 2012.08.20 |
[웹표준 #5] <strong>, <em>과 <b>, <i>를 구분해서 사용하자! (1) | 2012.08.05 |
하이브리드 앱 개발을 위한 폰갭(phonegap) 소개 (2) | 2012.07.06 |
웹에서 사용할 수 있는 무료 그래프 툴에 대하여 (0) | 2012.06.25 |