[JSP]JSP 표준 태그 라이브러리(JSTL)

JSP

[JSP]JSP 표준 태그 라이브러리(JSTL)

dev23 2024. 8. 15. 17:48

- JSTL(JSP Standard Tag Library)이란 커스텀 태그 중 가장 많이 사용되는 태그를 표준화하여 라이브러리로

제공하는 것을 말한다.

여러 가지JSTL 태그

라이브러리	세부 기능	접두어	관련 URI
코어	변수 지원, 흐름 제어, 반복문 처리, URL 처리	c	http://java.sun.com/jsp/jstl/core
국제화	지역, 메시지 형식, 숫자 및 날짜 형식	fmt	http://java.sun.com/jsp/jstl/fmt
XML	XML 코어, 흐름 제어, XML 변환	x	http://java.sun.com/jsp/jstl/xml
데이터베이스	SQL	sql	http://java.sun.com/jsp/jstl/sql
함수	컬렉션 처리, 문자열처리	fn	http://java.sun.com/jstl/functions

- JSTL은 JSP 2.0 규약부터 추가된 기능으로 톰캣에서 기본으로 제공되지 않는다. 따라서 다음 사이트에서 라이브러리를

다운로드해 설치해야 한다.

https://tomcat.apache.org/download-taglibs.cgi

Apache Tomcat® - Apache Taglibs Downloads

Welcome to the Apache Taglibs download page. This page provides download links for obtaining the latest version of the Apache Standard Taglib, as well as links to the archives of older releases. You must verify the integrity of the downloaded files. We pro

tomcat.apache.org

- 페이지 접속 후 하단에 있는 다음 네 개의 jar 파일을 다운로드하여 /project/WebContent/WEB-INF/lib

폴더 안에 위치시키면 된다.

Core 태그 라이브러리

- 코어 라이브러리를 사용해 변수 선언, 조건식, 반복문 등의 기능을 구현한다.

- 코어 태그 라이브러리를 사용하려면 자바의 import 문처럼 반드시 JSP 페이지 상단에 taglib 디렉티브 태그를
추가해서 톰캣에 알려야 한다. 선언하지 않으면 오류가 발생한다.

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

Core 태그 라이브러리 기능

기능	태그	설명
변수 지원	<c:set>	JSP 페이지에서 변수를 지정한다.
변수 지원	<c:remove>	지정된 변수를 제거한다.
흐름제어	<c:if>	조건문을 사용한다.
	<c:choose>	switch문을 사용한다. <c:when>과 <c:otherwise> 서브 태그를 갖는다.
	<c:forEach>	반복문을 사용한다.
	<c:forTokens>	구분자로 분리된 각각의 토큰을 처리할 때 사용한다.
URL 처리	<c:import>	URL을 이용해 다른 자원을 JSP 페이지에 추가한다.
	<c:redirect>	response.sendRedirect() 기능을 수행한다.
	<c:url>	요청 매개변수로부터 URL을 생성한다.
기타 태그	<c:catch>	예외 처리에 사용한다.
기타 태그	<c:out>	JspWriter에 내용을 처리한 후 출력한다.

<c:set>

- <c:set> 태그를 이용해 변수를 선언한다.

<c:set var="변수명" value="변수값" "[scope='scope 속성 중 하나']" />

var : 변수 이름, value : 변수에 저장할 값, scope : 변수 스코프 지정(page, request, session, application)

- 사용 예

* member1.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
<%-- <c:set> 태그를 이용해 변수를 선언한다.
value 속성에는 표현 언어를사용해서 초기화할 수 있다. --%>
<c:set var="id" value="hong" scope="page" />
<c:set var="pwd" value="1234" scope="page" />
<c:set var="name" value="${'홍길동' }" scope="page" />
<c:set var="age" value="${22 }" scope="page" />
<c:set var="height" value="${177 }" scope="page" />

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 정보 출력창</title>
</head>
<body>
	<table align="left" width="800">
		<tr align="center" bgcolor="#99ccff">
			<td width="20%">아이디</td>
			<td width="20%">비밀번호</td>
			<td width="20%">이름</td>
			<td width="20%">나이</td>
			<td width="20%">키</td>
		</tr>

		<tr align="center">
			<td>${id }</td>
			<td>${pwd}</td>
			<td>${name}</td>
			<td>${age}</td>
			<td>${height}</td>
		</tr>
		<!-- 표현 언어로 바로 접근하여 값을 출력한다. -->
	</table>
