웹_프론트_백엔드/JAVA프레임윅기반_풀스택

2020.05.20

shine94 2020. 5. 20. 09:06

1. 쿠키 
 : 사용자가 웹사이트를 처음 방문할 때 웹사이트에서 클라이언트의 컴퓨터에 저장해 놓은 작은 파일

 

 

2. 쿠키를 사용하게된 이유

 : http 프로토콜은 웹브라우저에 응답 후에 일정한 시간이 지나면 접속을 끊는 특징이 있다.(서버 오버로딩 방지)  

   끊어진 뒤(일정시간 지난 뒤) 사용자가 접속요청 해도,

   매번 인증작업을 할 번거로움을 피하기 위해,

   쿠키 기술이 등장..!!

 

** 쿠키는 서버에서 생성, 저장은 클라이언트 PC 된다.
** response 객체를 통해 서버에서 클라이언트로 전달, txt 파일 형태로 저장되며

   이때 중요한 점은 서버는 쿠키를 저장안한다는 점...!! 
** 쿠키관리는 웹브라우저가 한다.
** 쿠키의 크기는 4KB로 제한적이다. 
** 보안중요성이 높은 정보는 쿠키보다는 세션을 선호

 

 

3. 쿠키 관련 메소드
setMaxAge() : 쿠키 유효기간을 설정
setPath() : 쿠키사용을 위한 디렉토리를 설정(특정 경로명을 갖는 URL로 전송하도록 설정)
setValue() : 쿠키값을 설정
setVersion() : 쿠키의 버전을 설정
getMaxAge() : 쿠키의 유효기간 정보를 얻어옴
getName() : 쿠키 이름을 얻어옴
getPath() : 쿠키의 유효 디렉토리 정보를 얻어옴
getVersion() : 쿠키의 버전을 얻어옴
getCookies() : 쿠키데이터를 읽어올 때 사용함, 웹브라우저가 보낸 쿠키를 배열로 반환하는 메소드

 

 

4. 쿠키 단점은 보안 취약

 

 

5. 주로 로그인은 세션, 쇼핑몰 장바구니는 쿠키를 활용

 

 

6. 세션
 : 쿠키와 마찬가지로 서버와의 connection 관계를 유지하기 위해서 이용자 정보를 저장하는 객체,

   기존의 쿠키가 클라이언트에 저장되는 반면, 세션은 서버에 저장됨, 
   세션은 서버에서만 접근이 가능, 따라서 쿠키보다 보안성이 뛰어남,
   쿠키의 기본 용량이 4KB, 300개로 제한적인 반면에 세션은 데이터에 대한 제한이 없음,

   WAS에서는 connection이 만들어지는 브라우저 별로 세션객체를 생성해서 관리,   
   세션은 브라우저 별로 생성되며, 각각의 세션은 유니크한 아이디(세션 아이디)로 관리,

   서버에서 발급한 세션아이디는 클라이언트의 쿠키에 저장(no expiry)

 

 

7. 세션 관련 메소드
setAttribute() : 세션의 속성 설정

getAttribute() : 세션에서 데이터를 얻을 때(세션의 속성을 사용할 때)  리턴 타입이 object이다.
getAttributeNames() : 세션에 저장되어 있는 모든 데이터의 이름을 얻어올 때
removeAttribute() : 세션에서 특정 데이터를 제거한다.

invalidate() : 세션의 모든 데이터를 삭제한다.

getId() :  자동생성된 ‘세션 아이디’를 얻어올 때 사용한다.
isNew() : 세션이 최초로 생성되었는지 여부를 알고자 할때 
getMaxInactiveInterval() : 세션의 유효시간을 얻어올 때(세션은 최근에 요청된 시간 기준으로 카운트 됨)

 

 

8. 세션의 유효시간 확인 

 : Server의 web.xml 파일에서 확인 및 설정 가능,

   톰켓 서버에서 세션은 기본 설정이 30분으로 되어 있음,

   Servers > Tomcat v9.0 Server at localhost-config > web.xml

   > 단축키 Ctrl + F 이용, session-time 검색 > session-config의 session-timeout에서 유효 시간 설정 가능

 

 

9. 예외처리
 : JSP에서도 예외(exception)가 발생할 수 있다. 
   [이때!] 예외 상황이 발생하면 웹컨테이너(톰캣)에서는 기본 예외페이지를 제공

** 실제 웹서비스를 제공하면서 준비된 예외페이지로 이동할 수 있도록 하는 것을 예외처리라고 한다.

 

 

10. 예외 처리 방법

방법1. page 지시자를 이용(최고 우선 순위)

** 예외 발생 페이지에서 설정할 코드

    <%@ page errorPage="error.jsp" %>

 

** 예외 처리 페이지에서 설정할 코드

    <%@ page isErrorPage = "true" %>

    <% response.setStatus(200); %>

 

