본문 바로가기

IT/JavaScript

[JavaScript] 쿠키(cookie) 생성,보기,삭제 예제 소스


<script language="JavaScript">
<!--
     // 쿠키 생성
     function setCookie(cName, cValue, cDay){
          var expire = new Date();
          expire.setDate(expire.getDate() + cDay);
          cookies = cName + '=' + escape(cValue) + '; path=/ ';
          if(typeof cDay != 'undefined') cookies += ';expires=' + expire.toGMTString() + ';';
          document.cookie = cookies;
     }

     // 쿠키 가져오기
     function getCookie(cName) {
          cName = cName + '=';
          var cookieData = document.cookie;
          var start = cookieData.indexOf(cName);
          var cValue = '';
          if(start != -1){
               start += cName.length;
               var end = cookieData.indexOf(';', start);
               if(end == -1)end = cookieData.length;
               cValue = cookieData.substring(start, end);
          }
          return unescape(cValue);
     }
//-->
</script>

쿠키 생성 버튼을 누른 후 쿠키 보기를 눌러 보세요.<br>
쿠키 삭제 버튼을 누른 후 쿠키 보기도 눌러 보세요.<br>
<br>
쿠키 생성 버튼을 누른 후 이 페이지를 닫고 다시 들어와서 쿠키 보기를 눌러보세요.<br>
<br>

<input type="button" value="쿠키 생성" onclick="setCookie('test', 'cookie test, 쿠키 테스트', 1)">
<input type="button" value="쿠키 보기" onclick="alert(getCookie('test'))">
<input type="button" value="쿠키 삭제" onclick="setCookie('test', '', -1)">

----실제 화면---
쿠키 생성을 누르고 쿠키 보기를 누른 화면


이렇게 JavaScript에서 생성된 쿠키는
Dim a
 a = Request.cookies("test") 같은 형식으로 asp 변수로 사용 가능하다.


출처 : http://www.superkts.pe.kr/helper/list.php

/*
쿠키생성
*/
function setCookie( name, value, expiredays ) {
 var todayDate = new Date();
 if (expiredays == null){
  expiredays = 30;
 }
 // 쿠키가 저장될 기간을 설정 하루면 1을 입력.
 todayDate.setDate( todayDate.getDate() + expiredays );
 document.cookie = name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"
}

/*
쿠키호출
*/
function getCookie( name ){
 var nameOfCookie = name + "=";
 var x = 0;
 while ( x <= document.cookie.length ){
  var y = (x+nameOfCookie.length);
  if ( document.cookie.substring( x, y ) == nameOfCookie ) {
  if ( (endOfCookie=document.cookie.indexOf( ";", y )) == -1 )
  endOfCookie = document.cookie.length;
  return unescape( document.cookie.substring( y, endOfCookie ) );
 }
 x = document.cookie.indexOf( " ", x ) + 1;
 if ( x == 0 )
 break;
 }
 return "";
}

위처럼 함수를 선언해 준 후
쿠키 생성시
setCookie("함수명","함수내용","저장일수");
쿠키 호출히
getCookie("함수명");
으로 사용한다.

출처 : http://blog.nemobynemo.com


<script>

//쿠키값 설정하기
function setCookie( name, value, expiredays ) {
 var todayDate = new Date();
 todayDate.setDate( todayDate.getDate() + expiredays );
 document.cookie = name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"
}

//쿠키값 가져오기
function getCookie( name ) {
 var nameOfCookie = name + "=";
 var x = 0;
 while ( x <= document.cookie.length ){
  var y = (x + nameOfCookie.length );
  if ( document.cookie.substring( x, y ) == nameOfCookie ) {
   if( ( endOfCookie = document.cookie.indexOf(";", y)) == -1 )
    endOfCookie = document.cookie.length;
   return unescape( document.cookie.substring( y, endOfCookie ) );
  }
  x = document.cookie.indexOf( " ", x ) + 1;
  if ( x == 0 )
   break;
 }
 return "";
}

//쿠키값 지우기
function deleteCookie( name, domain ){
 var todayDate = new Date();
 todayDate.setDate( todayDate.getDate() - 1 );
 document.cookie = name + "=; domain=" + domain + "; path=/; expires=" + todayDate.toGMTString() + ";";
}

//쿠키 확인 후 팝업창
if ( getCookie( "PopUp_2007721048" ) != "done" ) {
 PopUp_Win = window.open("PopUp/PopUp_2007721048.htm", "PopUp", "toolbar = no, location = no, directories = no, status = no, PopUp_Win.opener = self;
}

//오늘 하루만 열기
function Chk_Win(){
 if ( document.frm.todayChk.checked ) setCookie("PopUp_2007721048", "done", 1);
}
</script>

출처 : http://wishkjh.blog.me


사용자 아이디나 팝업창 열지 않기 등 쿠키를 사용해야할 경우 다음처럼 사용하면 된다.

일단 다음 두 function을 담아간다.

 /**
 * set cook!e (make)

 */
function setCookie( name, value, expiredays ){
    var todayDate = new Date();
    todayDate.setDate( todayDate.getDate() + expiredays );
     document.cook!e = name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"
}

/**
 * get cook!e value
 */
function getCookie(name) {
    var Found = false
    var start, end
    var i = 0
    
    while(i <=  document.cook!e.length) {
        start = i;
        end = start + name.length;
    
        if( document.cook!e.substring(start, end) == name) {
            Found = true;
            break;
        }
        i++;
    }
    
    if(Found == true) {
        start = end + 1;
        end =  document.cook!e.indexOf(";", start);
        if(end < start) end =  document.cook!e.length;
        return  document.cook!e.substring(start, end);
    }
    return ""
}

 쿠키생성하기: setCookie("cook!e_name", "value", days); 

            예제: setCookie("test_user", "test", 1)

            설명: test_user라는 쿠키명으로 test라는 값을 1일 동안 보관한다. (유효일: 1일)

 

쿠키읽어오기: getCookie("cook!e_name")

            예제: getCookie("test_user")

            설명: test_user라고 이름지어진 쿠키의 값을 읽어온다.

 

 쿠키 생성하고 읽어오기:

 

로그인시:

function login(){

    //로그인 처리

 

    //로그인 성공 시 cook!e 작성

    setCookie("user_id", "test_user_id", 100);

}

  

로그인화면 로드 시:

function setUserIdFromCookie(){

    formname.user_id.value = getCookie("user_id");

}

출처 : http://blog.paran.com/yisupark