메뉴 건너뛰기

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를 이용한 스크롤 따라니는 배너를 쉽게 맨들기(scroll follow) file 2019.01.10 1093
118 jQuery Plugin : Slider file 2019.01.10 1113
117 jQuery 기초 (attr()로 두가지 동시에 접근 / 변경) 2019.01.16 1119
116 attr() - style의 특정 속성만 바꾸기 2021.03.26 1125
115 [jQuery] 라디오(radio) 버튼, 체크박스(checkbox) 선택/해제 하는 방법 2019.03.05 1129
114 jQuery 기초 (style.css <link> 로 추가하기 / 버튼 클릭시 데이터 삽입) file 2019.01.16 1181
113 jQuery로 테이블 tr 동적으로 추가,삭제 하기 v2 2019.01.10 1211
112 popModal jQuery Plugin Examples / 무료 jQuery 팝업 플러그인 file 2019.01.16 1235
111 jQuery 기초 (focus, blur, toggle / mouseenter, mouseleave, mousedown, mouseup, hover) 2019.01.16 1268
110 터치 디바이스 분기처리 2018.11.07 1278
109 Hide pager if bxslider has only 1 slide 2018.11.07 1296
108 getElementsByClassName 을 IE8 이하에서 동작하게 하는 코드 2018.11.07 1297
107 Magnific popup conflict with "jquery.nicescroll" file 2018.11.07 1315
106 jQuery 기초 (jQuery 달력 (datepicker)) file 2019.01.16 1321
105 jQuery 로 탭메뉴 보였다 안보였다 맹글기 2019.01.10 1329
104 jQuery 기초 (Postcodify - 도로명주소 우편번호 검색 프로그램 (코딩 예제) (HTML) / POP UP 버젼) file 2019.01.16 1349
103 selectbox multiple 선택한 값들 submit 해서 받기 2021.03.26 1364
102 3D Perspective Carousel with jQuery and CSS3 - CSSSlider 2018.11.07 1388
101 비활성화 된 라디오버튼 클릭 시 경고창 생성 2018.11.07 1396
100 iframe height auto resize 2018.11.07 1403
Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

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

© k2s0o1d4e0s2i1g5n. All Rights Reserved