방법2. web.xml 설정을 통해 예외 처리

 

 

11. <%@ page isErrorPage = "true" %>
 : exception 내부객체를 사용하려면 필요, 
   isErrorPage 속성의 디폴트값은 false,
   현재의 페이지가 에러를 처리하는 페이지라는 것을 명시

 

 

12. <% response.setStatus(200); %>

 : 웹 페이지는 response status라는 상태값이 존재,

   상태값을 통해 현재 웹페이지가 정상인지 에러인지를 알 수 있음,

   직접 만든 에러페이지는 에러라고 알려주기 위한 정상적인 페이지인데

   간혹 status가 500인 상태로 설정이 되는 경우가 있음(상태값 500은 서버 내부의 오류)

   [때문에!] response.setStatus(200)을 이용해서 현재 이 페이지는 정상적인 페이지라고 명시해주는 것임

   (200은 에러가없이 정상적으로 전송됬음을 의미)

 

 

13. HTTP response status 코드들

 : https://developer.mozilla.org/ko/docs/Web/HTTP/Status

 

200 : OK, 에러 없이 전송 성공

404 : URL이 존재하지 않을 경우, 요청한 페이지 없음

500 : 서버 내부의 에러(JSP에서 예외가 발생하는 경우)

 

 

14. 자바빈(Bean)

 : 정보의 덩어리,

   데이터 저장소(데이터 객체)
   데이터를 저장하기 위한 필드 + 데이터를 컨트롤하는 getter/setter 메소드를 하나의 쌍으로 가지고 있는 클래스
   getter/setter 메소드는 자바빈의 필드에 데이터를 저장하고 조회하는 작업을 한다

 

 

15. 자바빈 만들기

1) 패키지 선언

 : com.lec.beans.bean클래스명

 

2) 필드 선언

 : private로 필드 선언

 

3) getter/setter 메소드 정의(property 방식)

   [property] private 필드를 외부에서 접근하기 위해서 공개형 접근제어자

                 public 으로 메소드를 정의해 놓고 이를 통해서 간접적으로 필드에 접근하는 방식 

                 필드형태로 기술하고 간접적을 메소드를 호출하는 것

 

 

16. 자바빈 액션 태그
<jsp:useBean> 
<jsp:useBean class="클래스 풀 네임" id="bean이름" scope="범위"/>
  
<jsp:getProperty> : getName() 호출하는 것과 같음 
<jsp:getProperty name="bean이름" property="프로퍼티 이름"/>

<jsp:setProperty>
<jsp:setProperty name="bean이름" property="프로퍼티 이름" value="값"/>

 

 

17. 자바빈(bean)을 생성시 서블릿이 아니라 자바 클래스 생성이 중요!!

 

 

18. 자바빈(bean)의 영역(Scope) : 총 4가지
1) page(기본값) 

 : 현재 페이지의 범위에만 한정, 

   페이지 처리가 끝나면 유효하지 않는다,

   다른 page 넘어가는 순간 bean은 소멸


2) request

 : 요청을 받고 요청처리를 완료하는 시점,

   포워딩(forwarding) 되는 동안 값은 bean은 유지됨

 

   [JSP웹에서 forwarding하는 방법] forward 액션, response.sendRedirect(""), location.href=""

 

3) session 

 : 발행된 세션의 유효시간만큼,

   tomcat servers > web.xml의 timeout에 설정된 타임아웃만큼(기본설정 30분)

 

4) application 

 : 서버에서 웹어플리케이션이 가동되는 동안 bean 의 값이 유지
   서버를 종료 하거나, 해당 웹어플리케이션이 종료하는 경우, bean값 소멸

 

 

19. html의 form name, 자바빈(bean)의 getter/setter name, jsp의 property name

    이 세가지 이름들은 일치 시켜 주어야 한다.

 

[실습코드]

1. JSP10_ActionTag

 : 홈페이지의 메뉴 및 기본 네비게이션 프레임을 짜놓고, 각각의 메뉴 내용별로 분담하여 작업을 분업하기도 한다.

 

** WebContent > layout > demo_full.jsp (전체 페이지 레이아웃 구상)

 : 일단, 작성하고자 하는 페이지의 윤곽을 구조적으로 잡는게 중요

 

   demo_full.jsp를 jsp 액션 태그를 이용해 분업해서 작업한다고 가정해보자

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
  <title>Bootstrap 레이아웃예제</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
  
  <link rel="stylesheet" href="CSS/demostyle.css">
</head>
<body>

<!-- header 시작 -->
<div class="jumbotron text-center" style="margin-bottom:0">
  <h1>Bootstrap 4 사용 레이아웃 예제</h1>
  <p>화면크기를 변경해가며 확인해보기</p> 
</div>
<!-- header 끝 -->

<!-- nav 시작 -->
<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="collapsibleNavbar">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>    
    </ul>
  </div>  
