[ View ]/JSP

[ JSP ] 액션 태그

환이s 2023. 3. 5. 18:19
728x90

오늘은 JSP 페이지에서 JAVA 코드를 줄이기 위한 방법으로 제공되는 액션 태그에 대해서 알아봅시다.

 

 

■  액션 태그란?

액션 태그는 JSP 페이지에서 자바 코드를 줄이기 위한 방법으로 제공되는 태그입니다. 즉, JSP 페이지에서 자바 코드 등의 스크립트 언어를 사용하지 않고도 다른 페이지의 서블릿이나 자바빈의 객체에 접근할 수 있도록 태그를 이용해 구현된 기능을 말합니다. 또한 이러한 기능들은 스크립틀릿 등의 스크립트 요소(JAVA 코드)를 사용하지 않기 때문에 개발자는 JSP 페이지의 내부적인 프로그램 로직을 사용자로부터 감출 수 있습니다.

 

그럼 액션 태그의 종류의 종류에 대해서 알아봅시다.

 

■  액션 태그의 종류

액션 태그 설 명
<jsp:include> 페이지 모듈화에 사용 (자바변수공유x) 되며
포함하는 페이지에서만 유효하다.
<jsp:forward> 다른 페이지로 제어를 이동시킬 때 사용한다.
<jsp:param> - forward 및 include 태그에 데이터 전달을 목적으로 사용되는 태그이다.

- name(이름)과 value(값) 으로 이루어져 있다.

- 단독으로 사용되지 못하며
<jsp:include>나 <jsp:forward>의 자식 태그로 추가한다.

- 다른 페이지에 여러 개의 정보를 전송해야 할 때는 다중의 param 액션 태그를 사용한다.
<jsp:useBean> java Bean을 jsp 페이지에서 참조할 때 사용한다.
<jsp:setProperty> java Bean의 property에 값을 저장할 때 사용
<jsp:getPorperty> java Bean의 property의 값을 읽을 때 사용

※ Tip ) 

- <jsp:include>는 자바변수를 공유할 수 없다. 하지만 

  <%@ include file = "../include/session_check.jsp" %>는 자바변수 공유가 가능하다.

그럼 예제 코드를 통해서 좀 더 알아봅시다.

 

■ <jsp:include>

 

include 액션은 임시로 제어권을 include되는 페이지로 넘겼다가 그 페이지의 처리가 끝나면 처리 결과는 원래 페이지로 되돌아오고 다시 원래의 페이지로 제어권을 반환하는 방식입니다.

 

따라서 include 액션은 include 지시어처럼 여러 페이지를 한 페이지 안에 담는 기능을 갖고 있습니다.

 

그럼 예제 코드를 통해서 알아봅시다.

 

JSP 파일은 총 3개정도 만들어서 진행하겠습니다.

먼저 뷰단으로 사용하는 start.jsp 파일을 먼저 생성해서 알아봅시다.

 

[코드는 간단하게 진행합니다]

 

<start.jsp>

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>start</title>
<script src="../include/jquery-3.6.3.min.js"></script>
</head>
<body>
<h1>[start.jsp]</h1>


<!-- middle.jsp를 가져오면서 파라미터값  "myValue"를 넘기면서 본페이지에 출력 -->
<jsp:include page="middle.jsp">
<jsp:param value="myValue" name="myKey"/>
</jsp:include>
<br>
<!-- 의 내용이 출력된 다음 맨 마지막에 출력됨 -->
myKey : <%= request.getParameter("myKey") %>

</body>
</html>

앞서 표에서 본 것처럼 param 액션은 단독으로 사용할 수 없고, name(이름)과 value(값)으로 이루어져 있습니다.

다음으로 middle.jsp 페이지를 만들어 줍니다.

 

<middle.jsp>

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>middle</title>
<script src="../include/jquery-3.6.3.min.js"></script>
</head>
<body>
<h1>[middle.jsp]</h1>
<!-- start.jsp에서 액션 파라미터태그를 활용해 value를 가져옴 -->
middle에서 전달 받은 값 : <%= request.getParameter("myKey") %>
<br>
<!-- 따로 액션파라미터 태그 처리하지 않고 end.jsp를 가져오지만 기존 파라미터값은 유지됨 -->
<jsp:include page="end.jsp"></jsp:include>

</body>
</html>

middle.jsp 페이지에서도 전달 받은 값을 보내주는 식으로 간단하게 코드를 보냅니다.

