[JQuery] Jquery를 사용해 쿠키 관리(읽기, 생성, 삭제, 생명주기)

◎쿠키를 간단히 설명하자면!

 

▶쿠키는 클라이언트(브라우저) 로컬에 저장되는 키와 값이 들어있는 작은 데이터 파일입니다.

 

▶사용자 인증이 유효한 시간을 명시할 수 있으며, 유효 시간이 정해지면 브라우저가 종료되어도 인증이 유지된다는 특징이 있습니다.

 

쿠키 생성 삭제하기

1. [jQuery] 다운로드 및 설치 방법 를 통해 jquery를 다운 받습니다.
2. 다운로드 받은 js 파일을 페이지에 포함시켜야합니다. jquery 플러그인이므로 jquery는 필수!><

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="./jquery.cookie.js"></script>

 

3. 쿠키 만들기

// 세션 쿠키 생성 - 브라우저를 닫으면 없으집니다.
$.cookie('name', 'value');

// 7일 뒤에 만료되는 쿠키 생성
$.cookie('name', 'value', { expires: 7 });

// 전체 사이트에 대해 7일 뒤에 만료되는 쿠키 생성
$.cookie('name', 'value', { expires: 7, path: '/' });

3 -1 쿠키 초, 분 단위 생성

- 기본 만료일을 지정한 쿠키 생성 -

$.cookie('key', 'value', { expires : 1 }); // 하루

- 분 단위 만료시간을 지정한 쿠키 생성 -

var date = new Date();
date.setTime(date.getTime() + 1*60*1000); // 1분
$.cookie('key', 'value', { expires: date, path : '/' });
//, path : '/'를 붙이면 삭제할 때도 필요해여

- 초 단위 만료시간을 지정한 쿠키 생성 -

var date = new Date();
date.setTime(date.getTime() + 1*1000); // 1초
$.cookie('key', 'value', { expires: date, path : '/' });

4. 쿠키 읽기

// 키로 사용한 이름으로 값을 읽습니다.
// 키로 저장된 값이 없으면 undefined 가 반환됩니다.
$.cookie('name'); // => "value"
$.cookie('nothing'); // => undefined

// 모든 쿠키 읽기
// 모든 쿠키를 { "name": "value" } 형태의 객체로 반환합니다.
$.cookie(); // => { "name": "value" }

 

5. 쿠키 삭제하기

// 성공적으로 삭제되면 true 를 반환하고, 삭제 못했을때는 false를 반환합니다.
$.removeCookie('name'); // => true
$.removeCookie('nothing'); // => false

// 쿠키 삭제시 생성할때 와 같은 path와 domain 을 사용해야 합니다.
// 아래와 같이 생성했다면,
$.cookie('name', 'value', { path: '/' });

// 이렇게 삭제할 수 없습니다.
$.removeCookie('name'); // => false

// 이렇게 삭제해야 합니다.
$.removeCookie('name', { path: '/' }); // => true

 

dullyshin.github.io/2019/09/10/WEB-CookiesMakeDel/

[jQuery] jQuery를 사용해 쿠키관리하기 (읽기, 생성, 삭제, 생명주기)