</nav>
<!-- nav 끝 -->

<!-- 반응형 본문 시작 -->
<div class="container" style="margin-top:30px">
  <div class="row">
  
  	<!-- left 사이트 메뉴 시작 -->
    <div class="col-sm-4">
      <h3>Side menu</h3>
      <p>Lorem ipsum dolor sit ame.</p>
      <ul class="nav nav-pills flex-column">
        <li class="nav-item">
          <a class="nav-link active" href="#">page1</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#">page2</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#">page3</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#">page4</a>
        </li>
        <li class="nav-item">
          <a class="nav-link disabled" href="#">Disabled</a>
        </li>
      </ul>
      <hr class="d-sm-none">
    </div>
    <!-- left 사이트 메뉴 끝 -->
    
    <!-- 본문 시작 -->
    <div class="col-sm-8">
      <h2>TITLE : Page1</h2>
      <h5>Title description, Dec 7, 2017</h5>
      <div class="fakeimg">Fake Image</div>
      <p>Some text..</p>
      <p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
    </div>
    <!-- 본문 끝 -->
    
  </div>
</div>
<!-- 반응형 본문 끝 -->

<!-- footer 시작 -->
<div class="jumbotron text-center" style="margin-bottom:0">
  <p>Footer</p>
</div>
<!-- footer 끝 -->

</body>
</html>


** WebContent > layout > CSS > demostyle.css

@charset "UTF-8";
.fakeimg{
	height: 200px;
	background: #aaa;
}

 

** WebContent > layout > page.jsp (파일들 쪼개고 include 합치기)

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	int menu = 1;  // menu parameter 없으면 1 page 디폴트
	String menu_param = request.getParameter("menu");
	if(menu_param != null){
		try{			
			menu = Integer.parseInt(menu_param);
		} catch(NumberFormatException e){
			
		}
	}
	
	// 1 <= menu <= 4
	if(menu > 4) menu = 4;
	if(menu < 1) menu = 1;
%>    
    
<jsp:include page="top.jsp"/>
<jsp:include page="header.jsp"/>
<jsp:include page="nav.jsp"/>

<!-- 반응형 본문 시작 -->
<div class="container" style="margin-top:30px">
	<div class="row">
	<jsp:include page="left.jsp">
		<jsp:param value="<%= menu %>" name="menu"/>
	</jsp:include>
	<% String article_page = "article" + menu + ".jsp"; %>
	<jsp:include page="<%= article_page %>"/>
	</div>
</div>
<!-- 반응형 본문 끝 -->

<jsp:include page="footer.jsp"/>
<jsp:include page="bottom.jsp"/>

 

[include할 파일 만들기] top.jsp, header.jsp, nav.jsp,

                               left.jsp, article1.jsp, article2.jsp, article3.jsp, article4.jsp,

                               footer.jsp, bottom.jsp

** WebContent > layout > top.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<html lang="ko">
<head>
  <title>Bootstrap 레이아웃예제</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
  
  <link rel="stylesheet" href="CSS/demostyle.css">
</head>
<body>


** WebContent > layout > header.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!-- header 시작 -->
<div class="jumbotron text-center" style="margin-bottom:0">
  <h1>Bootstrap 4 사용 레이아웃 예제</h1>
  <p>화면크기를 변경해가며 확인해보기</p> 
</div>
<!-- header 끝 -->

 

** WebContent > layout > nav.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!-- nav 시작 -->
<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="collapsibleNavbar">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>    
    </ul>
  </div>  
</nav>
<!-- nav 끝 -->

 

** WebContent > layout > left.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	int menu = 1;  // menu parameter 없으면 1 page 디폴트
	String menu_param = request.getParameter("menu");
	if(menu_param != null){
		try{			
			menu = Integer.parseInt(menu_param);
		} catch(NumberFormatException e){
			
		}
	}
	
	// 1 <= menu <= 4
	if(menu > 4) menu = 4;
	if(menu < 1) menu = 1;
%>    
    
	<!-- left 사이트 메뉴 시작 -->
    <div class="col-sm-4">
      <h3>Side menu</h3>
      <p>Lorem ipsum dolor sit ame.</p>
      <ul class="nav nav-pills flex-column">
        <li class="nav-item">
          <a class="nav-link <%=(menu == 1)?"active":"" %>" <%=(menu != 1)?"href='page.jsp?menu=1'":""%>>page1</a>
        </li>
        <li class="nav-item">
          <a class="nav-link <%=(menu == 2)?"active":"" %>" <%=(menu != 2)?"href='page.jsp?menu=2'":""%>>page2</a>
        </li>
        <li class="nav-item">
          <a class="nav-link <%=(menu == 3)?"active":"" %>" <%=(menu != 3)?"href='page.jsp?menu=3'":""%>>page3</a>
        </li>
        <li class="nav-item">
          <a class="nav-link <%=(menu == 4)?"active":"" %>" <%=(menu != 4)?"href='page.jsp?menu=4'":""%>>page4</a>
        </li>
        <li class="nav-item">
          <a class="nav-link disabled" href="#">Disabled</a>
        </li>
      </ul>
      <hr class="d-sm-none">
    </div>
    <!-- left 사이트 메뉴 끝 -->

 

