[Server] TIL no.43 | EL(Expression Language) & 파라미터 & Scope 생명주기 & 라이브러리(2023.09.19)

유은서·2023년 9월 19일
TILserver
0

Server

목록 보기
3/6

1. EL

=> Expression Language

JSP 표현식은 <%= %> 이었는데,
조금 더 간단히 작성할 수 있도록 고안된 언어 (JSP에 내장되어 있음)

화면(HTML)에 출력하고자하는 자바 코드를 ${ key } 형식으로 작성하면 해당 위치에 알맞은 value가 출력됨

EL의 특징

1) get이라는 단어를 사용하지 않음.
=> EL은 자바코드를 얻어와 출력하는 언어
-> 출력 전용 언어(set 불가)
-> get밖에 남지 않으므로 생략

//jsp
테스트 1 (JSP 표현식)  : <%= request.getParameter("test") %>
  <br>
테스트 2 (EL) : ${param.test}

2) null, NullPointerException을 빈칸으로 처리 

//jsp
테스트 1 (JSP 표현식)  : <%= request.getParameter("num") %>
  <br>
테스트 2 (EL) : ${param.num}

🔸 절대경로

=> 최상위 주소[/] 기준으로 작성

◾ webServlet에 작성하는 경로는 무조건 절대경로로! (최상위 부터 시작)

🔹 상대경로

=> 현재 주소(위치)를 기준으로 작성
=> 현재있던 위치의 주소가 바뀜

2. EL 예제

순서 ) index.html -> Controller -> jsp 

// index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JSP 전용 언어/태그/객체</title>
  </head>
  <body>
    <ul>
      <!-- 절대 경로 ( 최상위 주소[/] 기준으로 작성) -->
      <li><a href = "/elTest">EL ( Expression Language)</a></li>
    </ul>

  </body>
</html>

=> a 태그를 이용하여 "/elTest"로 주소 이동하여 jsp 이동

// webServlet에 작성하는 경로는 무조건 절대경로로! (최상위 부터 시작) 
@WebServlet("/elTest")
public class ELTestController extends HttpServlet {
	
	// a태그 요청 ( get 방식 ) 
	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

        // jsp 경로는 webapp 기준
		RequestDispatcher dispatcher = req.getRequestDispatcher("/WEB-INF/views/el/elTest.jsp");
		dispatcher.forward(req, resp);
		
	}
	
	// form 태그 요청 (post 방식)
	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

		
		// POST 방식 -> req 문자 인코딩 부터 변경
		req.setCharacterEncoding("UTF-8");
		
		// 요청 위임
		RequestDispatcher dis = req.getRequestDispatcher("/WEB-INF/views/el/elResult.jsp");
		
		dis.forward(req, resp);

	}
}
<!--jsp -->
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
  <!DOCTYPE html>
  <html>
    <head>
      <meta charset="UTF-8">
      <title>EL 테스트 </title>
    </head>
    <body>
      <h1>EL(Expression Language)</h1>

      <pre>
			JSP의 표현식 <%--  <%= %> --%>
			조금더 간단히 작성할 수 있도록 고안된 언어
			(JSP에 내장되어 있음)

			화면(HTML)에 출력하고자하는 자바 코드를 

			<%-- EL 표현식이기 때문에 이스케이프 문자로 작성해야 화면에 출력됨  --%>
			\${ key } 형식으로 작성하면 해당 위치에 알맞은 value가 출력됨 

		</pre>

		<h3>EL의 특징 1번 : get이라는 단어를 사용하지 않음.</h3>
		<pre>
			EL은 자바 코드를 얻어와 출력하는 언어 
			-> 출력 전용 언어(set 불가)
			-> get밖에 남지 않으므로 생략 
		</pre>

		테스트 1 (JSP 표현식)  : <%= request.getParameter("test") %>
		<br>
		테스트 2 (EL) : ${param.test}


		<hr>

		<h3>EL의 특징 2번 : null, NullPointerException을 빈칸으로 처리 </h3>

		테스트 1 (JSP 표현식)  : <%= request.getParameter("num") %>
		<br>
		테스트 2 (EL) : ${param.num}


		<hr>

		<form action = "/elTest" method ="post">
			이름 : <input name = "inputName">
			<br>
			나이 : <input type = "number" name = "inputAge">
			a<input type = "checkbox" name = "opt" value = "a">
			b<input type = "checkbox" name = "opt" value = "b">
			c<input type = "checkbox" name = "opt" value = "c">

			<button>제출</button>
		</form>


	</body>
