SW/JavaScript

JavaScript, jQuery : cookie.js : 쿠키 작업하는 방법 : 예제, 방법, 구현, 기능

얇은생각 2020. 4. 6. 19:30
반응형

jQuery, cookie.js : 쿠키 작업하는 방법 : 예제, 방법, 구현, 기능

 

자바 스크립트에서 쿠키 작업

쿠키는 방문자 컴퓨터에 저장되는 임시 데이터의 변수입니다. 그들은 일반적으로 로그인 양식에 내 사용자 이름을 기억하는 것과 같은 것들에 사용됩니다. 이는 데이터베이스에 정보를 저장하기 위해 로그인하지 않아도 재 방문자에 대한 정보를 저장하는 유용한 방법입니다. 쿠키는 방문자 컴퓨터에 저장된 파일 일 뿐이므로 보안 정보를 저장하는 데 쿠키를 사용해서는 안됩니다. 이 기사에서는 서버 측과 클라이언트 측 모두에서 쿠키를 설정할 수 있습니다.이 기사에서는 Javascript를 사용하여 클라이언트 측에서 쿠키를 설정하는 프로세스를 살펴 보겠습니다.

 

 

Raw Javascript

Javascript에서 쿠키로 작업하는 것은 Javascript의 최고의 기능이 아니며 쿠키 설정 및 가져 오기를 쉽게 처리 할 수있는 방법이 없습니다.

 

 

All Values

현재 문서에 설정된 쿠키를 모두 얻으려면 다음을 사용해야합니다.

var allCookies = document.cookie;

 

 

Setting Values In Javascript

쿠키를 설정하려면 Javascript 변수 document.cookie를 사용해야합니다. 여기에 값을 추가하려면 데이터를 쿼리 문자열로 설정하고 document.cookie의 끝에 추가해야합니다.

document.cookie = "website=paulund";
// cookie is website=paulund

 

쿠키에 추가 데이터를 추가하려면 위 단계를 반복하면 됩니다.

document.cookie = "secondwebsite=paulund-demo";
// cookie is website=paulund;secondwebsite=paulund-demo;

 

이제 이것은 데이터를 설정하기 쉽지만 쿠키의 쿠키 또는 도메인 만료를 처리하지는 않습니다. 쿠키의 만료를 설정하려면 document.cookie의 끝에 만료를 추가해야합니다.

document.cookie += "; expires="+date.toGMTString();

 

쿠키의 도메인 경로를 설정하려면 document.cookie의 끝에 경로를 설정해야합니다.

document.cookie += "; path=/";

 

이러한 요소를 사용하면 쿠키의 데이터 설정에만 추가 할 수 있으므로 쿠키 설정을 처리하는 기능을 작성해야하기 때문에 처리하기가 어려울 수 있습니다.

function setCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
}

 



Getting Values

보시다시피 document.cookie에 값을 설정하려면 많은 작업이 필요하지만 document.cookie에서 값을 가져 오려면 더 많은 작업이 필요합니다. 특정 값을 얻으려면 데이터의 키를 호출하여 값을 얻을 수는 없습니다. 키의 값을 얻으려면 정규식 검색을 수행하는 함수를 사용해야합니다.

function getCookie(name) 
{
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i 

 

 

자바 스크립트에서 쿠키를 사용하는 더 쉬운 방법

쿠키 데이터를 처리하는 더 쉬운 방법이 있어야합니다. 설정, 가져 오기, 모든 쿠키, 쿠키 제거, 모든 쿠키 비우기, 쿠키가 활성화되어 있는지 테스트하는 다양한 시나리오를 처리하는 고유한 기능을 만들어야합니다. 쿠키를 사용하는 쉬운 방법이 있습니다. cookie.js라는 Github 프로젝트가 있습니다. 이것은 웹 페이지에 포함되어 있으면 쿠키 데이터를 쉽게 처리 할 수있는 간단한 자바 스크립트 파일입니다.

 

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

 

cookie.js를 사용하려면 Github에서 다운로드하여 페이지에 포함시키기 만하면됩니다. Cookie.js 그런 다음 코드를 사용하여 페이지에 포함시킬 수 있습니다.

이 파일이 포함되면 데이터를 설정하고 얻는 데 사용할 수있는 새로운 쿠키 개체가 있습니다. cookie.js로 쿠키를 설정하려면 set () 메소드를 사용하면됩니다.

cookie.set( 'key', 'value' );

 

쿠키에 추가 매개 변수를 추가하려는 경우 메소드의 세 번째 인수로 이를 설정할 수 있습니다.

cookie.set( 'key' , 'value', {
   expires: 7, 
   domain: "paulund.co.uk",
   path: "/",
   secure: false
});

 

 

Getting Cookie

쿠키에서 값을 가져 오려면 get () 메서드를 사용하는 것만큼 쉽습니다. 키 값의 문자열을 반환합니다.

cookie.get( 'key1' );

 

 

또는 간단한 방법으로 간단한 버전을 사용할 수도 있습니다.

cookie( 'key1' );

 

 

Get All Cookies

사용 가능한 모든 쿠키를 얻으려면 all () 메소드를 사용하면 매우 간단합니다.

var allCookies = cookie.all();

 

 

Removing Cookies

remove () 메소드를 사용하여 쿠키에 설정 한 키를 참조하여 쿠키를 쉽게 제거 할 수 있습니다.

cookie.remove( 'key1' );

 

빈 방법을 사용하여 도메인에서 사용 가능한 모든 쿠키를 제거 할 수도 있습니다.

cookie.empty();

 

 

Cookies Enabled

방문자는 브라우저에서 쿠키를 끌 수 있으므로 방문자 컴퓨터에 데이터를 저장할 수 없으므로 새 쿠키를 설정하기 전에 쿠키가 활성화되어 있는지 확인해야합니다. cookie.js를 사용하면 enabled () 메소드를 사용하여 이를 쉽게 수행 할 수 있습니다.

if (cookie.enabled()) {
   // Cookies are on you can setup cookies
} else {
   // Cookies are turned off you can not use cookies
}

 

 

Cookie.js

보시다시피 cookie.js를 사용하는 것은 원시 Javascript를 사용하는 것보다 쿠키 데이터를 처리하는 훨씬 쉬운 방법입니다. Github에서 다운로드하여 다음 프로젝트에서 사용하십시오.

 

반응형