** WebContent > layout > article1.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!-- 본문 시작 -->
    <div class="col-sm-8">
      <h2>TITLE : Page1</h2>
      <h5>Title description, Dec 7, 2017</h5>
      <div class="fakeimg">Fake Image</div>
      <p>Some text..</p>
      <p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
    </div>
    <!-- 본문 끝 -->

 

** WebContent > layout > article2.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
	<!-- 본문 시작 -->
    <div class="col-sm-8">
      <h2>TITLE : Page2</h2>
      <h5>Title description, Dec 7, 2017</h5>
      <div class="fakeimg">Fake Image</div>
      <p>Some text..</p>
      <p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
    </div>
    <!-- 본문 끝 -->

 

** WebContent > layout > article3.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
	<!-- 본문 시작 -->
    <div class="col-sm-8">
      <h2>TITLE : Page3</h2>
      <h5>Title description, Dec 7, 2017</h5>
      <div class="fakeimg">Fake Image</div>
      <p>Some text..</p>
      <p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
    </div>
    <!-- 본문 끝 -->

 

** WebContent > layout > article4.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
	<!-- 본문 시작 -->
    <div class="col-sm-8">
      <h2>TITLE : Page4</h2>
      <h5>Title description, Dec 7, 2017</h5>
      <div class="fakeimg">Fake Image</div>
      <p>Some text..</p>
      <p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
    </div>
    <!-- 본문 끝 -->

 

** WebContent > layout > footer.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!-- footer 시작 -->
<div class="jumbotron text-center" style="margin-bottom:0">
  <p>Footer</p>
</div>
<!-- footer 끝 -->


** WebContent > layout > bottom.jsp

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

 

 

2. JSP11_Cookie

** cookieList.jsp 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>cookie 리스트</title>
</head>
<body>
<%
	// 사용자 컴퓨터 안의 쿠키 정보는 request 시에 서버로 전달된다
	// request.getCookes() 로 쿠키 받아온다.
	Cookie[] cookies = request.getCookies();	// Cookie[] 배열 리턴
	
	if(cookies != null) {	// 만약 쿠키가 하나도 없다면 null 리턴
		for(int i = 0; i < cookies.length; i++) {
			String cookieName = cookies[i].getName();	// 쿠키 '이름'
			String cookieValue = cookies[i].getValue();	// 쿠키 '값'
			out.println((i + 1) + "] " + cookieName + " : " + cookieValue + "<br>");
		}
	} else {
		out.println("쿠키가 없습니다.<br>");
	}
%>

<hr>
<form action="cookieCreate.jsp">
	<input type="submit" value="쿠키생성&갱신">
</form>
<br>
<form action="cookieDelete.jsp">
	<input type="submit" value="쿠키삭제">
</form>
</body>
</html>


** cookieCreate.jsp 

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

<!DOCTYPE html>
<%
	String cookieName1 = "num1";
	String cookieValue1 = "" + (int)(Math.random() * 10);
	Cookie cookie1 = new Cookie(cookieName1, cookieValue1);	// 이름-값 으로 쿠키 생성
	cookie1.setMaxAge(2 * 30);	// 쿠키 파기(expiry) 시간 설정(생성 시점으로 부터 2 * 30초 후)
	response.addCookie(cookie1);	// response 에 쿠키 정보 추가
	
	// 쿠키는 얼마든지 생성 가능
	String cookieName2 = "datetime";
	String cookieValue2 = new SimpleDateFormat("yyyyMMddHHmmss").format(new Date());
	Cookie cookie2 = new Cookie(cookieName2, cookieValue2);
	cookie2.setMaxAge(30);
	response.addCookie(cookie2);
%>

<script>
alert('<%= cookieName1%>, <%= cookieName2%> 쿠키 생성');
location.href = "cookieList.jsp";
</script>


** cookieDelete.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	Cookie[] cookies = request.getCookies();
	String cookieName = "num1";
	
	if(cookies != null) {
		for(int i = 0; i < cookies.length; i++) {
			if(cookieName.equals(cookies[i].getName())) {
				cookies[i].setMaxAge(0);	// expiry 를 0으로 하면
				response.addCookie(cookies[i]);	// response 직후 곧바로 삭제됨.
			}
		}
	}
%>

<script>
alert('<%= cookieName%> 쿠키 삭제');
location.href = "cookieList.jsp"
</script>

 

** login.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>login 페이지</title>
</head>
<body>
<%!
	int i = 0;
%>