</body>
</html>

변수 이름 축소

- <c:set> 태그를 이용해 너무 길어서 사용하기 불편한 변수나 속성 이름을 간결하게 만든다.

- JSP에서 <a> 태그를 이용해 다른 페이지로 이동할 때 표현 언어로 pageContext.request.contextPath 같은 긴 속성을
그대로 사용했는데, <c:set> 태그를 이용하면 긴 이름의 속성이나 변수를 줄여서 사용할 수 있다.

- 기존 사용 시

<a href="${pageContext.request.contextPath}/memberForm.jsp">회원가입하기</a>

- 다음은 pageContext.request.contextPath를 <c:set> 태그를 이용해 contextPath로 줄여서 사용하는 예제다.

* login.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<c:set var="contextPath" value="${pageContext.request.contextPath }" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>로그인 창</title>
</head>
<body>
	<form action="result.jsp">
		아이디 : <input type="text" size=20 /><br>
		비밀번호 : <input type="password" size=20 /><br>
		<input type="submit" value="로그인" />
	</form>
	<br><br>
	<a href="${contextPath}/EL/memberForm.jsp">회원가입하기</a>
</body>
</html>

- 이번에는 바인딩된 속성 이름이 긴 경우 더 짧은 변수로 대체해서 사용해 본다.

* member2.jsp

- 바인딩된 속성 이름을 축소한다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false" import="servlet.MemberBean"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
<jsp:useBean id="membersList" class="java.util.ArrayList" />
<jsp:useBean id="membersMap" class="java.util.HashMap" />
<%

	membersMap.put("id","park2");
	membersMap.put("pwd","4321");
	membersMap.put("name","박지성");
	membersMap.put("email","park2@test.com");
	MemberBean m1 = new MemberBean("son","1234","손흥민","son@test.com");
	MemberBean m2 = new MemberBean("ki","4321","기성용","ki@test.com");
	membersList.add(m1);
	membersList.add(m2);
	membersMap.put("membersList",membersList);
%>
<%--<c:set> 태그를 이용해 HashMap에 저장된 ArrayList에 접근하기 위해 사용하기 편리한 이름을 설정한다. --%>
<c:set var="membersList" value="${membersMap.membersList }" />

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 정보 출력창</title>
</head>
<body>
	<table align="left" width="800">
		<tr align="center" bgcolor="#99ccff">
			<td width="20%">아이디</td>
			<td width="20%">비밀번호</td>
			<td width="20%">이름</td>
			<td width="20%">이메일</td>
			<td width="20%">주소</td>
		</tr>

		<tr align="center">
			<td>${membersMap.id }</td>
			<td>${membersMap.pwd }</td>
			<td>${membersMap.name }</td>
			<td>${membersMap.email }</td>
		</tr>
		<%--<c:set> 태그로 설정한 변수 이름으로 접근하여 출력한다. --%>
		<tr align="center">
			<td>${membersList[0].id}</td>
			<td>${membersList[0].pwd}</td>
			<td>${membersList[0].name}</td>
			<td>${membersList[0].email}</td>
		</tr>
		<tr align="center">
			<td>${membersList[1].id}</td>
			<td>${membersList[1].pwd}</td>
			<td>${membersList[1].name}</td>
			<td>${membersList[1].email}</td>
		</tr>
	</table>
</body>
</html>

- 출력 결과는 다음과 같다.

<c:remove>

