조회 수 8320 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
자바스크립트 쿠키는 CGI의 HTTP Cookie와 내용 및 작동하는 법은 같으나 약간의 차이가 있습니다.
아래는 자바스크립트 쿠키에 대한 개요입니다.
  1. 자바스크립트에서 지원하는 사용자의 특정 정보를 저장하는 기법
  2. 클라이언트의 브라우저에 저장되나 서버에는 저장되지 않습니다.
  3. 일정 기간 동안만 유효하게 할 수 있고, 유효기간(만료기한)이 설정되지 않을 경우 브라우저 종료시 자동으로 사라집니다.
  4. 클라이언트에는 브라우저가 실행중에는 메모리에, 종료될 경우 만료기한에 따라 cookies.txt라는 파일에 저장될 수 있습니다.
  5. 웹 서버의 환경변수 HTTP_COOKIE에는 저장되지 않습니다.
자바스크립트 쿠키는 서버와는 무관하기 때문에 일반적으로 잘 사용하지는 않습니다.
그러나, 클라이언트 내에서는 얼마든지 쿠키의 정보유지기법을 사용할 수 있으므로 간단한 방문 기록 남기기 등에서는 쓰일 수 있습니다.
자바스크립트에서 쿠키를 참조하기 위해서는 document.cookie객체를 사용합니다.

아래는 가장 일반적으로 사용되는 쿠키 관련 자바스크립트 함수들입니다.
아래 함수의 주요 기능은 document.cookie 객체의 문자열 조작을 통하여 쿠키로부터 값을 빼내는데 사용됩니다. 

# Cookie 함수
// 쿠키 생성 함수
// setCookie('쿠키이름', '쿠키값', 만료일)
// 쿠키이름 : 쿠키이름을 영문으로 넣어주세요.
// 쿠키값 : 쿠키의 값을 문자열로 넣어주세요.
// 만료일 : 쿠키의 만료일을 숫자로 넣어주세요
// 예) 만료일이 1 이면 하루동안 지속되는 쿠키입니다.
// 예) 만료일이 -1 이면 쿠키가 삭제됩니다.
function setCookie = function(cName, cValue, cDay){
    var expire = new Date();
    expire.setDate(expire.getDate() + cDay);
    // 한글 깨짐을 막기위해 escape(cValue)를 함.
    cookies = cName + '=' + escape(cValue) + '; path=/ ';
    if(typeof cDay != 'undefined'){
        cookies += ';expires=' + expire.toGMTString() + ';';
    }
    document.cookie = cookies;
}

// 쿠키 가져오는 함수
// getCookie('쿠키이름')
// 쿠키이름을 넣어 주면 해당 쿠키의 값을 반환.
// 쿠키가 있을때만 반환하며 없으면 공백이 반환.
function getCookie = function(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);
}


// 쿠키 제거함수
// clearCookie("쿠키이름");
clearCookie = function(name){
    document.cookie = name + "= ''";
}


# 샘플
setCookie("site" ,"hooni.net", 365);
var cookies = getCookie("site");


# 만료일 설정
var expireDate = new Date();
expireDate.setTime(expireDate.getTime() + 1000*60*60*24);
SetCookie("site", "hooni.net", expireDate);

※ 위의 예제는 만료일을 쿠키가 생성되는 현재 시간 + 1일로 설정합니다.
만약, 만료일을 쿠키가 생성된 후 1시간으로 설정하겠다면,
위의 예제에서 24(시간)를 1(시간) 로 바꾸어 주면 됩니다.

쿠키는 설정된 후에 브라우저가 활성화 되어 있고 만료일이 경과되지 않는 한 브라우저에 따라 설정된 디렉토리 내의 cookies.txt를 지우더라도 값이 유지된다는 점을 주의하기 바랍니다.

?

List of Articles
번호 분류 제목 글쓴이 날짜 조회 수
649 Develop [js] 사라지는 브라우저 hooni 2003.04.23 6857
648 Develop [js] 빈도우즈(bindows96) file hooni 2013.04.23 7368
647 Develop [js] 비만 지수 측정(BMI) ㅎㅎ file hooni 2013.04.23 7610
646 Develop [js] 부모창에서 자식창으로 문자열 전달.. file hooni 2013.04.23 7450
645 Develop [js] 밀리터리 프로그램(전역일 계산) 7 file hooni 2013.04.23 8910
644 Develop [js] 문자열에서 숫자만 걸러내기 (jQuery 안쓰고 정규표현식) hooni 2017.12.14 1102
643 Develop [js] 모바일웹에서 이미지 저장하는거 (context menu) 막기 hooni 2013.04.23 26360
642 Develop [js] 모바일 스크롤 방지(해제) hooni 2015.04.14 1588
641 Develop [js] 동적(innerHTML)으로 자바스크립트 실행하기.. 2 file hooni 2013.04.23 18199
640 Develop [js] 네이버에서 그림 퍼올 때.. URL Encoding 관련ㅋㅋ hooni 2013.04.23 7214
639 Develop [js] 네이버, 다음의 플레이어 스킨 file hooni 2013.04.23 6942
638 Develop [js] 객체 머지.. hooni 2013.12.17 8963
637 Develop [js] 간단한 게임 프로토타입 (HTML5 와는 무관) hooni 2013.04.23 15152
636 Develop [js] 가운데 새창 뜨는 함수와 이벤트 hooni 2003.04.23 6722
635 Develop [js] window.open() 속성 사용 방법 hooni 2013.11.18 13588
634 Develop [js] URL 파싱하기 (jQuery 안쓰고) hooni 2017.12.14 1306
Board Pagination Prev 1 ... 11 12 13 14 15 ... 53 Next
/ 53