<%
	Cookie[] cookies = request.getCookies();	// Cookie[] 배열
	String cookieName = "userid";	// 로그인 성공하면 발급되는 쿠키 이름.
	
	if(cookies != null) {
		for(i = 0; i < cookies.length; i++) {
			if(cookieName.equals(cookies[i].getName())) {	// <--
				break;
			} // end if
		} // end for
	} // end if
%>

<% if(cookies == null || i == cookies.length) { %>
		<h2>로그인 상태가 아닙니다.</h2>
		<form action="loginOk.jsp">
			id:<input type="text" name="userid"><br>
			pw:<input type="password" name="pw"><br>
			<input type="submit" value="로그인"><br>
		</form>	
<% } else { %>
		<h2>로그인 상태입니다.</h2>
		<form action="logout.jsp">
			<input type="submit" value="로그아웃"><br>
		</form>
<% } %>
</body>
</html>


** logout

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!-- 처리만 되는 페이지임, 
	  무언가를 보여주는 페이지가 아님, 
	  그렇기 때문에 html 삭제 -->
<%
	String cookieName = "userid";
	String cookieValue = "";
	
	Cookie cookie = new Cookie(cookieName, cookieValue);
	cookie.setMaxAge(0);	// 쿠키 제거!
	response.addCookie(cookie);
%>

<script>
alert('로그 아웃 되었습니다.');
location.href = 'login.jsp';
</script>

 

** loginOk

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!-- 처리만 되는 페이지임, 
	  무언가를 보여주는 페이지가 아님, 
	  그렇기 때문에 html 삭제 -->
<%!
	public static final String ADMIN_ID = "admin";
	public static final String ADMIN_PW = "1234";
%>
<%
	String userid = request.getParameter("userid");
	String pw = request.getParameter("pw");
	
	String cookieName = "userid";
	String cookieValue = userid;
	
	// userid / pw 일치하면 로그인 성공 + 쿠키 생성
	if(ADMIN_ID.equalsIgnoreCase(userid) && ADMIN_PW.equals(pw)) {
		out.println("<script>");
		out.println("alert('로그인 성공')");
		out.println("</script>");
		
		Cookie cookie = new Cookie(cookieName, cookieValue);
		cookie.setMaxAge(2 * 30);
		response.addCookie(cookie);
		
	} else {
		out.println("<script>");
		out.println("alert('로그인 실패')");
		out.println("</script>");
		
		Cookie cookie = new Cookie(cookieName, cookieValue);
		cookie.setMaxAge(0);	// 기존에 있었더라도 삭제한다.
		response.addCookie(cookie);
		
	} // end if
%>

<script>
location.href="login.jsp";
</script>

 

 

3. JS12_Session

** sessionList.jsp

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

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Session List</title>
</head>

<!-- 세션 목록 (이름-값) 리스트  -->
<body>
<%
	if(request.isRequestedSessionIdValid()) {
		out.println("유효한 세션이 있습니다.<hr>");
	} else {
		out.println("유효한 세션이 없습니다.<hr>");
	}

	String sessionName, sessionValue;
	
	// 현재 세션의 모든 name 들 가져오기
	Enumeration<String> enumeration = session.getAttributeNames();   // Enumeration<String> 리턴
	
	int i = 0;
	while(enumeration.hasMoreElements()) {
		
		sessionName = enumeration.nextElement();
		// session.getAttribute(sessionName)	<-- 특정 name의 세션값 추출, name 없으면 null 리턴
		sessionValue = session.getAttribute(sessionName).toString();
		out.println((i + 1) + "] " + sessionName + " : " + sessionValue + "<br>");
		
		i++;
	} // end while
		
	if(i == 0) {
		out.println("세션이 없습니다.<br>");
	}
%>
<hr>
<form action="sessionCreate.jsp">
	<input type="submit" value="세션생성">
</form>

<br>

<form action="sessionDelete.jsp">
	<input type="submit" value="세션삭제">
</form>

<hr>
<%
	String sessionId = session.getId();
	int sessionInterval = session.getMaxInactiveInterval();
	
	out.println("세션 ID: " + sessionId + "<br>");
	out.println("세션 유효시간: " + sessionInterval + "<br>");
%>

<%
	out.println("--- session.invalidate() 후 ---<br>");
	// 세션 무효화 invalidate
	// 기존 세션 테이블 삭제(session id 무효화)
	//	- 그 안의 모든 attribute(이름)도 삭제됨.
	// 새로운 세션테이블 생성
	//session.invalidate();
	
	sessionId = session.getId();
	sessionInterval = session.getMaxInactiveInterval();
	out.println("세션 ID: " + sessionId + "<br>");
	out.println("세션 유효시간: " + sessionInterval + "<br>");
	
%>

</body>
</html>


** sessionCreate.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@page import="java.util.Date"%>
<%@page import="java.text.*"%>

