jquery로 쿠키 생성/수정/삭제하는 방법

 

 

 

 

우선 쿠키란 무엇인지 간략하게 알아보자

쿠키는 웹 사이트에서 사용자의 컴퓨터에 저장되는 작은 데이터 조각이다. 쿠키는 사용자와 웹 사이트 간의 상호작용을 기록하고 유지하는 데 사용된다.

 

쿠키는 웹 사이트가 클라이언트를 식별하고 상태를 추적하는 데 사용되며 클라이언트가 웹 사이트에 방문하면 서버에서 쿠키를 생성하고, 그 후 클라이언트의 브라우저에 저장된다.

 

클라이언트가 같은 웹 사이트를 방문할 때마다 해당 쿠키가 서버로 전송되어 서버는 클라이언트를 식별하고 상태를 추적할 수 있다.

쿠키에는 이름, 값, 만료일, 도메인 등의 정보가 포함되어 브라우저에 저장된다.

 

 

 

 

 

 

필요한 script 모음

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>

 

 

 

cookie 생성

$.cookie('name', 'value', { expires: 1, path: '/' });

'name' : 쿠키명
'value' : 쿠키값
expires: 유효기간(만료일)을 의미하며 1은 1일을 의미
path: 쿠키를 설정하는 도메인(경로) path를 꼭 설정해주어야 한다.

 

 

 

 

 

cookie 삭제

$.removeCookie('name', {path: '/'});

삭제하려는 쿠키명과 path를 기입하여 명시적으로 쿠키를 삭제해주어야 한다.

 

 

 

 

 

만약, 쿠키의 값을 수정하고 싶다면?

아래와 같이 다른 value 값으로 쿠키를 설정해주게 된다면 쿠키의 값은 수정되지 않고 예상과는 다르게
다른 값을 가진 동일한 쿠키가 생성되게 된다.

$.cookie('name', 'value22', { expires: 1, path: '/' });

 

 

 

 

 

그러니 동일한 쿠키명으로 쿠키의 값을 바꾸고 싶다면?

이미 생성한 쿠키를 삭제해준 후에 다른 값으로 새로 생성해주어야 한다.