다음으로 end.jsp 페이지를 만들어 줍니다.

 

<end.jsp>

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>middle</title>
<script src="../include/jquery-3.6.3.min.js"></script>
</head>
<body>
<h1>[middle.jsp]</h1>
<!-- start.jsp에서 액션 파라미터태그를 활용해 value를 가져옴 -->
middle에서 전달 받은 값 : <%= request.getParameter("myKey") %>
<br>
<!-- 따로 액션파라미터 태그 처리하지 않고 end.jsp를 가져오지만 기존 파라미터값은 유지됨 -->
<jsp:include page="end.jsp"></jsp:include>

</body>
</html>

end.jsp 페이지도 middle.jsp 페이지와 동일하게 코딩을 합니다. 두 개의 페이지를 보면 전달받은 값이 모두 "myKey"

가 반환되서 출력되어야 합니다.

 

그럼 start 페이지에서 출력을 해봅시다.

 

위 결과를 확인해 보면 액션 태그를 쓰지 않고 파라미터값만 출력하고자 하는 값은 null값이 나왔습니다. 전달이 안되기 때문입니다. 즉,  include 액션 태그는 각 페이지의 처리가 끝나면서 처리 결과를 start 페이지에 반환하는 방식을 볼 수 있습니다.

 

■ <jsp:forward>

 

forward 액션 태그는 기능적으로 보면 include의 기능과 유사한 듯하면서 다르다.

include 된 JSP, Servlet페이지의 내용을 표시하는 것은 include와 동일하지만, include는 기존 페이지의 내용까지 같이 표시해 주는 반면, forward는 include 된 파일의 내용만 표시한다는 차이점이 있습니다.

 

forward액션의 page 속성에서 지정되는 이동할 페이지의 주소는 동일한 웹 애플리케이션의 콘텍스트 루트를 기준으로 한 절대 경로나 상대 경로로만 지정이 가능합니다.

 

forward 액션 태그의 예제 코드는 서블릿을 활용해서 알아봅시다. 

간단하게 이름,  좋아하는 색상, 취미를 출력하는 페이지를 만들어봅시다.

 

이전 포스팅은 @(어노테이션)을 활용해서 진행했는데, 이번에는 고전 방식으로 web.xml에 서블릿 페이지 값을 넣어주고 진행해 봅시다.

 

<web.xml>

 <!-- 웹프로젝트 이름(컨텍스트) -->
  <display-name>jsp01</display-name>
  
  <servlet>
  <servlet-name>forward</servlet-name>
  <servlet-class>ch03.ForwardController</servlet-class>
  </servlet>
  <servlet-mapping>
  <servlet-name>forward</servlet-name>
  <url-pattern>/ch03_servlet/forward.do</url-pattern>
  </servlet-mapping>

서블릿 name은 forward으로 지정하고, 파일 경로는 ch03이라는 패키지 안에 있는 ForwardController 클래스로 클래스 설정을 했습니다. 

 

Tip ) servlet-mapping에서 name은 동일하게 해 줍니다.

 

서블릿에 대한 부분은 이전 포스팅으로 알아봤는데 아래 포스팅을 참고해 봅시다.

 

[ JSP ] 웹 프로그래밍(JSP)의 개요 및 구성 요소

 

[ JSP ] 웹 프로그래밍(JSP)의 개요 및 구성 요소

오늘부터 웹 프로그래밍(JSP) 포스팅을 해보려 합니다. 지금까지 알아본 JAVA, SQL , HTML, JAVAScript를 활용하는 중요한 단계라고 생각합니다. 앞으로 개발자를 준비하시는 분들이라면 꼭 알고 넘어가

drg2524.tistory.com

 

이번에는 이름, 좋아하는 색상, 취미 등을 체크할 수 있는 페이지를 만들어봅시다.

 

< forwardparamForm >

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>forwardParamForm</title>
<script src="../include/jquery-3.6.3.min.js"></script>
</head>
<body>
<%
String path = request.getContextPath();
%>
<form action="<%= path %>/ch03_servlet/forward.do">
이름 : <input name ="name"> <br>
색상 :  <select name="color">
		<option value="blue">파랑</option>
		<option value="green">초록</option>
		<option value="red">빨강</option>
		</select>
