[서블릿/JSP] 태그파일 방식으로 커스텀 태그 만들기

이전글

[서블릿/JSP] JSP 커스텀 태그란? JSP 2.0 SimpleTagSupport를 이용한 태그 작성 방법

태그파일을 이용한 커스텀태그 작성

커스텀태그란 개발자가 직접 구현한 액션태그입니다. 이전글에서도 설명했지만 커스텀 태그 개발 방법에는 태그핸들러 클래스를 이용한 방법과 이번글에서 소개할 태그파일(*.tag)을 작성하여 개발하는 방법이 있습니다.

태그파일은 JSP 문법과 거의 비슷한 스크립트 구문을 이용하여 커스텀태그를 작성하는 방식입니다. *.tag 확장자를 가진 태그파일을 작성하여 웹어플리케이션 경로에 넣어두면 서블릿컨테이너가 이 태그파일을 읽어 해석한 후 최종적으로 *.class 확장자를 가진 태그핸들러로 파싱하여줍니다.

1. 태그 구현용 태그를 이용하여 문법에 맞게 *.tag파일 작성
2. 웹어플리케이션 경로에 배포(복사)하기
3. 웹어플리케이션이 *.tag 파일을 해석하여 *.class 확장자를 가진 태그 핸들러 클래스로 파싱

마치 이 과정은 *.jsp 파일을 작성하면 JSP 컨테이너가 *.class 확장자를 가진 Servlet 클래스로 파싱하여 서비스하는것과 같은 구조입니다.

태그파일을 이용한 커스텀태그 작성시 장단점

그렇다면 태그파일을 이용해서 커스텀태그를 개발했을때의 장점과 단점은 무엇일까요?

먼저 장점의 경우에는 다음과 같습니다.

1. 커스텀태그 개발 절차가 단순하다.
2. Java코드를 작성하는 방식이 아닌 JSP 문법과 같은 태그 기반으로 작성하기때문에 디자이너와 협업이 용이하고 JSP를 알고 있으면 작성이 쉽다.
3. JSP처럼 HTML 사이에 태그 관련 요소가 들어가므로 구조를 파악하기 쉽다.

태그파일을 이용했을때의 단점은 다음과 같습니다.

1. 섬세하고 복잡한 기능의 태그를 개발하기가 어렵다.
2. 개발한 태그 배포시 JSP처럼 텍스트 형태의 .tag파일을 배포하므로 태그의 내부 코드가 그대로 드러난다.
3. 태그 사용시 에러가 발생했을때 컴파일된 class의 로그를 봐야 파악이 가능하므로 분석이 어렵다.

실습 예제

태그파일를 이용한 커스텀태그 개발을 알아보기 위해 실습 예제를 개발하면서 진행해보도록 하겠습니다.

<dololak:toSpan color="blueviolet" iterNum="5">
    hello
</dololak:toSpan>

실습 예제는 위와 같이 직접 개발한 toSpan이라는 커스텀태그를 JSP에서 사용하게되면 아래와 같이 속성으로 지정한 횟수만큼 색깔을 배경으로 하여 출력되도록 하는 커스텀태그를 개발해 볼것입니다.

JSP 커스텀 태그 구성

JSP 커스텀 태그를 개발하기에 앞서 태그의 구성을 보자면 다음과 같습니다. 태그사용은 <prefix:태그명>형식으로 하게되며, 개발한 태그에서 사용가능한 속성과 태그 몸체값을 지정해 줄 수 있습니다. 속성과 태그몸체는 개발한 태그에 따라 달라지며, 있을수도 없을수도 필수값일수도 선택일수도 있습니다. 커스텀태그를 개발하기 나름입니다.

예제 프로젝트

예제 프로젝트는 이클립스를 기준으로 아래과 같이 구성됩니다. -> 예제 GIT 주소

이번 예제에서 필요한 파일은 사실상 아래 두개의 파일뿐입니다.

• WEB-INF/tags/toSpan.tag - 개발한 태그파일입니다. 태그파일은 웹어플리케이션 경로의 WEB-INF/tags 디렉터리 하위에 넣어주어야지만 컨테이너가 인식합니다.
• customTagTest.jsp - 개발한 태그를 테스트해볼 JSP 페이지입니다.

