본문 바로가기

Java/JSP

7.13 웹 MVC, EL, 스탠다드 태그 라이브러리

19_guest_book_mvc

 

모델 2 방식

 

요청 전달받는게 컨트롤러(서블릿):흐름제어 (forward 방식)

요청에 대한 로직을 처리하는 모델(service(자바코드로 처리), dao(crud))2개로 나눠놓음

(forward 방식)request 이용해서 뷰 화면에 데이터 전달


-> 스크립틀릿을 대체하는  JSTL (JSP 스탠다드 태그 라이브러리 ): 자바코드를 태그 형식으로 ,

 

영역객체를 표현해주는 EL(expression language)

 

EXPRESSION LANGUAGE - 표현언어
4대 영역 객체의 속성값을 JSP page내에서
쉽게 연산하고 읽어서 출력할 수 있도록 구성된 언어

 

* 주석 처리 인식 안됨 \${} 이렇게 해야 주석처리 가능!

EL 표현식 - ${영역객체.key값}

page EL : ${pageScope.scopeName}<br/>

request EL : ${requestScope.scopeName}<br/>

session EL : ${sessionScope.scopeName}<br/>

application EL : ${applicationScope.scopeName}<br/>

 

EL scopeName: ${scopeName}<br/>

key값만 전달하면 pageContext의 findAttribute와 같음. 

key값만 전달해서 자주 사용함.

 

pageContext.removeAttribute("scopeName"); 동일한 키값의 모든 영역객체를 삭제함. 주의

 

 

<%

// 파라미터 전달받을때는 인코딩 지정해줘야함.

request.setCharacterEncoding("UTF-8");

String id = request.getParameter("id");

session.setAttribute("sessionID",id);

%>

<br/>

EL scope session : ${sessionScope.sessionID}<br/>

EL ${sessionID} <br/>

<input type="text" value="${param.id}"/>

request에서 전달된 파라미터 도 사용 가능


EL로 연산도 가능하다.

EL 표현언어 내부에서의 연산

 

EL내부에서 비교연산은 equals 메소드로 이루어진다.

<h2>EL 표현언어 내부에서의 연산</h2>

<h3>\${5 + 7} : ${ 5 + 7}</h3>

<h3>\${5 == 7} : ${ 5 == 7}</h3>

<h3>\${5 &lt; 7} : ${ 5 < 7}</h3>

<h3>\${5 + 7 == 8? true: false} : ${ 5 + 7 == 8? true: false}</h3>

 

<%

String s = null;

String s1 = new String("hi");

String s2 = new String("attribute");

String s3 = new String("attribute");

request.setAttribute("s", s);

request.setAttribute("s2", s2);

session.setAttribute("s1",s1);

session.setAttribute("s3",s3);

%>

<!-- 비교연산 - equals method를 이용하여 비교 -->

<h3>\${s == s1} : ${s == s1}</h3>

EL내부에서 비교연산은 equals 메소드로 이루어진다.

<h3>\${s2 == s3} : ${s2 == s3}</h3>

<h3>\${s1 != s} : ${s1 != s}</h3>

<h3>\${s2 eq s3} : ${s2 eq s3}</h3> <!-- equals -->

<h3>\${s2 ne s3} : ${s2 ne s3}</h3> <!-- not equals -->

<h3>\${s != s1 && s2 != s3} : ${s != s1 && s2 != s3}</h3>

<h3>\${s != s1 and s2 != s3} : ${s != s1 and s2 != s3}</h3>

 

<h3>\${s ne s1 || s2 ne s3} : ${s ne s1 || s2 ne s3}</h3>

<h3>\${s ne s1 or s2 ne s3} : ${s ne s1 or s2 ne s3}</h3>

직접 비교, 연산해야할 값 대입 가능.

<h3>${s1 ne "hi"}</h3>

 

<h3>\${empty list} : ${empty list}</h3>

값이 존재하는지? 항목이 존재하는지? 두개 다 확인