<br>
취미 : <input type="checkbox" name="hobby" value="낚시">낚시
	<input type="checkbox" name="hobby" value="등산">등산
	<input type="checkbox" name="hobby" value="운동">운동
	<input type="checkbox" name="hobby" value="독서">독서
<input type="submit" value="확인">		
</form>

</body>
</html>

form 태그에서 action 경로는 expression(표현식)으로  path 변수를 출력할 수 있게 했습니다. 

path 변수 안에 있는 requset 객체 메서드인 getContextPath()는 JSP 페이지가 웹사이트의 도달범위를 설정할 때 쓰입니다.

 

그럼 이번에는 값을 반환하기 위해 서블릿에 설정했던 ForwardController를 만들어줍니다.

코드 작업은 ForwardController에서 진행합니다.

 

< ForwardController >

package ch03;

import java.io.IOException;
import java.util.HashMap;
import java.util.Map;

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;


//@WebServlet("/ForwardController") //어노테이션 주석처리
public class ForwardController extends HttpServlet {
	private static final long serialVersionUID = 1L;


	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
			
			//한글 인코딩 설정
			request.setCharacterEncoding("utf-8");
			String name = request.getParameter("name");
			String color = request.getParameter("color");
			String[] hobby = request.getParameterValues("hobby");
			String message = "";
			
			switch (color) {
			case "blue": message="자기탐구화 내적성장을 상징";break;
			case "green": message="기분의 안정과 온화함을 상징";break;
			case "red": message="생명을 상징";break;
			default:
				break;
			}
			message += "하는 색입니다.";
			
			
			Map<String, Object> map = new HashMap<>();
			//맴에 자료 저장
			map.put("name", name);
			map.put("color", color);
			map.put("message", message);
			map.put("hobby", hobby);
			
			//request 영역에 저장
			request.setAttribute("map", map);
			
			//View 단에 보내기 : forward 방식(주소 고정)
			RequestDispatcher rd = request.getRequestDispatcher("/ch03/color.jsp");
			rd.forward(request, response);
		
	}

	
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		
		doGet(request, response);
	}

}

ForwardController 코드에서 변수네임은 view 단 각 태그들의 name과 동일하게 해 줍니다.

 

좋아하는 색상은 switch문을 활용해서 색상 선택할 시 해당 색상 네임은 문구와 동일하게 바뀌고, message 출력까지 할 수 있게 코드를 만들었습니다.

 

취미는 checkbox 타입으로 설정해서 자주 사용하는 배열 처리를 해주고 각 들어오는 값들은 

map에 자료를 저장해 줍니다.

 

그럼 해당 문구의 색상이 바뀌고, 값을 출력주는 View 단 작업을 합니다.

 

<View 단>

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ page import="java.util.Map" %>
    <%@ page import="java.util.HashMap" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>color</title>
<script src="../include/jquery-3.6.3.min.js"></script>
</head>
<body>
<%
Map<String,Object> map= (Map<String,Object>)request.getAttribute("map");
String name = (String)map.get("name");
String color = (String)map.get("color");
String message=(String)map.get("message");
String[] hobby = (String[])map.get("hobby");
%>
<%= name %> 님이 좋아하는 색상은
<span style="color: <%= color%>"><%= color %>이고</span> <%= message %><br>
취미 : 
<%
if(hobby != null)
	for(String str : hobby){
		out.println(str+ ",");
	}
%>



</body>
</html>

 

모든 코드 작업이 끝났습니다.

실행은 forwardparamForm 파일에서 진행합니다.

 

 

 

이름은 홍길동으로 지정하고 좋아하는 색상은 초록, 취미는 낚시, 등산을 체크했습니다.

 

여기서 결과값이 출력될 때 색상 체크를 초록으로 했으니까 green 문구는 초록색으로 나와야 정상입니다.

 

마치며

 

오늘은 액션 태그 중에서 include, forward에 대해서 알아봤습니다.

다음 포스팅 Bean으로 뵙겠습니다.

728x90

'[ View ] > JSP' 카테고리의 다른 글

[ JSP ] JAVA Bean  (0) 2023.03.07
[ JSP ] 에러 처리  (0) 2023.03.06
[ JSP ] model 종류 및 내장 객체 응용  (0) 2023.03.04
[ JSP ] 내장 객체  (2) 2023.03.03
[ JSP ] DB 연결  (0) 2023.03.02

'[ View ]/JSP'의 다른글

  • 현재글[ JSP ] 액션 태그

관련글

티스토리툴바