JSP | EL, JSTL 태그 라이브러리

    Front-end/JSP / / 2021. 1. 20. 17:44

    EL, JSTL 태그 라이브러리

    EL - 표현 언어

    EL(Expression Language)란, 표현식 또는 액션태그를 대신해서 값을 표현하는 언어

     

     

    EL의 내장객체

     

    JSTL - 자바서버 페이지 표준 태그 라이브러리

    ㅇ

    EL 표기법 예제

    EL(Expression Language, 표현 언어) : 
    1) <%=  %> 표현식을 좀더 편리하게 사용하기 위해 jsp 2.0부터 도입
    2) 데이터 출력 기능, 값 출력 기능
    3) 표현 언어 자체내장 객체도 제공.
    4) 형식-   ${ 표현식 or 값 }

     

    el.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!-- 
	EL(Expression Language, 표현 언어) : 
			1) 표현식을 좀더 편리하게 사용하기 위해 jsp 2.0부터 도입
			2) 데이터 출력 기능, 값 출력 기능
			3) 표현 언어 자체내장 객체도 제공.
 -->
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>EL 표기법</title>
</head>
<body>
	<%
		int el = 10;
		pageContext.setAttribute("scores", new int[] {10, 20, 30});
	%>
	표현식으로 출력한 내용<br/>
	<%=el %>
	<%=(1>2) || (1<2) %><br/><br/>
	
	EL로 출력한 내용<br/>
	${scores[0]}<br/>		<!-- 표현식 or 값 -->
	${"이방원"}<br/>
	${null}<br/>
	${100}<br/>
	
	연산자 이용<br/>
	${100 + 10}<br/>
	${1>2 ? "true":"false"}<br/>
	${1<2 ? "참" : "거짓"}<br/>
	
	${(1>2)&&(1<2)}<br/>
	${(1>2)||(1<2)}<br/>
	
	<!-- 
		EL 표기법 :
			1) 단순히 변수명을 주면 출력되진 않음.
			2) 객체 요소들의 값들을 간단한 코드로 가져올경우 사용하면 유용하다.
	 -->
</body>
</html>

    액션 태그와 EL표기법 (자바빈 액션 태그 복습) 

    MemberInfo.java 

    package kr.gov.el;

public class MemberInfo {
	private String name;
	private String id;
	private String pw;
	
	//생성자
	public MemberInfo() {
	
	}
	
	//getter, setter
	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public String getId() {
		return id;
	}

	public void setId(String id) {
		this.id = id;
	}

	public String getPw() {
		return pw;
	}

	public void setPw(String pw) {
		this.pw = pw;
	}
	
}

     

    elActionTag.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<!-- useBean 사용 객체 생성 -->
<jsp:useBean id="member" class="kr.gov.el.MemberInfo"/>
<!-- 여기서 name은 유즈빈의 아이디값이다. 빈에 있는 속성값을 꺼낼 목적 -->
<!-- jsp:setProperty액션태그 이용하여 member값을 저장함. -->
<jsp:setProperty property="name" value="이도" name="member"/>
<jsp:setProperty property="id" value="Lee" name="member"/>
<jsp:setProperty property="pw" value="1234" name="member"/>

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>액션 태그와 EL표기법</title>
</head>
<body>
	<p>액션태그 사용<br/>
	<p>이름 : <jsp:getProperty property="name" name="member"/>
	<p>아이디 : <jsp:getProperty property="id" name="member"/>
	<p>비밀번호 : <jsp:getProperty property="pw" name="member"/>
	<br/><br/><br/><br/><br/>
	
	<p>EL표기법은 코드 가독성 향상과 표기법이 간단해서 코드 절약효과가 있다.
	<p>이름 : ${member.name}	
	<p>아이디 : ${member.id}	
	<p>비밀번호 : ${member.pw}	
</body>
</html>

    EL 내장객체 (로그인) 예제

    innerObject.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!-- 
	*표현언어(EL) 내장 객체(내장 변수)
		구분				내장객체
		---------------------------------
		스코프			pageScope
						requestScope
						sessionScope
						applicationScope
		요청매개변수 	param
						paramValues
		쿠기 값			Cookies
		JSP 내용			pageContext				  	

 -->    
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>EL 내장객체</title>
</head>
<body>
	<form action="innerObjectOk.jsp" method="get">
		<p>아이디 : <input type="text" name="id"><br/>
		<p>비밀번호 : <input type="text" name="pw"><br/><br/>
		<input type="submit" value="Login"><br/>
	</form>
	
	<%
		//내장객체들에게 속성들 지정
		application.setAttribute("application_name", "application내장객체");
		session.setAttribute("session_name", "session내장객체");
		request.setAttribute("request_name", "request내장객체");
		pageContext.setAttribute("pageContext_name", "pageContext내장객체");
	%>
</body>
</html>

     

    innerObjectOk.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>내장객체 저장값 출력하기</title>