<h3>\${list.isEmpty()} : ${list.isEmpty()}</h3>

이렇게 객체 함수호출도 가능

 

<!-- 객체가 생성되어 있고 비어있지 않으면 -->

<h3>\${!empty list} : ${!empty list}</h3>

<h3>\${not empty list} : ${not empty list}</h3>

<h3>\${list} : ${list}</h3>


JSTL 사용해보자

MAVEN 에서 JSTL 라이브러리 다운받기 -> lib에 jar파일 넣어줌

(tomcat 9버전에서 사용 가능)

 

https://mvnrepository.com/artifact/javax.servlet/jstl/1.2

 

 


jakarta.servlet.jsp.jstl-api-3.0.0.jar
0.04MB
jakarta.servlet.jsp.jstl-3.0.1.jar
3.54MB

tomcat 10.1에서 사용 가능한 태그 라이브러리.

 

vJSTL이 제공하는 태그의 종류

 


§Core 태그의 종류

 

 prefix : 태그이름 지정 http://java.sun.com/jsp/jstl 접두어
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

 

<h3>JSP STANDARD TAG LIBRARY</h3>

<!-- 특정 영역 객체에 속성 값을 추가 -->

<c:set var="varPage" value="page 영역" scope="page"/>

<c:set var="numPage" value="10" scope="page"/> <!-- 정수값으로 등록 -->

<% String id = "id001"; %>

EL : ${varPage} <br/>

<%-- EL : ${varPage + 11} <br/> --%> <!-- 문자열에 다른 데이터 이어서 사용 불가 -->

<!-- 연산을 처리하기 위해서 영역객체에 저장된 data를 숫자 타입으로 변경 -->

EL : ${numPage + 11} <br/>

EL : ${id} <br/><!-- 출력안됨 -->

vo 사용하려면 useBean 사용하면 된다.

기본타입 저장할때만 c:set 사용하기

 

<c:set var="request1" value="request 영역" scope="request" />

<c:set var="session1" value="session 영역" scope="session" />

<c:set var="application1" value="application 영역" scope="application" />

 

request1 : ${request1}<br/>

<c:remove var="request1" scope="request"/>

request1 : ${request1}<br/>

<hr/>

<c:set var="test1" value="<script>alert('경고! 메롱메롱!');</script>"/>

<%-- ${test1} <br/> --%>

<!-- escapeXml="true" default = true -->

<c:out value="${test1}" escapeXml="true"/><!-- 스크립트 실행x 그대로 출력 -->

 

<!-- 출력하려는 data가 존재하지 않으면 default 출력 -->

<c:out value="${test2}" default="test2의 값이 존재하지 않습니다."/><br/>

<c:out value="${test2}" escapeXml="false">

<h3>test2는 존재하지 않습니다.</h3>

</c:out>

 

<jsp:useBean id="member" class="test.MemberVO" scope="page"/>

${member}<br/>

<c:set target="${member}" property="num" value="1" />

<c:set target="${member}" property="id" value="id001" />

<c:set target="${member}" property="pass" value="pw001" />

액션태그 setProperty와 비슷하게 c:set사용가능

 

<c:url var="pageLink" value="/index.jsp"/> <!-- "/":contextPath , var : page영역에다가 지정된 이름으로 저장 -->

pageLink : ${pageLink} : <a href="${pageLink}">index url</a><br/>

페이지 지정 쉽게 해주는 태그(contextPath 생략가능)

<a href="<c:url value='/index.jsp'/>">url index</a>

한 번만 쓰는 경우 간단하게 출력 가능

 

 

<div>

<textarea>

<!-- include와 같은 기능(index로 요청 보내서 응답문자열 출력) / 디렉티브 include는 내부파일만 가능 / import는 외부url도 가능 -->

<c:import url="index.jsp"/>

</textarea>

</div>

<div>

<textarea>

<c:import url="https://www.nate.com"/>

</textarea>

</div>

