[스프링] 2. 웹 백엔드 프로그래밍 기초 - JSTL & EL

JM·2022년 11월 26일

부스트코스 웹백엔드 과정

목록 보기

7/10

JSTL(JSP Standard Tag Library)

JSP 페이지에서 조건문 처리, 반복문 처리 등을 html tag형태로 작성할 수 있게 도와준다.초기에는 HTML코드와 JSP 스트립트릿 코드를 함께 썻다. 하지만, 프론트엔드 개발자 입장에서 유지보수가힘들다는 단점이 존재했다. 이런 문제를 해결하기 위해 등장한 것이 JSTL이다.

JSTL 설치방법

참고링크 : https://www.boostcourse.org/web326/lecture/258521?isDesc=false
참고링크 : https://stackoverflow.com/questions/31043869/intellij-and-jsp-jstl-cannot-resolve-taglib-for-jstl-in-tomcat7
다운로드 링크 : http://tomcat.apache.org/download-taglibs.cgi

위 링크에서 Impl, Spec, EL jar파일들을 다운받고 WEB-INF폴더 하위의 lib폴더에 넣어줘야 한다.인텔리제이를 사용할 경우, 톰캣 lib폴더에 추가해주고, project structure에 가서 라이브러리를 추가해야 한다.

JSTL 코어태그 : 변수 지원 태그 - set, remove

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="value1" scope="request" value="kang"/>
<html>
<head>
    <title>Title</title>
</head>
<body>
성 : ${value1}<br>
<c:remove var="value1" scope="request"/>
성 : ${value1}<br>
</body>
</html>

taglib : jstl을 사용하기 위한 설정이다. 이때 uri값과 prefix를 지정해줘야 한다.set : 변수를 선언 및 초기화한다.remove : set되었던 변수를 제거한다.

코어태그 : 변수 지원 태그 - 프로퍼티, 맵의 처리 및 흐름제어 태그

<c:set target="${some}" property="propertyName" value="anyValue">

some 객체가 자바빈일 경우 : some.setPropertyName(anyvalue)
some 객체가 맵(map)일 경우 : some.put(propertyName, anyValue)

if의 경우 java의 if와는 다르게 else가 없다.

<c:if test="조건">
    조건이 true일 경우에 실행되는 코드 body
</c:if>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="n" value="0" scope="request"/>
<html>
<head>
    <title>Title</title>
</head>
<c:if test="${n == 0}">
    n과 0은 같습니다.
</c:if>
<c:if test="${n == 10}">
    n과 10은 같습니다.
</c:if>
</body>
</html>

코어 태그 : 흐름제어 태그 - choose

<c:choose>
    <c:when test="조건1">
      ...
    </c:when>
    <c:when test="조건2">
      ...
    </c:when>
    <c:otherwise>
      ...
    </c:otherwise>
</c:choose>

<c:choose>
    <c:when test="${score >= 90}">
        A학생입니다.
    </c:when>
    <c:when test="${score >= 80}">
        B학생입니다.
    </c:when>
    <c:otherwise>
        F학생입니다.
    </c:otherwise>
</c:choose>

코어 태그 : 흐름제어 태그 - forEach

forEach 태그는 반복문을 수행하는 태그이다.

문법

<c:forEach var="변수" items="아이템" [begin="시작번호"] [end="끝번호"]>
...
${변수}
...
</c:forEach>

var : items 리스트의 각각의 원소들이 할당되는 변수
items : 반복가능한 Collection. 배열, list, Enumeration, Map
begin : items에 지정한 목록에서 값을 읽어올 인덱스의 시작값
end : items에 지정한 목록에서 값을 읽어올 인덱스의 끝값

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    List<String> list = new ArrayList<>();
    list.add("hello");
    list.add("World");
    list.add("!!!!");

    request.setAttribute("list",list);
%>
<html>
<head>
    <title>Title</title>
