23.05.09

이준영·2023년 5월 9일
jstl
0

상태유지

값 보관 : HashMap
    pageContext
    
    request - 주로 쓰임
    	model2에서 많이 쓰임
        
    session - 주로 쓰임
    	로그인 검사 
        장바구니 (임시로 저장할 장소) 
        등에서 많이 쓰임
        
        => cookie(session과 비교할 줄 알아야 함)
        
    application
회원관리 흐름(DFD 기능 잘 보기)

===> 벤치마킹

로그인 전

회원가입
		- 아이디 중복 검사
        - 회원가입 인증(SMS / Email)
로그인     
		- 자체 로그인
        		db 검사 후 로그인
                아이디 / 비밀번호 찾기
        - 소셜 로그인
        	구글 / 카카오 ... 등 이용한 로그인

-------------------------로그인 검사 과정------------------------------

로그인 후 (session / cookie 정보 조회)
	로그아웃
    
    회원 정보
    	회원 정보 수정
        비밀번호 변경
        		주기적 변경 유도(90일 뒤 변경하기~~,, 이런 거)
	회원 탈퇴   
    
    
    * 관리자 기능(나중에는 포트 변경으로 보안 강화하기도 함)
    		특정 로그인 아이디 / 비밀번호 (관리자 기능으로 빠짐)



view page 변화

java + html --> EL + jstl + html

EL (Expression Language) : Expression = <%= ( = out.println)
상태 저장소(pageContext,request ...) / 서버 상태(param / header ...) 등으로 정보 가져올 수 있음

jstl - custom tag lib

  1. 라이브러리 필요
  2. 디렉티브 (taglib)

Core

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

<c:set var="to" value="<%=new model1.BoardTO() %>" scope="page" />
<c:set target="${ to }" property="subject" value="제목" />     
<c:set target="${ to }" property="writer" value="작성자" />

그냥 이렇게 실행하면 아무것도 안뜨지만, setter메서드에 println을 주고 실행시켜보면 세터 안의 내용이 호출된다. ( = setter 메서드를 건드림)

위 내용을 출력하려면

제목 : ${ to.subject }<br>
작성자 : ${ to.writer }<br>

하면 된다.



c:if (조건문) : 단순 if

<c:if test="true">

test : true -> 실행 / false -> 실행 x
<c:set var="country" value="korea" scope="page" />
<c:if test="${ country == 'korea' }">

테스트에 var == value를 비교하여 true/false 판단도 가능하다
<c:set var="country" value="korea" scope="page" />
<c:if test="${ country != null }">
	국가명 : <c:out value="${country }" /><br>
</c:if>

null 판단도 가능



c:choose ~ c:when ( = if ~ else if 유사 )

시작<br>

<c:set var="country" value="korea" scope="page" />

<c:choose>
	<c:when test="${country == 'korea' }">
		<c:out value="${country }" />는 춥다<br>
	</c:when>
		<c:when test="${country == 'canada' }">
		<c:out value="${country }" />는 더 춥다<br>
	</c:when>
	<c:otherwise>
		안춥다<br>
	</c:otherwise>
</c:choose>

끝<br>



c:forEach ( 반복문 )

시작<br>

<c:forEach var="i" begin="1" end="10" step="2">  <-- 시작 / 끝  / 증감
	Hello JSTL : ${ i }<br>
	</c:forEach>

끝<br>

중첩 반복문도 가능!

<c:forEach var="i" begin="1" end="3">	
	<c:forEach var="j" begin="1" end="3">	
	${ i }  : ${ j }<br>
	</c:forEach>
</c:forEach>



응용 : jstl로 구구단 만들기

시작<br>

<table border='1' width='800'>	
<c:forEach var="i" begin="0" end="9">	
	<tr>
	<c:forEach var="j" begin="0" end="9">	
	<c:choose>
	<c:when test="${ i == 0 && j == 0 }"><td></td></c:when>
	<c:when test="${ i == 0 }"><td> x  ${ j }</c:when>
	<c:when test="${ j == 0 }"><td>${ i } 단</td></c:when>	
	<c:otherwise><td>${ i } * ${ j } = ${ i * j }</td></c:otherwise> 
	</c:choose>
	</c:forEach>
	<tr>