</head>
<body>
	<%
		request.setCharacterEncoding("UTF-8");
		
		String id = request.getParameter("id");
		String pw = request.getParameter("pw");
	%>
	
	<!-- 표현식으로 값을 출력하는 부분 -->
	<p>아이디 : <%=id %><br/>
	<p>비밀번호 : <%=pw %><br/>
	
	<!-- EL태그의 내장객체 param객체를 이용하여 값 출력 -->
	<p>아이디 : ${param.id}<br/>
	<p>비밀번호 : ${param.pw}<br/>
	
	<!-- applicationScope내장객체 : 웹프로젝트에 전부 적용이 되는 값
		 session내장객체 : 한 브라우저당 발생하므로 역시 값이 출력될 것이다. -->	
	<p>applicationScope : ${applicationScope.application_name}<br/>
	<p>sessionScope : ${sessionScope.session_name}<br/>
	
	<!-- pageScope와 requestScope내장객체 : 현재 페이지는 적용이 되지 않아 결과값이 출력되지 않는다.  -->
	<p>pageScope : ${pageScope.pageContext_name}<br/>
	<p>requestScope : ${requestScope.request_name}<br/>
	
	<!-- 
		소결론 : EL태그는 개발하는데 있어 기존 산출물 소스에 내용을 해독할수 있어야 한다.
				 EL태그를 잘 이용하면 코드 양을 줄이고 가독성을 높일수 있다.
				 하지만 보안에 취약한 부분이 있다. => JSTL 사용			  
	 -->
</body>
</html>

    JSTL 다운로드 받기

    tomcat.apache.org/download-taglibs.cgi#Standard-1.2.5

     

    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

    4가지 jar파일 다운로드

    *커스텀 태그(Custom teg)
    - 액션 태그나 표현 언어를 사용하더라도 조건식이나 반복문 등 자바코드를 제거하기 위해서 도입된 기능.
     *커스텀 태그 종류
      - 1)JSTL (JSP Standard Tag Library)
      :JSP페이지에서 가장많이 사용하는 기능을 태그로 제공.
       JSTL 라이브러리를 따로 설치해서 사용가능
       
    - 2)개발자가 만든 커스텀 태그
    : 스프링 프레임워크(오픈소스)에서 미리 만들어서 제공.
     *JSTL 라이브러리 구분
    - 코어 : 변수, 조건문, 반복문 처리...
    - 국제화 : 숫자, 날짜 형식...
    - XML 
    - 데이터베이스 : SQL
    - 함수 : 컬랙션 처리, 문자열 처리

     

    JSTL라이브러리 set태그 예제 

    자바소스를 JSTL로 구현 -> 자바코드 없는 JSP페이지

    personInfo_set.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!-- *커스텀 태그(Custom teg)
		- 액션 태그나 표현 언어를 사용하더라도 조건식이나 반복문 등 자바코드를 제거하기 위해서 도입된 기능.
	 *커스텀 태그 종류
	 	- 1)JSTL (JSP Standard Tag Library)
	 		:JSP페이지에서 가장많이 사용하는 기능을 태그로 제공.
	 		 JSTL 라이브러리를 따로 설치해서 사용가능
	 		 
		- 2)개발자가 만든 커스텀 태그
			: 스프링 프레임워크(오픈소스)에서 미리 만들어서 제공.
	 *JSTL 라이브러리 구분
		- 코어 : 변수, 조건문, 반복문 처리...
		- 국제화 : 숫자, 날짜 형식...
		- XML 
		- 데이터베이스 : SQL
		- 함수 : 컬랙션 처리, 문자열 처리		
 -->
<!-- core태그 라이브러리를 사용하기위해 반드시 선언 -->
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!-- var : 사용할 변수이름, value : 변수에 저장할 값, scope : 접근범위-->
<c:set var="id" value="Lee" scope="page" /> 
<c:set var="pw" value="1234" scope="page" />

<!-- 변수값을 el태그 이용해서 저장 -->
<c:set var="name" value="${'정도전'}" />
<c:set var="age" value="${22}" />
<c:set var="height" value="${177}" />

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>JSTL라이브러리 set태그</title>
</head>
<body>
	<table border="1">
		<tr align="center" bgcolor="yellow">
			<td width="7%"><b>아이디</b></td>
			<td width="7%"><b>비밀번호</b></td>
			<td width="7%"><b>이름</b></td>
			<td width="7%"><b>나이</b></td>
			<td width="7%"><b>키</b></td>
		</tr>
		<!-- el태그 이용해서 값 출력 -->
		<tr align="center">
			<td>${id}</td>
			<td>${pw}</td>
			<td>${name}</td>
			<td>${age}</td>
			<td>${height}</td>
		</tr>
	</table>
</body>
</html>

     

    JSTL라이브러리 set태그-컨택스트 이름 예제 (context이름 -> 프로젝트 이름) server.xml참고

    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" %>
    