- JSP 페이지에서 변수를 선언했으면 <c:remove> 태그를 이용해 변수를 제거할 수도 있다.

- 형식은 다음과 같다.

<c:remove var="변수 이름" [scope="범위"] />

<c:if>

- JSP 페이지에서 조건문을 대체해 사용하는 태그이다.

- 형식

<c:if test="${조건식}" var="변수 이름" [scope="scope"] />

..

</c:if>

test : 표현 언어를 이용해수행할 조건식, var : 조건식의 결과값을 저장.

* member3.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
<c:set var="id" value="hong" scope="page" />
<c:set var="pwd" value="1234" scope="page" />
<c:set var="name" value="${'홍길동' }" scope="page" />
<c:set var="age" value="${22 }" scope="page" />
<c:set var="height" value="${177 }" scope="page" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 정보 출력창</title>
</head>
<body>
	<c:if test="${true }" >
		<h1>항상 참입니다.</h1>
	</c:if>
	
	<c:if test="${11==11 }">
		<h1>두 값은 같습니다.</h1>
	</c:if>
	
	<c:if test="${11!=31 }">
		<h1>두 값은 같지 않습니다.</h1>
	</c:if>
	
	<c:if test="${(id=='hong') && (name=='홍길동')}">
		<h1>아이디는 ${id }이고, 이름은 ${name }입니다.</h1>
	</c:if>
	
	<c:if test="${age==22 }" >
		<h1>${name}의 나이는 ${age }살입니다.</h1>
	</c:if>
	
	<c:if test="${height>160 }">
		<h1>${name }의 키는 160보다 큽니다.</h1>
	</c:if>
	
</body>
</html>

<c:choose>

- <c:choose> 태그는 JSP페이지에서 switch 문의 기능을 수행하며, 사용 형식은 다음과 같다.

<c:choose>
	<c:when test="조건식1" >본문내용1</c:when>
	<c:when test="조건식2">본문내용2</c:when>
	...
	<c:otherwise>본문내용 n </c:otherwise>
</c:choose>

* member4.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
<c:set var="id" value="hong" scope="page" />
<c:set var="pwd" value="1234" scope="page" />
<c:set var="name" value="${'홍길동' }" scope="page" />
<c:set var="age" value="${22 }" scope="page" />
<c:set var="height" value="${177 }" scope="page" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 정보 출력창</title>
</head>
<body>
	<table align="center" width="100%">
		<tr align="center" bgcolor="#99ccff">
			<td width="20%">아이디</td>
			<td width="20%">비밀번호</td>
			<td width="20%">이름</td>
			<td width="20%">나이</td>
			<td width="20%">키</td>
		</tr>

		<c:choose>
			<c:when test="${empty name }">
				<tr align="center">
					<td colspan="5"> 이름을 입력하세요!</td>
				</tr>
			</c:when>
			<c:otherwise>
				<tr align="center">
					<td>${id }</td>
					<td>${pwd }</td>
					<td>${name }</td>
					<td>${age }</td>
					<td>${height }</td>
				</tr>
			</c:otherwise>
		</c:choose>
	</table>
</body>
</html>

- 이름이 존재하는 경우

- 이름이 존재하지 않는 경우

<c:forEach>

- <c:forEach> 태그는 JSP 페이지에서 반복문을 수행하는 태그이며, 사용형식은 다음과 같다.

<c:forEach var="변수 이름" items="반복할 객체 이름" begin="시작값" end="마지막값" step="증가값" varStatus="반복상태변수이름" >
...
</c:forEach>

var : 반복할 변수 이름

items : 반복할 객체 이름

begin, end : 각각 반복 시작 및 종료 값

step : 한 번 반복할 때마다 반복 변수를 증가시킬 값

varStatus : 반복 상태 속성을 지정

varStatus의 속성

속성	값	설명
index	int	items에서 정의한 항목을 가리키는 index 번호이다. 0부터 시작한다.
count	int	몇 번째 반복인지 나타낸다. 1부터 시작한다.
first	boolean	첫 번째 반복인지 나타낸다.
last	boolean	마지막 반복인지 나타낸다.