<%
	String sessionName1 = "num1";
	String sessionValue1 = "" + (int)(Math.random() * 10);
	
	// 세션 생성
	session.setAttribute(sessionName1, sessionValue1);
	
	String sessionName2 = "datetime";
	String sessionValue2 = new SimpleDateFormat("yyyyMMddHHmmss").format(new Date());
	
	session.setAttribute(sessionName2, sessionValue2);
%>

<script>
alert('<%= sessionName1 %>, <%= sessionName2 %> 세션 생성');
location.href="sessionList.jsp";
</script>

 
** sessionDelete.jsp

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

	// 세션 삭제
	session.removeAttribute(sessionName);
	session.removeAttribute("datetime");
%>

<script>
alert("<%= sessionName %>, <%= "datetime" %> 세션 삭제");
location.href="sessionList.jsp";
</script>

 

** login.jsp 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.util.Enumeration" %>
    
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>login 페이지</title>
</head>
<body>

<% if(session.getAttribute("userid") == null) { %>
		<h2>로그인 상태가 아닙니다.</h2>
		<form action="loginOk.jsp">
			id:<input type="text" name="userid"><br>
			pw:<input type="password" name="pw"><br>
			<input type="submit" value="로그인"><br>
		</form>	
<% } else { %>
		<h2>로그인 상태입니다.</h2>
		<form action="logout.jsp">
			<input type="submit" value="로그아웃"><br>
		</form>
<% } %>

</body>
</html>


** logout.jsp 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	String sessionName = "userid";
	
	session.removeAttribute(sessionName);
%>

<script>
alert('로그 아웃 되었습니다.');
location.href = 'login.jsp';
</script>

 

** loginOk.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@page import="java.util.Date"%>
<%@page import="java.text.*"%>

<%!
	public static final String ADMIN_ID = "admin";
	public static final String ADMIN_PW = "1234";
%>

<%
	String userid = request.getParameter("userid");
	String pw = request.getParameter("pw");
	
	String sessionName = "userid";
	String sessionValue = userid;

	// userid / pw 일치하면 로그인 성공 + 세션 생성
	if(ADMIN_ID.equalsIgnoreCase(userid) && ADMIN_PW.equals(pw)) {
		out.println("<script>");
		out.println("alert('로그인 성공')");
		out.println("</script>");
		
		session.setAttribute(sessionName, sessionValue);
		
	} else {
		out.println("<script>");
		out.println("alert('로그인 실패')");
		out.println("</script>");
		
		session.removeAttribute(sessionName);
		
	} // end if
%>

<script>
location.href="login.jsp";
</script>

 

 

4. JSP13_Exception
** page1.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%-- 1. page 지시자 태그를 사용한 예외 처리 --%>
<%-- URL은 변동 없음, 내부적으로 포워딩 효과 --%>
<%@ page errorPage="error.jsp" %>

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>예외발생1</title>
</head>
<body>
<%= request.getParameter("id").toUpperCase() %>

</body>
</html>


** error.jsp

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

<!-- 이 페이지는 에러 헨들링을 위한 페이지임을 명시해줘야 함 -->
<%@ page isErrorPage = "true" %>
<!-- 우리가 만든 에러페이지는 에러라고 알려주기 위한 정상적인 페이지,
	  그래서 response.setStatus(200)을 이용해서 
	  현재 이 페이지는 정상적인 페이지라고 알려주는 것임 -->
<%response.setStatus(200);%>

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>에러 안내</title>
</head>
<body>
에러가 발생했습니다....<br>
예외타입은 : <%=exception.getClass().getName()%><br>
예외 메시지는 : <%=exception.getMessage()%>

</body>
</html>

 

** web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd" id="WebApp_ID" version="4.0">
  <display-name>JSP13_Exception</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
  
  <error-page>
  	<error-code>404</error-code>
  	<location>/404error.jsp</location>
  </error-page>
  
  <error-page>
  	<error-code>500</error-code>
  	<location>/500error.jsp</location>
  </error-page>
  
</web-app>

 

** page2.jsp 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<%-- 2. web.xml 을 사용해서 예외처리 --%>

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>예외발생2</title>
</head>
<body>
<% int aa = 555 / 0; %>

</body>
</html>


** page3.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<%-- 2. web.xml 을 사용해서 예외처리 --%>

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Insert title here</title>
</head>
<body>
	<script>
		location.href='300error.jsp';
	</script>

</body>
</html>

 

** 500error.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<% response.setStatus(HttpServletResponse.SC_OK); %>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>500 에러 페이지</title>
</head>
<body>
서비스 사용에 불편을 끼쳐드려 대단히 죄송합니다.
빠른 시간 내에 문제를 해결하겠습니다.
</body>
</html>

 