c:import = include와 같은 기능(index로 요청 보내서 응답문자열 출력)

디렉티브 include는 내부파일만 가능 / c:import는 외부url도 가능 

import 시 파라미터 값 전달 -> <c:param>

 

<c:redirect url="jstlCore2.jsp"/>

== response.sendRedirect("jstlCore2.jsp"); 

 


<h3>CORE TAG CONTROL CONDITION</h3>

<core:set var="myCar" value="SANTAFE"/>

 

<core:if test="${myCar eq 'GV80'}">

<!-- true이면 내부 실행, false이면 그냥 넘어감 -->

내차는 GV80 <br/>

</core:if>

${myCar}<br/>

 

<core:set var="myName" value="김혜정"/>

<core:if test="${myName eq '김혜정'}">

내 이름은 김혜정<br/>

</core:if>

 

<core:set var="grade" value="95"/>

<core:choose>

<core:when test="${grade >= 90}">

A 학점

</core:when>

<core:when test="${grade >= 80}">

B 학점

</core:when>

<core:otherwise><!-- if elseif else 마지막 구문 -->

F학점

</core:otherwise>

</core:choose>


반복문

 

<!-- step:증가값 / 증가만 표현 가능. 감소는 표현 불가 -->

<core:forEach var="i" begin="1" end="100" step="3">

${i} &nbsp;&nbsp;

</core:forEach>

 

<%

int[] nums = {10,9,8,7,6,5,4,3,2,1};

request.setAttribute("nums", nums);

%>

<br/>

<!-- items : 반복해서 꺼내올 값 -->

<core:forEach var="n" items="${nums}">

${n} &nbsp;&nbsp;&nbsp;

</core:forEach>

<br/>

<!-- 잘라내서 사용하기 -->

<core:set var="datas" value="김민준,김서영,김진우,김판길,박준우,이인,이진형,이봉수,김선국,이수석,김혜정,이윤서"/>

<core:forTokens var="name" items="${datas}" delims=",">

${name} &nbsp;

</core:forTokens>

<jsp:useBean id="dogList" type="java.util.List<String>" class="java.util.ArrayList" scope="request"/>

<core:set var="a" value="${dogList.add('리트리버')}"/>

<core:set var="a" value="${dogList.add('시베리안 허스키')}"/>

<core:set var="a" value="${dogList.add('치와와')}"/>

<core:set var="a" value="${dogList.add('푸들')}"/>

<core:set var="a" value="${dogList.add('시고르자브르종')}"/>

<core:set var="a" value="${dogList.add('샤모에드')}"/>

<br/>

<core:choose>

<core:when test="${!empty dogList}">

<core:forEach var="dog" items="${dogList}">

${dog} &nbsp;

<core:if test="${dog eq '시고르자브르종'}">

우리집 강아지 &nbsp;

</core:if>

</core:forEach>

</core:when>

<core:otherwise>

목록이 존재하지 않습니다.

</core:otherwise>

</core:choose>

choose 태그 안에는 when, otherwise만 사용이 가능하다.

 


vJSTL fmt 태그의 종류
 
 

다국어 지원 처리 - bundle

 

위에는 사용자가 데이터 입력하는 페이지

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

pageEncoding="UTF-8"%>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>jstlFMT.jsp</title>

</head>

<body>

<form action="jstlFmtTest.jsp" method="POST">

<input type="text" name="addr"/>

<select name="encode">

<option value="ko_KR">한국어</option>

<option value="en_US">English</option>

</select>

<br/>

<input type="date" name="selectDate" pattern="yyyy-MM-dd"/>

<button>확인</button>

</form>

</body>

</html>

 

! bundle_en.properties

name=KimSeoYeong

addr=busan {0} {1}

addr_default=70, gwangnamro suyounggu busan

phone=01094867166

# bundle_ko.properties

name=\uAE40\uC11C\uC601

addr=\uBD80\uC0B0 {0} {1}