</html>

결과창 1

결과창 2

=> post 방식으로 현재 페이지 ("/elTest")로 input 값을 가지고 오기 때문에 다시 controller에서 post 방식을 써줘야 함. (post는 인코딩-> 변수 새로 설정 -> 요청 받은 값 새로운 jsp 생성하여 위임 )

🤍 파라미터

  • ${param.name속성값 } : request 담긴 파라미터 얻어오기 (1개)
  • ${paramValues } : 모든 파라미터를 배열로 얻어오기
  • ${parmaValues.name속성값[인덱스]} : name이 일치하는 파라미터 중 지정된 인덱스번째 value 
<!-- 새로운 jsp -->
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
  <!DOCTYPE html>
  <html>
    <head>
      <meta charset="UTF-8">
      <title>EL 결과</title>
    </head>
    <body>

      <h1>EL을 이용해서 출력하기 </h1>

        이름 : ${param.inputName } <br>
        나이 : ${param.inputAge } <br>


        opt : ${param.opt} <br>
        <%-- 위에 처럼 작성 시, opt의 0번째 인덱스만 출력 --%>

          opt[0] : ${paramValues.opt[0]}<br>
          opt[1] : ${paramValues.opt[1]}<br>
          opt[2] : ${paramValues.opt[2]}<br>

          <%-- 		index= ${paramValue }

               체크 : &{paramValues.opt[index]

               --%>

                  </body>
                </html>

결과창 3

  • 앞 페이지에서 checkbox의 값을 모두 체크 한 경우
  • 앞 페이지에서 checkbox의 값을 모두 체크하지 않은 경우
  • 하나만 선택한 경우

3. 세팅된 속성 확인 예제

위의 Controller.java 중간에 새로운 값들 세팅함.

		//새로운 값을 req에 세팅
		req.setAttribute("address", "서울시 중구 남대문로 120");
		req.setAttribute("score", 100);


		List<String>strList = new ArrayList<String>();
		strList.add("가가가");
		strList.add("나나나");
		strList.add("다다다");
		strList.add("라라라");


		req.setAttribute("strList",  strList);



		Book book = new Book("어린왕자", "생택쥐베리", 4000);


		req.setAttribute("book", book);


		List<String> list1 = null; // null
		List<String> list2 = new ArrayList<String>(); // 비어있음

		req.setAttribute("list1", list1);
		req.setAttribute("list2", list2);

그리고 위의 jsp에 추가

<!-- jsp -->
<h3>세팅된 속성(attribute) 출력하기</h3>

<ul>
  <li>기본 : \${ key } (key는 세팅한 속성의 key값)</li>
  <li>배열 또는 List : \${ key[index] }</li>
  <li>DTO 또는 Map : \${key.필드명}</li>
</ul>

<p>
  address(JSP) : <%= request.getAttribute("address") %> <br>
  address(EL) : ${address} <br>

  score :${score}<br> <%-- 100  --%>
  strList : ${strList} <br>  <%-- [가가가,나나나,다다다,라라라]  --%>
  book : ${book} <br>   <%-- book은 Book객체가 출력됨  --%>


  <br><br>

  strList[0] : ${strList[0] } <br>
  strList[1] : ${strList[1] } <br>
  strList[2] : ${strList[2] } <br>
  strList[3] : ${strList[3] } <br>

  <br><br>

  book의 title : ${ book.title}  <br>
  book의 writer : ${ book.writer}  <br>
  book의 price : ${ book.price}  <br>
  </p>


  <hr>


  <h1>EL은 null, 비어있다를 같은 것으로 생각한다! </h1>


  ${list1} / ${list2}
  <%--아예 없는 값 / 리스트는 생성되었지만, 안에 값이 없음 --%>



    <h4>empty 연산자</h4>

    ${empty list1} / ${empty list2}
    <%-- 둘다 true로 비어있는 값으로 인식함.  --%>

결과창

=> java에서는 다른 의미지만, EL은 null 이나,비어있는 값이나 모두 같다고 생각함

List list1 = null; //
nullList list2 = new ArrayList(); // 비어있음

3. Scope 범위 확인하기

Servlet/JSP에는 종류의 범위를 갖는 내장 객체 존재
=> 각 종류마다 영향을 끼치는 범위가 다름
=> 개발자가 객체를 별도 생성하지 않아도 JSP에서 바로 사용할 수 있는 객체

  1. page : 현재 페이지 ( 한 페이지 )
    => 현재 JSP에서만 사용 가능

  2. request : 요청 받은 페이지와 이를 위임 받은 페이지에서 사용가능

  3. session : 현재 사이트에 접속한 브라우저 당 1개씩 생성
    브라우저가 종료되거나, session 만료될때 까자ㅣ 유효
    (브라우저가 꺼질떄까지)

  4. application : 하나의 웹 애플리케이션마다 1개씩 생성되는 객체
    서버 켜질때 생성되어 종료될 때 없어짐.
    (서버가 꺼질 때까지)

🔹 내장 객체의 우선 순위

-> 생명 주기 범위가 작을수록 우선순위가 높음
page > request > session > application 

  // java
  

  // 서블릿 매핑에 유효하지 않은 url pattern ( "scope") 
  // -> 매핑할 주소 제일 앞에 "/" 반드시 작성
  // -> 쓰지 않으면 에러남.
  @WebServlet("/scope")
  public class ScopeController extends HttpServlet{

  @Override
  protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

  RequestDispatcher dispatcher = req.getRequestDispatcher("/WEB-INF/views/scope/scope.jsp");


  // 1. page scope => JSP에서 확인

  // 2. request scope => 요청받은 페이지  + 위임받은 페이지 
  req.setAttribute("reqValue", "1234");

  // 3. session scope => 브라우저당 1개 
  //					=> 브라우저 종료 또는 session 만료까지 유지 
  // ex) 로그인 여부에서 많이 사용

  // session 객체 얻어오는 방법
  HttpSession session = req.getSession(); // HttpSession 객체 
  session.setAttribute("sessionValue", "999");


  // 4. appliction scope => 서버가 켜져있는 동안 유지 
  // application 객체를 얻어오는 방법
  // -> request, session 객체에서 얻어오기 가능

  ServletContext application = req.getServletContext();
  //			session.getServletContext();

  application.setAttribute("appValue", 10000);

  // ** 모든 scope는 속성을 세팅하고 얻어오는 방법 동일!! **



  // 모든 범위에 같은 key로 속성 세팅 
  req.setAttribute("str", "request 범위에 세팅된 문자열");

  session.setAttribute("str",  "session 범위에 세팅된 문자열");

  application.setAttribute("str",  "application  범위에 세팅된 문자열");




  dispatcher.forward(req, resp);

  }
  }
  <!-- 세번 째 html jsp -->
  <p>해당 값이 없으면 null로  즉, EL 이라서 빈 값 </p>
  <h3> page : ${pageScope.str}</h3>

  <h3> request : ${requestScope.str}</h3>

  <h3> session : ${sessionScope.str}</h3>

  <h3> application : ${applicationScope.str}</h3>