** 404error.jsp 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<% response.setStatus(HttpServletResponse.SC_OK); %>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>404 에러 페이지</title>
</head>
<body>
요청한 페이지가 존재하지 않습니다.
</body>
</html>

 

 

5. JSP14_JavaBean 

** com.lec.beans.Persion 클래스 

package com.lec.beans;

// Person 빈(bean) 객체 정의
public class Person {
	private String name;
	private int age;
	private int id;
	private String gender;

	// 기본생성자, 매개변수 생성자, getter/setter
	
	public Person() {
		super();
	}
	public Person(String name, int age, int id, String gender) {
		super();
		this.name = name;
		this.age = age;
		this.id = id;
		this.gender = gender;
	}
	
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	
	public int getAge() {
		return age;
	}
	public void setAge(int age) {
		this.age = age;
	}
	
	public int getId() {
		return id;
	}
	public void setId(int id) {
		this.id = id;
	}
	
	public String getGender() {
		return gender;
	}
	public void setGender(String gender) {
		this.gender = gender;
	}
	
	
}

 

** form.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>person form</title>
</head>
<body>
<!-- form element 의 name 값들 중요!  
	Bean 의 필드명과 동일해야 한다!
 -->
<form action="BeanBasic.jsp">
이름: <input type="text" name="name" value="토니 스타크"/><br>
나이: <input type="number" name="age" value="47"/><br>
id: <input type="number" name="id" value="8989"/><br>
성별: <input type="text" name="gender" value="Male"/><br>
<input type="submit"/>
</form>
</body>
</html>


** BeanBasic.jsp 

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

<jsp:useBean id="person1" class="com.lec.beans.Person" scope="page"/>
<%--
	Person person1 = new com.lec.beans.Person();	// 기본 생성자 호출
	request.setAttribute("person1", person1);	// 좀 더 정확히는 이 코드도 수행
--%>

<%-- 기본생성자 생성후 useBean 안에서 setProperty 사용 --%>
<jsp:useBean id="person2" class="com.lec.beans.Person" scope="page">
	<jsp:setProperty name="person2" property="name" value="명기범"/>
	<jsp:setProperty name="person2" property="age" value="26"/>
	<jsp:setProperty name="person2" property="id" value="99887"/>
	<jsp:setProperty name="person2" property="gender" value="남"/>
</jsp:useBean>

<%--
	from에서 넘어온 값을 bean 객체가 바로 받을 수 있다.
	bean의 필드명(getter/setter 명)과 form의 name이 일치해야한다.
--%>
<jsp:useBean id="person3" class="com.lec.beans.Person" scope="page"/>
<jsp:setProperty name="person3" property="name"/>
<jsp:setProperty name="person3" property="age"/>
<jsp:setProperty name="person3" property="id"/>
<jsp:setProperty name="person3" property="gender"/>
<%--
	value 값이 없으면 form의 값을 value로 받아온다...!!
	person3.getGender(request.getParameter("gender"))
--%>

<%-- parameter 를 일괄로 받아오기 --%>
<jsp:useBean id="person4" class="com.lec.beans.Person" scope="page"/>
<jsp:setProperty name="person4" property="*"/>

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>자바빈</title>
</head>
<body>
	<jsp:setProperty name="person1" property="name" value="고길동"/>
	<jsp:setProperty name="person1" property="age" value="24"/>
	<jsp:setProperty name="person1" property="id" value="1515"/>
	<jsp:setProperty name="person1" property="gender" value="남"/>
	<%--
		person1.setName("고길동");
	--%>
	
	<h3>person</h3>
	이름: <jsp:getProperty name="person1" property="name"/><br> 
	나이: <jsp:getProperty name="person1" property="age"/><br> 
	아이디: <jsp:getProperty name="person1" property="id"/><br>
	성별: <jsp:getProperty name="person1" property="gender"/><br> 
	<%--
		<%= person1.getName()%>
	--%>
	
	<h3>person2</h3>
	이름: <jsp:getProperty name="person2" property="name"/><br> 
	나이: <jsp:getProperty name="person2" property="age"/><br> 
	아이디: <jsp:getProperty name="person2" property="id"/><br>
	성별: <jsp:getProperty name="person2" property="gender"/><br> 
	
	<h3>person3</h3>
	이름: <jsp:getProperty name="person3" property="name"/><br> 
	나이: <jsp:getProperty name="person3" property="age"/><br> 
	아이디: <jsp:getProperty name="person3" property="id"/><br>
	성별: <jsp:getProperty name="person3" property="gender"/><br> 
	
	<h3>person4</h3>
	이름: <jsp:getProperty name="person3" property="name"/><br> 
	나이: <jsp:getProperty name="person3" property="age"/><br> 
	아이디: <jsp:getProperty name="person3" property="id"/><br>
	성별: <jsp:getProperty name="person3" property="gender"/><br> 
	
</body>
</html>

 

** com.lec.beans.CountBean 클래스

package com.lec.beans;