addr_default=\uBD80\uC0B0 \uC218\uC601\uAD6C \uAD11\uB0A8\uB85C 70

phone=01058049914

 

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

pageEncoding="UTF-8"%>

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

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

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

<%--

<%

request.setCharacterEncoding("UTF-8");

%>

--%>

<f:requestEncoding value="UTF-8"/>

<c:out value="${param.addr}"/> <br/>

<c:out value="${param.encode}"/> <br/>

<c:out value="${param.selectDate}"/> <br/>

 

<h3>다국어 처리 지원 - bundle</h3>

<!--basename == 접두어 --> <!-- 어디에서 properties 파일 찾아야하는지 경로 알려줌-->

<f:bundle basename="bundle">

<f:message key="name"/>

<f:message key="name_en"/>

</f:bundle>

 

<c:if test="${!empty param.encode}">

<c:set var="encode" value="${param.encode}"/>

</c:if>

<br/>

<%= response.getLocale() %> <Br/>

<f:setLocale value="${encode}"/>

현재 Locale : <%= response.getLocale() %>

 

<f:bundle basename="prop/bundle"

<f:message var="name" key="name" scope="session"/>

<c:choose>

<c:when test="${!empty param.addr}">

<f:message var="addr" key="addr">

<f:param value="${param.addr}"/><!-- {0} -->

<f:param value="70"/><!-- {1} -->

</f:message>

</f:message>

</c:when>

<c:otherwise>

<f:message var="addr" key="addr_default"/>

</c:otherwise>

</c:choose>

<f:message var="phone" key="phone" />

<!-- 변수를 지정하지 않으면 현재 자리에 출력 -->

<hr/>

<f:message key="phone" />

<br/>

</f:bundle>

이름 : ${name} - ${sessionScope.name}<br/>

주소 : ${addr}<br/>

전번 : ${phone}<br/>

<hr/>

 

 

</body>

</html>

 

날짜형식( pattern을 가장 많이 씀. : simpledateformat과 동일)

<h2>날짜 형식 지정</h2>

<jsp:useBean id="now" class="java.util.Date"/>

java.util.Date : <c:out value="${now}"/>

<br/>

<!--

f:formatDate

type(default : date)

date(날짜) / time(시간) / both(둘다)

 

style

full / long / medium(default) / short

-->

<f:formatDate value="${now}" type="date" dateStyle="full"/><br/>

<f:formatDate value="${now}" type="time" timeStyle="full"/><br/>

<f:formatDate value="${now}" type="both" dateStyle="long" timeStyle="long"/><br/>

<h3>pattern</h3>

<f:formatDate value="${now}" pattern="yyyy-MM-dd E hh:mm:ss"/>

문자열을 날짜 객체로 변환

<!-- 문자열을 날짜 객체로 변환 -->

<h3>parseDate : ${param.selectDate}</h3>

<!-- pattern : 전달되고 있는 패턴 -->

<f:parseDate var="n" value="${param.selectDate}" pattern="yyyy-MM-dd" scope="page"/>

변경된 date : <c:out value="${n}"/><br/>

formatDate :<f:formatDate value="${n}" pattern="yyyy년MM월dd일"/><br/>

<br/>

 


숫자 포맷(패턴 많이 사용함 : decimal format)

<h3>Number Formatter</h3>

<c:set var="price" value="10000000"/>

<!-- type : number(숫자),currency(통화) -->

<f:formatNumber var="numberType" type="number" value="${price}"/>

numberType : ${numberType}<br/>

<!-- 통화 형식 -->

통화형식 : <f:formatNumber type="currency" value="${price}"/><br/>

<f:setLocale value="en_US"/>

달러 : <f:formatNumber type="currency" value="${price}"/><br/>

<f:setLocale value="ko_KR"/>

원화 : <f:formatNumber type="currency" value="${price}"/><br/>

<h3>pattern</h3>

<f:formatNumber value="${price}" pattern="₩0,000.00"/>