* member5.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" import="java.util.*"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	List dataList = new ArrayList();
	dataList.add("hello");
	dataList.add("world");
	dataList.add("안녕하세요!");
%>
<c:set var="list" value="<%=dataList %>" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<c:forEach var="i" begin="1" end="10" step="1" varStatus="loop">
		i=${i } &nbsp;&nbsp;&nbsp; 반복횟수 : ${loop.count }<br>
	</c:forEach>
	<br>
	<c:forEach var="i" begin="1" end="10" step="2">
		5 * ${i } = ${5*i }<br>
	</c:forEach>
	<br>
	<c:forEach var="data" items="${list }">
		${data } <br>
	</c:forEach>
	<br>
	<br>
	<c:set var="fruits" value="사과, 파인애플, 바나나, 망고, 귤" />
	
	<c:forTokens var="token" items="${fruits }" delims=","> <%-- 구분자 ,(콤마)를 이용해 문자열을 분리해서 출력한다. --%>
		${token }<br>
	</c:forTokens>
</body>
</html>

<c:forEach> 태그를 이용해 ArrayList에 저장된 정보 출력

* member6.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false" import="java.util.*, servlet.MemberBean"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");

	List membersList = new ArrayList();
	MemberBean m1 = new MemberBean("son","1234","손흥민","son@test.com");
	MemberBean m2 = new MemberBean("ki","4321","기성용","ki@test.com");
	MemberBean m3 = new MemberBean("park","1212","박지성","park@test.com");
	
	membersList.add(m1);
	membersList.add(m2);
	membersList.add(m3);
%>
<c:set var="membersList" value="<%=membersList %>" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 정보 출력창</title>
</head>
<body>
	<table align="left" width="800">
		<tr align="center" bgcolor="#99ccff">
			<td width="20%">아이디</td>
			<td width="20%">비밀번호</td>
			<td width="20%">이름</td>
			<td width="20%">이메일</td>
		</tr>
		<c:forEach var="i" begin="0" end="2" step="1">
			<tr align="center">
				<td>${membersList[i].id }</td>
				<td>${membersList[i].pwd }</td>
				<td>${membersList[i].name }</td>
				<td>${membersList[i].email }</td>
			</tr>
		</c:forEach>
	</table>
</body>
</html>

- <c:forEach>의 items 속성 사용하기

<c:forEach var="member" items="${membersList }">
	<tr align="center">
        <td>${member.id }</td>
        <td>${member.pwd }</td>
        <td>${member.name }</td>
        <td>${member.email }</td>
	</tr>
</c:forEach>

- 결과

<c:url>

- <c:url> 태그는 JSP 페이지에서 URL 정보를 저장하는 역할을 하며 , 사용 형식은 다음과 같다.

<c:url  var="변수이름" value="URL 경로" [scope="범위"]>
	[<c:param name="매개변수이름" vaue="전달값" />]
</c:url>

var : 생성된 URL이 저장될 변수

value : 생성할 URL

scope : 범위

- 이동할 페이지로 전달할 데이터가 많을 경우에 사용하면 편리하다.

- 다음은 <c:url> 태그를 이용해 다른 페이지로 이동하면서 데이터를 전달하는 예제이다.

* urlTest.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="contextPath" value="${pageContext.request.contextPath }" />
<c:url var="url1" value="/jstl/member1.jsp">
	<c:param name="id" value="hong" />
	<c:param name="pwd" value="1234" />
	<c:param name="name" value="홍길동" />
	<c:param name="email" value="hong@test.com" />
</c:url>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>c:url 태그</title>
</head>
<body>
	<%--<a href="${contextPath/test01/member1.jsp">회원정보출력</a> --%>
	<a href="${url1 }">회원정보출력</a>
</body>
</html>

- "회원정보출력" 링크를 클릭하면 "/memer1.jsp" 페이지로 포워딩된다.