</c:forEach>
</table>	

끝<br>



다양한 반복문 출력

  1. 반복문으로 배열 출력, item 사용하기
<c:set var="intArr" value="<%=new int[]{1, 2, 3, 4, 5} %>" />
${ intArr[0] }<br>
<br>
<c:forEach var="data" items="${ intArr }">
	<c:out value="${ data }" /><br>
</c:forEach>

  1. 반복문 출력(일반 방식), status를 사용하여 인덱스와 같이 출력 가능
<c:forEach var="data" items="${ intArr }" begin="2" end="4" varStatus="status">
	${ data } / ${status.index }<br>
</c:forEach>

  1. 문자열 형식도 출력 가능
<c:set var="strArr" value='<%=new String[]{"11", "22", "33","44", "55"} %>' />
<c:forEach var="data" items="${strArr }">
	${ data }<br>
</c:forEach>

  1. 객체 형식도 가능
<c:set var="hm1" value="<%=new java.util.HashMap() %>" />
<c:set target="${ hm1 }" property="name" value="홍길동" />
<c:set target="${ hm1 }" property="totay" value="<%=new java.util.Date().toLocaleString() %>" />

<c:forEach var="data" items="${ hm1 }">
	${data.key } - ${data.value}<br>
</c:forEach>



그 밖의 core

StringTokenizer 방식

<body>
<!-- stringtokenizer -->

<c:forTokens var="token" items="1,2,3,4,5" delims=",">
	${token }<br>
</c:forTokens>

---

문자열도 가능

<c:forTokens var="token" items="홍길동, 조길동, 이길동" delims=",">
	${token }<br>
</c:forTokens>


</body>


sendRedirect 방식

해당 주소로 이동

<body>

 <!-- sendRedirect와 똑같음 -->
<%-- <c:redirect url="http://www.daum.net" /> --%>

<c:redirect url="https://search.daum.net/search"> <-- 검색 링크
	<c:param name="w" value="tot" />
	<c:param name="q" value="카타르월드컵" />   <--추가 검색값 줘서 검색 링크도 보여줄 수 있다.
</c:redirect>
</body>


url - 해당 url 주소 화면에 뜸

<c:url var="url1" value="./list.do" />
${url1 }<br>

<c:url var="url2" value="https://search.daum.net/search">
	<c:param name="w" value="tot" />
	<c:param name="q" value="카타르월드컵" />
</c:url>
${url2 }<br>

<c:redirect url="${url2 }" /> <-- 다음의 카타르 검색창으로 이동


다국어는 %~~~ 이렇게 처리가 된다.

url2에는 카타르 월드컵 검색결과 주소창이 저장되고 이것을 redict로 하면 링크이동된다.



c:import

import한 결과를 가져옴

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

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

import로 페이지 원본 소스 같이 가져오기

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

<c:import var="htmlData" url="https://m.daum.net" charEncoding="utf-8"/>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<textarea rows="50" cols="800">
${htmlData }
</textarea>

</body>



주간 차트 (영화 사이트 참고) 소스 가져오기

<c:import var="htmlData" url="http://kobis.or.kr/kobisopenapi/webservice/
rest/boxoffice/searchWeeklyBoxOfficeList.xml?
key=f5eef3421c602c6cb7ea224104795888&
targetDt=20120101" charEncoding="utf-8"/>   
<-- url이 길어서 밑에 결과처럼 나눌 수 있다.(여기선 key / targetDt로 나눈 것)

<c:url var="url" value="http://kobis.or.kr/kobisopenapi/webservice/
rest/boxoffice/searchWeeklyBoxOfficeList.xml">
	<c:param name="key" value="f5eef3421c602c6cb7ea224104795888" /> <-- & 제외
	<c:param name="targetDt" value="20230506" /> <-- 날짜 저번주로 바꾼 것
</c:url>



jstl로 db 연동

  1. sql 처리를 위한 디렉티브 해주기
<%@ taglib prefix="s" uri="http://java.sun.com/jsp/jstl/sql" %>
  1. DataSource 써주기
