javascript cookie 사용하기

 

javascript 로 cookie 를 사용하는 방법이다.

 

기본적으로 document 에서 cookie를 제공하는데 이를 더욱 간편하게 사용하기 위해서는 자주사용하는 기능들을 미리 만들어 두면 편하다.

 

본 포스팅에서는 cookie를 저장, 조회, 삭제하는 함수를 만들어 두고 사용하는 방법에 대해서 알아본다.

 

 

 

cookie 저장

1
2
3
4
5
    var setCookie = function(name, value, day) {
        var date = new Date();
        date.setTime(date.getTime() + day * 60 * 60 * 24 * 1000);
        document.cookie = name + '=' + value + ';expires=' + date.toUTCString() + ';path=/';
    };
cs

1# : 저장 함수, cookie 명, cookie 값, 기간을 파라미터로 받는다.

2# : Date 객체 생성

3# : 파라미터로 받은 day(기간)을 date 객체에 담는다. 1/1000 초 임으로 60*60*24*1000 으로 1일을 만든다.

4# : cookie를 셋팅한다.

 



 

cookie 조회

1
2
3
4
    var getCookie = function(name) {
        var value = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');
        return value? value[2] : null;
    };
cs

1# : 조회 함수, cookie 명을 파라미터로 받는다.

2# : 해당하는 이름을 가진 cookie를 조회한다.

3# : 조회한 cookie를 반환한다.

 

 

cookie 삭제

1
2
3
4
    var deleteCookie = function(name) {
        var date = new Date();
        document.cookie = name + "= " + "; expires=" + date.toUTCString() + "; path=/";
    }
cs

1# : 삭제 함수, cookie 명을 파라미터로 받는다.

2# : Date 객체 생성

3# : 해당하는 이름을 가진 cookie를 현재 날짜로 수정한다. 현재 날짜가 지나자마자 사라짐으로 삭제된다고 볼 수 있다.

 



 

사용방법

1
2
3
4
    setCookie("test""test1234"1);
    alert(getCookie("test"));
    deleteCookie("test");
    alert(getCookie("test"));
cs

1# : test라는 이름과 test1234라는 값을 가지며 1일동안 유지되는 cookie를 생성

2# : test 라는 이름의 cookie를 조회

3# : test 라는 이름의 cookie를 삭제

4# : test 라는 이름의 cookie를 조회

 

 

tip :

cookie의 날짜를 셋팅할 때 구글링 하다보면 toGMTString() 같은 함수를 사용한다.

해당 함수는 Deprecated 되었고 toUTCString() 함수를 사용하기를 권장한다.

 

 

 

 

 

 

by 개발자 CofS 2018.04.11 17:41