<c:redirect>

- <c:redirect> 태그는 지정된 JSP 페이지로 리다이렉트할 때 사용한다.

- response.sendRedirect()기능과 동일하며 <c:redirect> 태그로 리다이렉트할 때 매개변수를 전달할 수 있다.

- 사용 형식

<c:redirect url="redirect할 URL">
    [ <c:param name="매개변수 이름" value="전달값" />]
    ...
</c:redirec>

* redirect.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="contextPath" value="${pageContext.request.contextPath }" />
<c:redirect url="/jstl/member1.jsp">
	<c:param name="id" value="hong" />
	<c:param name="pwd" value="1234" />
	<c:param name="name" value="홍길동" />
	<c:param name="email" value="hong@test.com" />
</c:redirect>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>c:url 태그</title>
</head>
<body>
</body>
</html>

- /redirect.jsp 페이지를 요청하면 /member1.jsp 페이지로 리다이렉트된다.

<c:out>

- <c:out> 태그는 화면에 지정한 값을 출력해 주는 태그다.

- 표현 언어와 기능은 거의 동일하지만 기본값 설정 기능 등을 제공하므로 더 편리하게 사용할 수 있다.

- 사용 형식

<c:out vlaue="출력값" default="기본값" [escapeXml="boolean값"] />

value : 출력할 값

default : value 속성에 지정된 값이 없을 때 출력할 기본값

escapeXml : escape 문자를 변환하는 역할을 한다. (생략 가능, 기본값 : true)

* member7.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 정보 출력창</title>
</head>
<body>
	<table align="left" width="800">
		<tr align="center" bgcolor="#99ccff">
			<td width="20%">아이디</td>
			<td width="20%">비밀번호</td>
			<td width="20%">이름</td>
			<td width="20%">이메일</td>
		</tr>
		<c:choose>
			<c:when test="${empty param.id }">
				<tr align="center">
					<td colspan="5">아이디를 입력하세요!</td>
				</tr>
			</c:when>
			<c:otherwise>
				<tr align="center">
					<td><c:out value="${param.id }" /></td>
					<td><c:out value="${param.pwd }" /></td>
					<td><c:out value="${param.name }" /></td>
					<td><c:out value="${param.email }" /></td>
				</tr>
			</c:otherwise>
		</c:choose>
	</table>
</body>
</html>

- /member7.jsp?id=hong&pwd=1234&name=홍길동&email=hong@test.com 과 같이 요청해 본다.

- 프로그래밍을 하다 보면 > 또는 < 그리고 작은따옴표(')나 큰따옴표(") 같은 특수 문자를 출력해야 하는 경우가 있다.

- 이런 특수문자는 지정된 문자를 이용해 출력해야 한다.

특수 문자	변환된 문자
<	<
>	>
&	&
'	'
"	"

- <c:out> 태그의 escapeXml 속성을 이용하면 변환 문자를 특수 문자로 변환한다.

* escapeXml.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>escapeXml 변환</title>
</head>
<body>
	<c:out value="&lt" escapeXml = "true" /><br>
	<c:out value="&lt" escapeXml = "false" />
	<br><br>
	<c:out value="&gt" escapeXml = "true" /><br>
	<c:out value="&gt" escapeXml = "false" />
	<br><br>
	<c:out value="&amp" escapeXml = "true" /><br>
	<c:out value="&amp" escapeXml = "false" />
	<br><br>
	<c:out value="&#039" escapeXml = "true" /><br>
	<c:out value="&#039" escapeXml = "false" />
	<br><br>
	<c:out value="&#034" escapeXml = "true" /><br>
	<c:out value="&#034" escapeXml = "false" />
	
		
</body>
</html>

- 지금까지 일반적으로 많이 사용하는 코어 라이브러리에 대해 알아 봤다.

- 그 외 <c:import> 태그는 <jsp:include>와 같은 기능을 수행한다.

저작자표시 (새창열림)