코딩항해기

[JSP] 커스텀 태그, 사용자 지정 태그 본문

JSP

[JSP] 커스텀 태그, 사용자 지정 태그

miniBcake 2024. 8. 14. 10:31

 

 

 

커스텀 태그

스크립트 요소가 많아질 수록 JSP코드는 복잡해진다.

이러한 문제를 해결하기 위해 액션태그, JSTL, EL을 사용하지만 여전히 아쉬울 때 직접 태그를 제작할 수 있다.

 

이때 직접 제작한 태그를 커스텀 태그, 사용자 지정 태그라고 한다.

 

한 번 작성한 커스텀 태그는 재사용성이 높고, JSP코드의 가독성을 높이며, java언어를 모르는 다른 개발자와 협업할 때도 해당 태그 사용으로 해당 파트를 구현할 수 있다.

 

 

선언 (Core)

태그를 사용하기 위해서는 JSTL처럼 상단에 선언을 먼저 해야한다.

JSTL과 동일하게 코어 태그를 사용하며 사이트와 연결하는 것이 아니라 tag 폴더와 연결하는 것이므로 tagdir 속성을 사용한다.

<%@ taglib tagdir="/WEB-INF/tags(태그파일 위치)" prefix="태그를 표시할 변수명">

 

 

예시

더보기

JSP tag (WEP-INF 하위의 tags 폴더 안에 생성 후 작성)

<%@ tag language="java" pageEncoding="UTF-8"%>
<h1>커스텀 태그에서 출력하는 메세지입니다! :ㅇ</h1>

 

 

커스텀 태그를 호출하는 JSP

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib tagdir="/WEB-INF/tags" prefix="mytag" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>커스텀 태그 실습</title>
</head>
<body>
	<mytag:hello></mytag:hello>
</body>
</html>

 

 

화면

 

 

태그로 값 넘기기 (매개변수 설정)

몸체 내용으로 값을 전달하는 방식

<jsp:dobody></jsp:dobody>

 

태그를 사용해 호출하는 쪽에서 커스텀 태그 안에 작성한 내용을 태그로 넘겨 받을 수 있다.

값을 넘겨주는 JSP파일에서는 커스텀 태그 안에 내용을 작성하고,

값을 받는 태그에서는 알맞은 위치에 jsp:dobody 태그를 작성하면 된다.

<%@ tag language="java" pageEncoding="UTF-8"%>
<table>
	<tr>
		<td><jsp:doBody/></td>
		<td>외부에서 값 받아오기
		태그 바디에 넣어준 값을 받아올 수 있다.</td>
	</tr>
</table>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib tagdir="/WEB-INF/tags" prefix="mytag" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>커스텀 태그 실습</title>
</head>
<body>
	<mytag:table>태그바디영역 메세지를 넣으면 doBody 액션 태그를 통해 출력할 수 있다.</mytag:table>
</body>
</html>

 

 

 

JSP:attribute를 통해 값을 전달하는 방식

몸체 안의 내용을 전달하는 것 외에도 값도 따로 전달할 수 있다.

<%@ tag language="java" pageEncoding="UTF-8"%>
<%@ attribute name="border" %>
<%@ attribute name="bgcolor" %>
<table border="${border}" bgcolor="${bgcolor}">
	<tr>
		<td><jsp:doBody/></td>
		<td>외부에서 값 받아오기
		태그 바디에 넣어준 값을 받아올 수 있다.</td>
	</tr>
</table>

 

상단에 attribute name 속성으로 받아오는 값의 명칭을 설정해준다음 EL식으로 값을 받아 넣을 수 있다.

태그를 호출하는 쪽에서는 해당 attribute 값을 태그 속성을 통해 넘겨야한다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib tagdir="/WEB-INF/tags" prefix="mytag" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>커스텀 태그 실습</title>
</head>
<body>
	<mytag:table border="1" bgcolor="lightblue"></mytag:table>
	<mytag:table border="1" bgcolor="lightpink">태그바디영역 메세지를 넣으면 doBody 액션 태그를 통해 출력할 수 있다.</mytag:table>
</body>
</html>

 

이렇게 작성할 경우 object 타입으로 넘어가기 때문에, ArrayList, DTO 등의 타입이 정해져야할 경우, attribute 태그에 별도 속성 값을 설정해줄 수 있다.

<%@ attribute name="bgcolor" type="자료형" %>

 

 

 

dynamic-attribute

기본적으로 attribute디렉티브로 정의하지 않은 속성을 사용해야 할 경우 dynamic-attribute사용한다.

범용적으로 사용하기 위해 임의의 속성을 설정할 수 있어야 하고, 상황에 따라 동적으로 속성 기능 사용해야 한다.

모든 동적 속성은 java.util.Map타입의 EL변수에 저장되므로, 동적으로 지정한 속성들은 Map타입의 EL변수를 통해 접근할 수 있다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib tagdir="/WEB-INF/tags" prefix="mytag" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>커스텀 태그 실습</title>
</head>
<body>
	<mytag:table attr1="1" attr2="lightblue"></mytag:table>
</body>
</html>
<%@ tag language="java" pageEncoding="UTF-8"%>
<%@ attribute name="attr1" %>
<%@ tag dynamic-attributes="other"%>
${attr1}<br>
${other.attr2}
(화면)
1
lightblue

 

 

 

잘 정리된 이미지가 있어 첨부했다.

[출처] : https://shinny.tistory.com/77

'JSP' 카테고리의 다른 글

[JSP] 내장 객체 (request, session, application)  (0) 2024.08.17
[JSP] xml 파일로 error 페이지 설정하기  (0) 2024.08.14
[JSP] EL식, JSTL  (0) 2024.08.14
[JSP] header, footer 넣기  (0) 2024.08.09
[JSP] JDBCUtil 템플릿 정리  (0) 2024.08.09
'JSP' Related Articles more