toSpan.tag 파일 생성하기

웹어플리케이션경로 하위의 WEB-INF/tags디렉터리에 toSpan.tag태그파일을 생성합니다. 앞서 설명하긴 했지만 이 WEB-INF/tags디렉터리에 태그파일을 생성해 주어야만 컨테이너가 태그파일을 인식할 수 있습니다. tags디렉터리 하위라면 새로운 이름으로 디렉터리를 생성하여 주더라도 인식이 가능합니다.

이클립스에서는 기본적인 태그 템플릿파일을 생성할 수 있습니다.

이클립스 상단 메뉴의 File > New > Other...

Web > JSP Tag 선택 > Next

자신의 프로젝트 웹어플리케이션 경로(여기서는 WebContent)하위의 WEB-INF/tags를 선택하고 생성할 태그파일명을 입력합니다. 디렉터리가 없는경우 직접 생성합니다. 추가적으로 태그파일명이 태그명이 됩니다. Finish 클릭하여 마무리합니다.

toSpan.tag 태그 작성

toSpan.tag파일의 내용을 다음과 같이 작성합니다. 내용을보면 몇가지 디렉티브(지시자)만 다를 뿐 평소에 사용하던 JSP와 다른점이 거의 없습니다. 태그파일은 JSP에서 사용하는 모든 스크립트 요소(스크립트릿, 표현식, 표현언어(EL) 등)와 기본객체를 사용 할 수 있습니다. 다만 기본객체의 경우 pageContext 대신 jspContext를 사용해야 합니다.

<%@ tag language="java" body-content="tagdependent"  pageEncoding="UTF-8"%>
<%@ attribute name="color" required="true" %>
<%@ attribute name="iterNum" required="true"  type="java.lang.Integer" %>
 
<%
    for(int i=0; i < iterNum; i++){
%>
    <span style="background-color: ${color}">
      ♥<jsp:doBody/>♥
    </span>
<%        
    }
%>

tag 디렉티브

tag 디렉티브(지시자)는 현재 태그파일에 대한 기본적인 정보를 설정하는데 사용됩니다. JSP의 page 디렉티브와 같은 역할을 합니다.

<%@ tag language="java" body-content="tagdependent"  pageEncoding="UTF-8"%>

tag 디렉티브에서 사용할 수 있는 속성은 다음과 같습니다.

속성	설명
language	사용하는 언어를 지정합니다.
body-content	태그 사용시 시작태그와 끝태그 사이의 몸체(body)를 어떻게 처리할지 지정합니다. 기본값은 scriptless이며 다음의 네가지 중 하나를 지정합니다. JSP : JSP코드로서 처리합니다. tagdependent : 단순한 텍스트로 처리하며 태그 구현에 처리를 맡깁니다. empty : 태그 몸체를 가질 수 없습니다. scriptless : 태그 몸체를 사용할 수 있으나 JSP의 스크립트 요소들을 태그에 사용할 수 없습니다.
pageEncoding	태그에서 사용할 인코딩을 지정합니다. 태그에서 한글을 사용하는 경우 UTF-8이나 EUC-KR 등을 사용해야 합니다.
dynamic-attributes	동적 변수 기능에 대한 속성입니다.
isELIgnored	태그 내에서 표현 언어 EL을 인식할지 여부를 지정합니다.
description	태그에 대한 설명을 나타냅니다.
display-name	태그의 표시명을 지정합니다. 지정하지 않는 경우 기본값은 태그파일명에서 .tag 확장자를 뺀것입니다.
deferredSyntaxAllowedAsLiteral	#, { 문자의 사용여부를 지정합니다.
trimDirectiveWhitespaces	태그 실행시 출력 결과에서 공백문자를 제거할지 여부를 지정합니다.
large-icon	태그를 표시할 큰 아이콘 이미지를 지정합니다.
small-icon	태그를 표시할 작은 아이콘 이미지를 지정합니다.

attribute 디렉티브

attribute 디렉티브(지시자)는 태그의 속성을 정의하는 디렉티브입니다. toSpan 태그는 color, iterNum두개의 속성을 사용하기때문에 다음과 같이 선언합니다. 추가적으로 iterNum 속성은 정수이기에 type 속성으로 java.lang.Integer를 지정해주어야 합니다. 그렇지 않으면 기본값인 String으로 처리됩니다.