<s:setDataSource 
	var="ds"
	url="jdbc:mariadb://localhost:3306/sample"
	driver="org.mariadb.jdbc.Driver"
	user="root"
	password="123456"
	scope="page" />
    
${ds}<br>

  1. sql문 사용( select 제외 가능)
1. 일반적인 사용
<s:update 
	var="result" 
	dataSource="${ ds }" 
	sql="insert into dept2 values (10, '개발부', '서울')" />

--------------------------------------------------------------

2. 한줄로 사용

<s:update 
	var="result" 
	dataSource="${ ds }" >
	insert into dept2 values (20, '연구부', '도쿄')
</s:update>

--------------------------------------------------------------

3. preparedStatement 처럼 사용

<s:update 
	var="result" 
	dataSource="${ ds }" >
	insert into dept2 values (?, ?, ?)
	<s:param value="30" />
	<s:param value="생산부" />
	<s:param value="런던" />
</s:update>

--------------------------------------------------------------

4. 변수 먼저 선언 후 집어넣기

<c:set var="deptno" value="50" />
<c:set var="dname" value="홍보부" />
<c:set var="loc" value="인천" />

<s:update 
	var="result" 
	dataSource="${ ds }" >
	insert into dept2 values (?, ?, ?)	
	<s:param value="${deptno }" />
	<s:param value="${dname }" />
	<s:param value="${loc }" />
</s:update>


${ result }<br>

1(처리완료) 보여지고 db가서 확인

delete, update도 가능하다.

delete ex>

<s:update 
	var="result" 
	dataSource="${ ds }" >
	delete from dept2 where loc = ?
	<s:param value="런던" />
</s:update>

update ex>

<s:update 
	var="result" 
	dataSource="${ ds }" >
	update dept2 set dname = ? where deptno = 10;
	<s:param value="연극부" />
</s:update>



jstl로 select문 가져오기

<%@ 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="s" uri="http://java.sun.com/jsp/jstl/sql" %>

<s:setDataSource 
	var="ds"
	url="jdbc:mariadb://localhost:3306/sample"
	driver="org.mariadb.jdbc.Driver"
	user="root"
	password="123456"
	scope="page" />

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<s:query var="rs" dataSource="${ ds }">
	select deptno, dname, loc from dept2 
</s:query>

<table width='600' border='1'>
<tr>
<c:forEach var="columnName" items="${ rs.columnNames }">
	<td>${ columnName }</td>
</c:forEach>
</tr>
<c:forEach var="row" items="${ rs.rows }">
<tr>
	<td>${ row.deptno }</td>  ==> <td>${ row["deptno"] }</td> 이렇게도 가능
	<td>${ row.dname }</td>
	<td>${ row.loc }</td>
</tr>
</c:forEach>
</table>
</body>
</html>

풀링 사용하기

풀링 사용하여 데이터베이스를 간단하게 연동 가능

<s:setDataSource 
	var="ds"
	url="jdbc:mariadb://localhost:3306/sample"
	driver="org.mariadb.jdbc.Driver"
	user="root"
	password="123456"
	scope="page" />
                                ↓↓↓↓

context.xml 생성 후 

<s:setDataSource 
	var="ds"
	dataSource="jdbc/mariadb1"
	scope="page" />

이것보다 더 간결하게 하려면 <s:query에서 dataSourve부분에 직접 넣어주면 된다.

<s:query var="rs" dataSource="jdbc/mariadb1">  <-- 여기에 직접 넣기
	select deptno as 부서번호, dname as 부서이름, loc as 부서위치 from dept2 
</s:query>

실행 결과 모두 동일



응용 : emp에서 s로 시작하는 사원의 이름과 사원번호 출력

<%@ 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="s" uri="http://java.sun.com/jsp/jstl/sql" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<s:query var="rs" dataSource="jdbc/mariadb1">
	select empno, ename, job, sal from emp where ename like ?;
	<s:param value="s%" /> <-- ename이 s로 시작하는 값
</s:query>

<table width='600' border='1'>
<tr>
<c:forEach var="columnName" items="${ rs.columnNames }">
	<td>${ columnName }</td>