<%
	request.setCharacterEncoding("UTF-8");
%>
<!DOCTYPE html>
<!-- pageContext내장객체를 이용하여
 	 contextPath(웹프로그램 이름(프로젝트 이름))에다가 미리 경로(path)를 저장해둠
 -->
<c:set var="contextPath" value="${pageContext.request.contextPath}" scope="application" />
<html>
<head>
  <meta charset="UTF-8">
  <title>JSTL라이브러리 set태그-컨택스트 이름</title>
</head>
<body>
	<form action="#">
		<p>아이디 : <input type="text" size="20" /><br/>
		<p>비밀번호 : <input type="password" size="20" /><br/>
		<input type="submit" value="로그인" /><br/>
	</form>
		
		<p>컨택스트 패스 값 : ${contextPath}<br/>
		<!-- 내장객체의 다소 긴 속성을 사용할 필요가 없이 간단한 변수이름으로 컨택스트 패스 사용 -->
		<a href="${contextPath}/join/member.jsp">회원가입</a>
		
</body>
</html>

     

    JSTL라이브러리 set태그-bean활용 예제

    Member.java  자바빈 생성

    package kr.gov.jstl;

import java.sql.Date;

public class Member {
	
	private String id;
	private String pw;
	private String nam;
	private String email;
	private Date joinDate;
	
	//생성자
	public Member() {
	
	}

	//오버로딩
	public Member(String id, String pw, String nam, String email) {
		super();
		this.id = id;
		this.pw = pw;
		this.nam = nam;
		this.email = email;
	}
	
	//getter, setter
	public String getId() {
		return id;
	}

	public void setId(String id) {
		this.id = id;
	}

	public String getPw() {
		return pw;
	}

	public void setPw(String pw) {
		this.pw = pw;
	}

	public String getNam() {
		return nam;
	}

	public void setNam(String nam) {
		this.nam = nam;
	}

	public String getEmail() {
		return email;
	}

	public void setEmail(String email) {
		this.email = email;
	}

	public Date getJoinDate() {
		return joinDate;
	}

	public void setJoinDate(Date joinDate) {
		this.joinDate = joinDate;
	}
	
}

     

    beanjstl.jsp

    <%@page import="kr.gov.jstl.Member"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>   
<%
	request.setCharacterEncoding("UTF-8");
%> 
<!-- uesBean 액션태그 이용해서 컬랙션 객체들 가져왔다. -->
<jsp:useBean id="membersList" class="java.util.ArrayList"/>
<jsp:useBean id="membersMap" class="java.util.HashMap"/>

<%
	//HashMap에 값 저장
	membersMap.put("id", "Lee");
  	membersMap.put("pw", 1234);
  	membersMap.put("name", "이방원");
  	membersMap.put("email", "leebangwon@ggmail.com");
  	
  	//멤버객체 생성
  	Member member1 = new Member("ha","1234","하륜","ha@ggmail.com");
  	Member member2 = new Member("jung","1234","정도전","jung@ggmail.com");
  	
  	//ArrayList에 객체저장
  	membersList.add(member1);
  	membersList.add(member2);
  	
  	membersMap.put("membersList", membersList);
%>

<!-- 변수 memebersList에 membersMap.membersList값으로 저장 -->
<c:set var="membersList" value="<%=membersList%>" />

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>JSTL라이브러리 set태그-bean활용</title>
</head>
<body>
		<table border="1">
			<tr align="center" bgcolor="yellow">
			 	<td width="20%"><b>아이디</b></td>
			 	<td width="20%"><b>비밀번호</b></td>
			 	<td width="20%"><b>이름</b></td>
			 	<td width="20%"><b>이메일</b></td>
			</tr>
			
			<!-- HashMap에 직접 저장한 것을 출력. -->
			<tr align="center">
			 	<td>${membersMap.id}</td>
			 	<td>${membersMap.pw}</td>
			 	<td>${membersMap.name}</td>
			 	<td>${membersMap.email}</td>
			</tr>
			
			<!-- ArrayList에 저장된 객체임. 2개의 객체를 다시 HashMap에 저장을 함. -->
			<tr align="center">
			 	<td>${membersList[0].id}</td>
			 	<td>${membersList[0].pw}</td>
			 	<td>${membersList[0].name}</td>
			 	<td>${membersList[0].email}</td>
			</tr>
			
			<tr align="center">
			 	<td>${membersList[1].id}</td>
			 	<td>${membersList[1].pw}</td>
			 	<td>${membersList[1].name}</td>
			 	<td>${membersList[1].email}</td>
			</tr>
		</table>
</body>
</html>

    • 네이버 블러그 공유하기
    • 네이버 밴드에 공유하기
    • 페이스북 공유하기
    • 카카오스토리 공유하기
    loading

    티스토리툴바