</head>
<body>
<c:forEach items="${list}" var="item" >
    ${item} <br>
</c:forEach>>
</body>
</html>

코어 태그 : 흐름제어태그 - import

url로 부터 읽어온 결과를 지정한 변수에 저장한다.

문법

<c:import url="URL" charEncoding="캐릭터인코딩" var="변수명" scope="범위">
    <c:param name="파라미터이름" value="파라미터값"/>
</c:import>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:import url="https://google.com" var="urlValue" scope="request"/>

<html>
<head>
    <title>Title</title>
</head>
<body>
    ${urlValue}
</body>
</html>

코어 태그 : 흐름제어태그 - redirect

지정한 페이지로 리다이렉트한다. Servlet에서 response.sendRedirect()를 수행하는 것과 유사하다.

문법

<c:redirect url="리다이렉트할 URL">
    <c:param name="파라미터이름" value="파라미터값">
</c:redirect>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:redirect url="http://localhost:8080/WebservletTest_war_exploded/jstl05.jsp"/>
<html>
<head>
    <title>Title</title>
</head>
<body>

</body>
</html>

코어 태그: 기타태그 - out

JspWriter는 JSP페이지가 생성하는 결과를 출력할 때 사용되는 출력 스트림이다. out태그는 해당 스트림에 데이터를 출력해준다.

문법

<c:out value="value" escapeXml="{true|false}" default="defalutValue"/>

escapeXml : 이 속성의 값이 true일 경우 < , & , ' , "와 같은 문자들을 변환해준다. 즉, javascript코드와 같은 코드들을 실행시키지 않고 코드 그 자체를 출력시켜준다.

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
<c:set var="t" value="<script type='text/javascript'>alert(1);</script>"/>
<c:out value="${t}" escapeXml="true"/>
</body>
</html>

EL(Experssion Language)

참고자료 : https://www.boostcourse.org/web326/lecture/258517?isDesc=false

EL은 값을 표현하는 데 사용되는 스크립트 언어로서 JSP의 기본 문법을 보완하는 역할을 한다.JSP에 자바 코드가 들어가면 프론트엔드 개발자가 봤을 때 당황할 수 있다. 이러한 점을 고려하여JSP에 있는 자바 코드를 이해하기 쉽게 표현하기 위한 EL이 등장했다.

주요 기능

JSP의 스코프에 맞는 속성 사용. JSP의 내장객체보다 더 쉽게 스코프에 접근할 수 있다.
집합 객체에 대한 접근 방법 제공.
수치 연산, 관계 연산, 논리 연산자 제공
자바 클래스 메소드 호출 기능 제공
표현언어만의 기본 객체 제공

표현 방법

문법 ${expr} : expr은 EL에서 정의한 문법에 따라 값을 표현하는 식이다.
예제 <b>${sessionScope.member.id}</b>

JSP 예제

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    pageContext.setAttribute("p1","page scope value");
    request.setAttribute("r1","request scope value");
    session.setAttribute("s1","session scope value");
    application.setAttribute("a1","application scope value");
%>
<html>
<head>
    <title>Title</title>
</head>
<body>
pageContext.getAttribute("p1") : <%=pageContext.getAttribute("p1")%><br>

pageContext.getAttribute("p1") : ${pageScope.p1}<br>
request.getAttribute("r1") : ${requestScope.r1}<br>
session.getAttribute("s1") : ${sessionScope.s1}<br>
application.getAttribute("a1") : ${applicationScope.a1}<br>

pageContext.getAttribute("p1") : ${p1}<br>
request.getAttribute("r1") : ${r1}<br>
session.getAttribute("s1") : ${s1}<br>
application.getAttribute("a1") : ${a1}<br>
</body>
</html>

나는 사는데로 생각하지 않고, 생각하는데로 살겠다

이전 포스트

[스프링] 2. 웹 백엔드 프로그래밍 기초 - JSP & redirect & forward & scope

다음 포스트