+) 두 번째 페이지에서 우선순위 확인

4. 라이브러리

다운로드

순서는 동일 ) index.html -> controller.java -> main.jsp

JSP에서 자주 사용되거나 공통적으로 사용되는
Java코드 (if, for, 변수 선언, 형변환)를

스크립틀릿 대신 html태그 형식을 태그화하여
표준으로 제공하는 라이브러리
(if, for 간단히 쓰고 싶으면 이거 써라..)

  <!-- main.jsp -->

  <h3>JSTL 라이브러리 등록 방법</h3>

  <ol>
    <li>
      <a href = "https://tomcat.apache.org/download-taglibs.cgi">JSTL 다운로드 페이지 이동</a>
      JSTL 다운로드
    </li>

    <li>
      /webapp/WEB-INF/lib 폴더에 라이브러리 파일(.jar) 추가
    </li>

    <li>
      JSTL 라이브러리를 사용하고자 하는 JSP 파일 상단에 tablib JSP 지시자 태그를 추가
    </li>

  </ol>

  <hr>

  <h1> 1. 변수 선언(c:set 태그)</h1>

  <pre>
			- 변수 선언을 위한 태그

			- c:set에 작성 가능한 속성

			1) var : 변수명(속성 key)
			2) value : 대입할 값 
			3) scope : page, request, session , application 중 하나 지정 
						(기본값 page) 
		</pre>



  <%
     // 스크립틀릿으로 page scope에 속성 세팅하는 방법
     pageContext.setAttribute("num1", 10);

     %>


    <%-- JSTL로  page scope에 속성 세팅하는 방법  --%>
      <c:set var = "num2" value = "20" scope = "page" />

      num1 : ${num1}
      <br>
      num2 : ${num2}




      <hr>

      <h1>2. 변수 제거 (c:remove)</h1>
      <pre>
			- 변수 제거 : 내장 객체에 세팅된 속성을 제거
				( removeAttribute("num1"))
			- c:remove 속성
				1) var : 삭제할 변수명
				2) scope : 내장 객체 범위 (기본값 : 모든 scope)

		</pre>

      <%
         pageContext.removeAttribute("num1");
         %>	

        num1 제거 확인 : ${num1}

        <br>


        <c:remove var = "num2" />

        num2 제거 확인 : ${num2}


        <hr>

        <h1>3. 변수 출력(c:out 태그)</h1>

        <pre>
			\${key}EL 구문 비슷함

			-단, escapeXml = "true" (기본값) 설정 시 
			    html 태그가 해석 X 

			-escapeXml = "false" : html 태그 해석 O 
		</pre>


        <c:set var="temp" value = "<h1>곧 점심시간</h1>" />


        html 태그 해석 X : <c:out value="${temp}"/>		


        <br>

        html 태그 해석 O : <c:out value="${temp}" escapeXml = "false"/>

✨오늘의 프로그래밍 Tip ✨

1) 오늘 진행 수업에서 필요한 거 다운
=> lombok.jar , ojdbc.har, taglib 3개 다운받기

2) 하나의 서버에서 같은 경로의 프로젝트를 동시에 사용하면 오류 생김.

=> 서버 클릭 -> modules에서 사용하지 않은 서버 지워야 함

=> 아니면, 서버를 두 개 생성 하기

3) 표현식을 출력하고자 할 때, 앞에 이스케이프 문자()로 작성해야 출력됨

4) jstl 사용 시, 맨 상단에 

 <%-- JSTL 사용시, 무조건 작성! --%>    
<%@ taglib  prefix = "c" uri = "http://java.sun.com/jsp/jstl/core" %>
profile
유은서
이전 포스트

[Server] TIL no.42 | Server정리 & a태그 이동 & 예제(2023.09.18)

다음 포스트

[Server] TIL no.44 | JSTL 조건문 & 반복문 & (2023.09.20)

0개의 댓글