public class CountBean {
	private int cntNumber;
	
	public CountBean() {
		System.out.println("CountBean 생성!!");
	}
	
	// 자바빈은 getter, setter 이름이 중요함
	// getter, setter 이름으로 매칭됨
	public void setCount(int n) {
		cntNumber += n;	// 기존의 값에 더해진다.
	}
	
	public int getCount() {
		return cntNumber;
	}

}

 

[page] 현재 페이지의 범위에만 한정, 페이지 처리가 끝나면 유효하지 않는다.

** scope1_page.html

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>page scope</title>
</head>
<body>
	<h3>Page Scope</h3>
	<b>카운트 초기값을 입력하세요...</b>
	<P>----------------------------------</P>
	<form action="scope1_page1.jsp">
	   <!-- 카운터 시작값 -->
		<input type="text" name="count">
		<input type="submit" value="전송"/>
	</form>
</body>
</html>

 
** scope1_page1.jsp 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<jsp:useBean id="cnt" class="com.lec.beans.CountBean" scope="page"/>
<jsp:setProperty name="cnt" property="count"/>
<%-- cnt.setCount(Integer.parseInt(request.getParameter("count"))) --%>

<h3>page1<br>cnt의 getCount 호출</h3>

<jsp:getProperty name="cnt" property="count"/><br>
<%-- cnt.getCount() --%>

<a href="scope1_page2.jsp">page2로...</a>


** scope1_page2.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<jsp:useBean id="cnt" class="com.lec.beans.CountBean" scope="page"/>

<h3>page2<br>cnt의 getCount 호출</h3>

<jsp:getProperty name="cnt" property="count"/><br>
<%-- cnt.getCount() --%>

<a href="scope1_page1.jsp">page1로...</a>

 

[request] 요청을 받고 요청처리를 완료하는 시점, 
             scope2_request1에서 scope2_request2로 새로운 request가 발생, 
             request 생명주기를 종료하지 않고 넘길 수 있는 방법은 forwarding을 이용

** scope2_request.html

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>request scope</title>
</head>
<body>
	<h3>Request Scope</h3>
	<b>카운트 초기값을 입력하세요...</b>
	<P>----------------------------------</P>
	<form action="scope2_request1.jsp">
	   <!-- 카운터 시작값 -->
		<input type="text" name="count">
		<input type="submit" value="전송"/>
	</form>
</body>
</html>

 
** scope2_request1.jsp 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<jsp:useBean id="cnt" class="com.lec.beans.CountBean" scope="request"/>
<jsp:setProperty name="cnt" property="count"/>
<%-- cnt.setCount(Integer.parseInt(request.getParameter("count"))) --%>

<h3>request1<br>cnt의 getCount 호출</h3><br>

<jsp:getProperty name="cnt" property="count"/><br>
<%-- cnt.getCount() --%>

<!-- <a href="scope2_request2.jsp">request2로...</a> -->
<!-- 포워딩되는동안 값이 유지됨 -->
<jsp:forward page="scope2_request2.jsp"/>


** scope2_request2.jsp 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<jsp:useBean id="cnt" class="com.lec.beans.CountBean" scope="request"/>

<h3>request2<br>cnt의 getCount 호출</h3><br>

<jsp:getProperty name="cnt" property="count"/><br>

<a href="scope2_request1.jsp">request1 으로...</a>

 

[session] 설정한 세션의 timeout의 유효시간
** scope3_session.html

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>session scope</title>
</head>
<body>
	<h3>Session Scope</h3>
	<b>카운트 초기값을 입력하세요...</b>
	<P>----------------------------------</P>
	<form action="scope3_session1.jsp">
	   <!-- 카운터 시작값 -->
		<input type="text" name="count">
		<input type="submit" value="전송"/>
	</form>
</body>
</html>


** scope3_session1.jsp 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<jsp:useBean id="cnt" class="com.lec.beans.CountBean" scope="session"/>
<jsp:setProperty name="cnt" property="count"/>

<h3>session1<br>cnt의 getCount 호출</h3>

<jsp:getProperty name="cnt" property="count"/><br>

<a href="scope3_session2.jsp">session2으로...</a>


** scope3_session2.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<jsp:useBean id="cnt" class="com.lec.beans.CountBean" scope="session"/>

<h3>session2<br>cnt의 getCount 호출</h3>

<jsp:getProperty name="cnt" property="count"/><br>

<a href="scope3_session1.jsp">session1으로...</a>

'웹_프론트_백엔드 > JAVA프레임윅기반_풀스택' 카테고리의 다른 글

2020.05.22  (0) 2020.05.22
2020.05.21  (0) 2020.05.21
2020.05.19  (0) 2020.05.19
2020.05.18  (0) 2020.05.18
프론트엔드 웹 페이지 제작하기(5.8 ~ 5.17)  (0) 2020.05.18