</c:forEach>
</tr>
<c:forEach var="row" items="${ rs.rows }">
<tr>
	<%-- <td>${ row.deptno }</td> --%>
	<td>${ row["empno"] }</td>
	<td>${ row.ename }</td>
	<td>${ row.job }</td>
	<td>${ row.sal }</td>
</tr>
</c:forEach>
</table>
</body>
</html>



문자열 함수 jstl로 사용

함수 사용도 디렉티브 사용

<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<body>

<c:set var="str1" value="     Hello JSTL,  Hello JSTL     " />
문자열의 길이 : ${ fn:length(str1) }<br>
문자열 추출 : ${fn:substring(str1, 3, 6) }<br>
여백 제거 전 길이 : ${ fn:length(str1) }<br>
여백 제거 후 길이 : ${ fn:length( fn:trim(str1) ) }<br>
치환 : ${ fn:replace(str1, " ", "-") }<br>
검색 : ${ fn:indexOf(str1, 'JS') }<br>
시작 검색 : ${ fn:startsWith(str1, '') }<br>
끝 검색 : ${ fn:endsWith(str1, 'T') }<br>
대문자로 : ${ fn:toUpperCase(str1) }<br>
소문자로 : ${ fn:toLowerCase(str1) }<br>
</body>



el, jstl만을 이용하여 우편번호 검색기 만들기

<%@ 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="s" uri="http://java.sun.com/jsp/jstl/sql" %>

<%
	request.setCharacterEncoding("utf-8");	
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<form action="zipcodeSearch.jsp" method="post">
동 이름 : <input type="text" name="dong" />
<input type="submit" value="검색" />
</form>
<br><hr><br>


<c:if test="${ !empty(param.dong) }">
<s:query var="rs" dataSource="jdbc/mariadb5" >
	select zipcode, sido, gugun, dong, ri, bunji from zipcode where dong like ?;
	<s:param value='${ param.dong }%'/>
</s:query>

<table width="800" border="1">
<tr>
<c:forEach var="columnName" items="${ rs.columnNames }">
	<td>${columnName }</td>
</c:forEach>	
</tr>
<c:forEach var="row" items="${ rs.rows }">
<tr>
	<td>${row["zipcode"] }</td>
	<td>${row["sido"] }</td>
	<td>${row["gugun"] }</td>
	<td>${row["dong"] }</td>
	<td>${row["ri"] }</td>
	<td>${row["bunji"] }</td>
</tr>	
</c:forEach>
</table>
</c:if>
</body>
</html>



maven

  1. Maven Project
  2. Dynamic Web Project ----변경----> Maven Project (*)

  1. Dynamic Web Project 생성 후 - > configure -> convert maven 으로 메이븐으로 변환

  2. 필요한 API(standard, jstl) 넣어주기 (https://mvnrepository.com/ 여기서 다운 받거나 api 직접 넣어주기)

<dependencies>
		<!-- https://mvnrepository.com/artifact/jstl/jstl -->
		<dependency>
			<groupId>jstl</groupId>
			<artifactId>jstl</artifactId>
			<version>1.2</version>
		</dependency>
		
		<!-- https://mvnrepository.com/artifact/taglibs/standard -->
		<dependency>
			<groupId>taglibs</groupId>
			<artifactId>standard</artifactId>
			<version>1.1.2</version>
		</dependency>

		<!--
		https://mvnrepository.com/artifact/org.mariadb.jdbc/mariadb-java-client -->
		<dependency>
			<groupId>org.mariadb.jdbc</groupId>
			<artifactId>mariadb-java-client</artifactId>
			<version>3.1.4</version>
		</dependency>

	</dependencies>

순서대로 jstl / standard / mariadb API
  1. jstl.jsp 생성하고 아무거나 적고 실행하기 (에러 상관 x)

그 밖에 db 연동해서 하는 작업하려면 그에 맞는 api 넣고 하기!

(mariadb api 넣고 우편번호 검사기 가져옴)

profile
이준영
끄적끄적
이전 포스트

23.05.08

다음 포스트

23.05.10

0개의 댓글