자바스크립트로 쿠키 사용하기

# 자바스크립트로 쿠키 사용하기

로그인 구현시 아이디 저장기능을 구현하기 위해서는 저장소가 필요하다.

값을 저장하기위한 저장소는 DataBase, file, 쿠키등이 있고 jsp를 사용한다면 session영역도 사용 가능하다.

DB와 file은 속도 측면에서 느려지므로 제외한다.

여기서는 쿠키(cookie)를 이용한 방법을 알아 보자.

쿠키는 로컬저장소에 저장되며 서버가 아닌 클라이언트측에 사용하는 저장소이다. 

따라서 용량이 제한적이라 간단한 정보를 저장하는데 사용한다.

예를들면 id, 최근상품목록, 자주 사용하는 메뉴나 인증정보등의 보안정보를 저장하는 용도로 사용한다. 

그리고 쿠키는 생성시 해당 브라우저가 종료되기전까지 남아있다. 

이런 쿠키의 특성을 이용하여 로그인시 브라우저가 종료될때까지 쿠키의 값을 가지고 있으면 된다.

먼저 쿠키의 생성, 삭제, 읽기 등의 기능 만들기 위해서는 아래 기본 코드를 알아야 한다.

# 쿠키 확인

    먼저 쿠키가 있는지 확인한다.

document.cookie

# 쿠키생성

document.cookie = "쿠키명=쿠키값"

ex) document.cookie= "test=1234"

위의 코드를 이용하여 이제 함수를 만들어서 쿠키를 다루면 된다.

# 쿠키 활용 함수

function setCookie(name, value, expires){

    var date = new Date();

    date.setDate(date.getDate() + expires);

    var cookieValue = excape(value) + ((expires == null) ? "" : ";expires=" + date.toGMTString());

    document.cookie = name + "=" + cookieValue;

}

function deleteCookie(name){

    var date = new Date();

    date.setDate(date.getDate() - 1);

    document.cookie = name + "=" +";expires=" + date.toGMTString();

}

function getCookie(name){

    name = name +"=";

    var cookieData = document.cookie;

    var startIdx = cookieData.indexOf(name);

    var value = '';

    if( startIdx != -1 ){

        startIdx += name.length;

        var endIdx = cookieData.indexOf(';', startIdx );

        if( endIdx == -1 ){

            endIdx = cookieData.length;

        } 

       value = cookieData.substring( startIdx , endIdx );

    }

    

    return unescape(value);

}