오봉이와 함께하는 개발 블로그

Servlet - 세션 트래킹(웹 페이지 사이 정보 공유) Cookie 쿠키 본문

BE/Servlet

Servlet - 세션 트래킹(웹 페이지 사이 정보 공유) Cookie 쿠키

오봉봉이 2021. 12. 29. 18:06
728x90

쿠키와 세션

  • 클라이언트와 서버 간에 정보를 교환하는데 클라이언트 PC 또는 서버의 메모리에 저장해 두고 사용하면 프로그램 속도를 향상시킬 수 있음HTTP 프로토콜
  • 서버-클라이언트 통신 시 stateless 방식으로 통신
  • 브라우저에서 새 웹페이지를 열면 기존의 웹페이나 서블릿에 관한 어떤 연결 정보도 유지 않음
  • 새로 열린 페이지에서 어떤 정보도 알 수 없음
  • 페이지가 서로 독립적이어서 서로의 상태를 알 수 없음
  • 웹 페이지 사이 또는 서블릿 간 상태나 정보를 공유하려면 웹 페이지를 연결시키는 기능 필요
    • 세션 트래킹이라고 함
      • 방법
        1. 쿠키
          • 클라이언트 PC의 Cookie 파일에 정보를 저장한 후 웹 페이지 공유
          • 서버 측에서 클라이언트 측에 상태 정보를 저장하고 추출하기 위한 메커니즘
          • 서버에서 생성하여, 클라이언트 측에 저장됨
          • 서버에 요청할 때마다 쿠키의 속성 값을 참조하거나 변경
          • 크기는 4kb 용량
          • 클라이언트에 300개까지 저장 가능
          • 하나의 도메인 당 20개의 값만 저장
          • 클라이언트에 저장되므로 보안상 문제 발생
            • 따라서 민감한 정보는 쿠키 내에 저장하지 않음
          • 쿠키는 사용자가 거부할 수 있으며 256문자 이하의 text 데이터만 저장됨
          • 생성 및 저장 과정
            • 서버에서 쿠키 생성
              • Cookie cookie = new Cookie(이름, 값); (Cookie 클래스로부터 쿠키 객체 생성)
            • 속성 설정
              • setter 사용해서 쿠키 객체의 유효기간 설정
                • cookie.setMaxAge(유효기간);
            • 클라이언트에 전송되어 자장
              • response 내장 객체의 addCookie() 메소드로 전송
            • 쿠키 관련 주요 메소드
              • setMaxAge() : 유효 기간 설정
              • setValue() : 쿠키 값 설정
              • sevVersion() : 쿠키 버전 설정
              • setPath(0 : 쿠키 사용의 유효 디렉터리 설정
              • getMaxAge() : 유효 기간 반환
              • getName() : 쿠키 이름 반환
              • getValue() : 쿠키 값 반환
              • 쿠키 제거
                • cookie.setMaxAge(0) 으로 설정
              • 클라이언트에 전송되어 변경된 값으로 저장
                • response.addCookie(cookie)
              • 쿠키 유형
                • Persistence 쿠키
                  • setMaxAge(양수) 메소드를 사용해서 양수값으로 지정해서 파일로 저장하면 지속해서 남아있음
                  • 유효 기간 동안 지속됨
                • Session 쿠키
                  • 브라우저가 사용하는 메모리에 생성되는 쿠키로 브라우저가 종료되면 메모리의 Session 쿠키도 자동으로 소멸
                  • setMaxAge(음수) : Session 쿠키로 생성

쿠키 방식 예제 - popUp.html, popUpTest.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>팝업창</title>
</head>
<script>
    function setPopUpStart(obj) {
        if(obj.checked == true) {
            var expireDate = new Date();
            // alert(expireDate); // 오늘 날짜
            var days = 1;
            expireDate.setDate(expireDate.getDate() + days);
            // alert(expireDate); // 내일 날짜
            // 쿠키 값 설정 : 쿠키 이름, 패스, 유효 기간
            document.cookie = "notShowPop=" + "true" + ";path=/;expires=" + expireDate.toGMTString();
            // 팝업창 닫기
            window.close();
        }
    }
</script>
<body>
  알림 팝업창입니다.<br><br><br><br><br><br><br>
<form>
  <input type="checkbox" onclick="setPopUpStart(this)">오늘 더 이상 팝업창 띄우지 않기
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>popUpTest</title>
    <script type="text/javascript">
        // 시작 시 페이지 로드 함수 호출
        window.onload = pageLoad;

        /* 페이지 로드 함수 : 팝업창(popUp.html) 띄우는 함수 */
        function pageLoad(){
            //  쿠키 읽어 오는 함수  getCookieValue() 함수 호출해서 저장된 쿠키 읽어 오기
            var notShowPop = getCookieValue();

            // 읽어 온 쿠키 값이 "true"가 아니면 popUp.html 열기
            if(notShowPop != "true"){
                window.open("popUp.html", "pop", "width=400,height=500, " +
                    "history=no,resizable=no,status=no,scrollbars=yes,menubar=no");
            }
        }
        /* 쿠키 읽어 함수 */
        function getCookieValue(){
            var result = "false";

            // 쿠키 존재 여부 확인 : 쿠키가 존재하면
            if(document.cookie != ""){
                // 구분자를 세미콜론(;)으로 해서 각 값을 배열로 저장
                cookie = document.cookie.split(";");
                for(var i=0; i<cookie.length; i++){
                    //구분자를 =으로 해서 각 값을 배열로 저장
                    element = cookie[i].split("=");
                    value = element[0]; // 쿠키 이름 (배열 첫 번째 요소)
                    //value = value.replace(/^\s*/,'');// 앞 공백 제거 정규식

                    // 쿠키 이름이 notShowPop 이면
                    if(value == "notShowPop") {
                        result = element[1]; //쿠키 값 가져오기 ("true") (배열 두 번째 요소)
                    }
                }
            }
            return result;
        }
        // 쿠키 삭제하는 함수 : 유효 기간을 -1로 설정
        function deleteCookie(){
            document.cookie = "notShowPop=" + "false" + ";path=/;expires=-1";
        }

    </script>
</head>
<body>
<form>
    <input type="button" value="쿠키삭제" onClick="deleteCookie()">
</form>
</body>
</html>
728x90
저작자표시

'BE > Servlet' 카테고리의 다른 글

스프링 MVC 1 - 서블릿  (0) 2022.08.08
Servlet - 세션 트래킹(웹 페이지 사이 정보 공유) Session 세션  (0) 2021.12.29
Servlet - 세션 트래킹(웹 페이지 사이 정보 공유)URL Rewrite  (0) 2021.12.29
Servlet - 세션 트래킹(웹 페이지 사이 정보 공유)<hidden> 태그 사용  (0) 2021.12.29
Servlet - 포워딩  (0) 2021.12.29
'BE/Servlet' Related Articles more
Comments