<%@ attribute name="color" required="true" %>
<%@ attribute name="iterNum" required="true"  type="java.lang.Integer" %>

attribute 디렉티브에서 사용할 수 있는 속성은 다음과 같습니다.

속성	설명
name	사용할 속성명을 지정합니다.
required	태그 사용시의 속성의 필수여부를 지정합니다.
type	속성의 자료형을 지정합니다. 기본값은 String입니다.
description	속성에 대한 설명을 입력합니다.
rtexprvalue	속성에 JSP 스크립트릿 표현식을 사용할 수 있는지 여부를 지정합니다.
fragment	true로 지정하면 속성값을 전달시 rtexprvalue는 false가 되고 속성의 타입은 javax.servlet.jsp.tagext.JspFragment가 됩니다.

태그 안에서는 내부적으로 jspContext객체에 있는 Map형태의 attribute에 저장되므로 다음 코드와 같이 getAttribute() 메서드를 통해 속성값을 얻을 수 있습니다.

    int iterNum = (Integer)jspContext.getAttribute("iterNum");
    for(int i=0; i < iterNum; i++){

속성은 ${color}와 같이 표현언어 EL로 사용할수도 있습니다.

    <span style="background-color: ${color}">
      ♥<jsp:doBody/>♥
    </span>

태그 몸체(body) 처리

<jsp:doBody/>는 태그사용시 몸체에 입력한 값을 출력하는 태그이며 여러번 사용이 가능합니다. 이번 예제에서는 hello가 해당 태그의 처리 결과로 출력됩니다. 당연히 tag 디렉티브의 body-content 속성이 empty이면 오류가 발생합니다.

<jsp:doBody/>

이번 예제에서는 tagdependent로 설정했기 때문에 태그 몸체에 JSP 스크립트 요소를 입력하거나 그 어떤값을 입력하더라도 태그 내부에서는 단순한 문자열로 처리합니다.

테스트를 위한 customTagTest.jsp 작성

다음은 태그를 실제로 사용해볼 customTagTest.jsp 작성입니다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="dololak" tagdir="/WEB-INF/tags" %>
 
<html>
<head>
<title>커스텀 태그 테스트</title>
</head>
<body>
    <dololak:toSpan color="blueviolet" iterNum="5">
        hello
    </dololak:toSpan>
</body>
</html>

태그를 사용하기 전에 taglib 디렉티브를 통해 태그를 import 하는것과 같이 선언해주어야 합니다. 

<%@ taglib prefix="dololak" tagdir="/WEB-INF/tags" %>

prefix속성은 태그라이브러리의 접두사를 결정합니다. 만약 하나의 웹어플리케이션에서 여러가지 태그라이브러리를 사용하는 경우 태그이름이 겹칠 수 있는데, 접두사를 지정해주어 겹치지 않게 하는 네임스페이스 역할을 합니다. 마치 Java의 클래스명이 겹치더라도 패키지 경로가 다르면 다른 클래스인것으로 인식하는것과 같습니다.

tagdir속성의 경우 개발한 .tag파일이 있는 디렉터리 경로를 웹어플리케이션 경로를 기준으로 절대경로(/로 시작하는)형식으로 지정해 주어야 합니다. 태그명은 해당 tagdir에 지정한 디렉터리의 태그파일명 에서 확장자를 뺀것입니다.

드디어 개발한 태그를 사용하는 부분입니다. 태그라이브러리를 사용할때는 <prefix:태그명>형식으로 사용합니다. 따라서 여러 태그라이브러리를 사용하여 toSpan이라는 태그가 여러개 중복되어 존재하더라도 prefix로 구분되어 실행됩니다.

    <dololak:toSpan color="blueviolet" iterNum="5">
        hello
    </dololak:toSpan>

테스트

customTagTest.jsp를 실행하면 다음과 같이 결과가 출력됩니다.

다음글

[서블릿/JSP] *.tag 태그 파일 내부에서 사용한 변수를 호출한 JSP로 넘기기

[서블릿/JSP] *.tag 태그파일에서 동적 속성 사용하는 방법