메뉴 건너뛰기

2016.09.21 18:25

jQuery Cookie

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

단축키

Prev이전 문서

Next다음 문서

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

단축키

Prev이전 문서

Next다음 문서

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

쿠키값을 읽고, 쓰고, 삭제할 수 있는 단순하고 가벼운 jQuery plugin 이다.



설치

다운로드한 jquery.cookie.js 파일을 사이트의 /js 디렉토리에 저장했다면 아래와 같이 코드를 넣어준다. 아래 코드는 jQuery library를 소스상에 포함시킨 후에 추가해야 한다.


<script src="/js/jquery.cookie.js"></script>



사용법

$.cookie(the_cookie the_value , 쿠키옵션);

the_cookie : 쿠키

the_value : 쿠키값


1. 세션쿠키 생성

$.cookie('the_cookie', 'the_value');


2. 생성일로부터 7일후에 만료되는 쿠키를 생성

$.cookie('the_cookie', 'the_value', { expires: 7 });


3. 경로가 사이트 루트이고, 생성일로부터 7일후에 만료되는 쿠키 생성

$.cookie('the_cookie', 'the_value', { expires: 7, path: '/' });


4. 쿠키값 읽기

$.cookie('the_cookie');     // 'the_value' 값을 반환한다.

$.cookie('not_existing');    // 선언되지 않은 변수명을 적용하면 undefined 를 반환한다.


5. 모든 쿠키변수의 값을 읽기

모든 값이 json 형태로 반환된다.


$.cookie();    // { 'the_cookie' : 'the_value', ... }


6. 쿠키 삭제

$.removeCookie('the_cookie');    // 쿠키 'the_cookie' 를 삭제한다. 성공하면 true, 실패하면 false 를 반환한다.


$.removeCookie('the_cookie', { path: '/' });    // 동일한 경로를 갖는 쿠키들을 삭제한다.



설정

raw

쿠키값을 쓰거나 읽을때 기본적으로 encodeURIComponent/decodeURIComponent 를 이용해서 엔코딩/디코딩 처리를 한다. 엔코딩/디코딩 없이 쓰거나 읽기를 원하면 raw 속성에 true 를 설정한다.


$.cookie.raw = true;


json

Turn on automatic storage of JSON objects passed as the cookie value. Assumes JSON.stringify and JSON.parse


$.cookie.json = true;



쿠키옵션

expires

쿠키의 유효기간을 정의한다. 이 값을 지정하지 않으면 쿠키는 세션쿠키로 생성된다. 값은 생성 시점의 시간 또는 날짜를 기준으로 일수로 표시한다.


expires : 365


path

쿠키의 경로를 정의한다. 기본값은 쿠키를 생성한 페이지의 경로값이 된다.

If you want to make it available for instance across the entire domain use path: '/'.


domain

쿠키가 유효한 도메인을 지정한다. 기본값은 쿠키가 생성된 페이지의 도메인이다.


domain : 'example.com'


secure

이 값이 true 이면, 쿠키값을 전달하기 위해서 https 를 요구한다. 기본값은 false 이다.



변환

1. 쿠키값을 숫자로 반환하기 위한 예제

$.cookie('foo', '42');

$.cookie('foo', Number);    //반환되는 값은 숫자 42 가 된다.


2. escape()를 이용해서 엔코딩 된 쿠키값을 디코딩하기 위한 예제

$.cookie.raw = true;     // 기본 엔코딩/디코딩을 무시한다.

$.cookie('foo', unescape);    // 쿠키 foo 값을 반환할때 unescape() 를 이용해서 디코딩 해서 



사이트 

http://plugins.jquery.com/cookie/


List of Articles
번호 제목 날짜 조회 수
119 검토하기: jQuery를 이용하여 form 처리하기 2017.03.02 7513
118 jquery 이용한 필수입력체크(input form) 2017.03.02 10559
117 jQuery 실행패턴 2017.03.02 6770
116 jQuery 입문: form 데이터 유효성 검사 2017.03.02 11799
115 예제로 만나보는 제이쿼리 - 비동기 파일업로드 file 2017.03.06 7344
114 파일 업로드 방법, 이미지 파일 업로드 예제 소스 2017.03.06 9028
113 Ajax 파일 업로드 샘플 코드 2017.03.11 7791
112 jquery를 활용한 입력폼 초기화하기 2017.03.27 8703
111 jquery css div, li 리스트 선택한 메뉴 변경 출처: http://okkks.tistory.com/1062 [이건없지] file 2017.07.05 5796
110 jquery 체크박스 배열 처리. 변수 하나에 담기. 2018.07.04 4666
109 jQuery 유효성 검사 2018.07.04 3362
108 jQuery selectBox 컨트롤. 2018.07.25 2558
107 jquery - select option 선택값 가져오기 2018.09.06 5330
106 jQuery 폼 입력값 체크 예제 2018.09.06 2098
105 입력폼에 입력되는 값의 유효성 체크하기 두번째 file 2018.09.06 1835
104 페이지 이동 제어 - href, replace, pushState() 2018.09.06 2620
103 외부 파일 드래그 드롭 구현 file 2018.09.06 1678
102 드래그 & 드랍 구현 - on()[이벤트리스너] file 2018.09.06 2891
101 [jQuery] 확인 창(confirm), 페이지 이동(location.replace) 2018.09.06 2652
100 [jQuery] input 박스에 maxlength 만큼 입력했을 때 자동으로 다음 박스로 이동하기 2018.09.06 1819
Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved