잠시만 기다려 주세요

     '대통령을 욕하는 것은 민주사회에서 주권을 가진 시민의 당연한 권리입니다. 대통령을 욕하는 것으로 주권자가 스트레스를 해소할 수 있다면 저는 기쁜 마음으로 들을 수 있습니다. - 노무현 -'
전체검색 :  
이번주 로또 및 연금번호 발생!!   |  HOME   |  여기는?   |  바다물때표   |  알림 (16)  |  여러가지 팁 (1059)  |  추천 및 재미 (156)  |  자료실 (22)  |  
시사, 이슈, 칼럼, 평론, 비평 (613)  |  끄적거림 (136)  |  문예 창작 (716)  |  바람 따라 (75)  |  시나리오 (760)  |  드라마 대본 (248)  |  
살인!


    javascript/jquery

javascript/jquery - 자바스크립트 쿠키 클래스, cookie class
이 름 : 바다아이   |   조회수 : 7618         짧은 주소 : https://www.bada-ie.com/su/?841591872316
서버측 언어에서 쿠키 핸들링하는 함수들을 제공하지만 개발하다보면 클라이언트에서 자바스크립트로 쿠키를 조작해야하는 경우들이 있다.

자바스크립트로 쿠키를 핸들링하는 함수들은 많이 있지만 쿠키생성할때의 옵션들도 다시 확인해보면서 클래스로 묶고 사용하기 편하게 다시 정리해보았다.

 

■ 자바스크립트 쿠키 클래스

 

 
  1. var Cookie =
  2. {
  3.     cookie_arr : null,
  4.  
  5.     set : function (name,value,options)
  6.     {
  7.         options = options || {};
  8.  
  9.         this.cookie_arr = [escape(name) + '=' + escape(value)];
  10.  
  11.         //-- expires
  12.         if (options.expires)
  13.         {
  14.             if( typeof options.expires === 'object' && options.expires instanceof Date )
  15.             {
  16.                 var date = options.expires;
  17.                 var expires = "expires=" + date.toUTCString();
  18.                 this.cookie_arr.push (expires);
  19.             }
  20.         }
  21.         else if (options.expires_day)
  22.         {
  23.             this.set_expires_date (options.expires_day , 24*60*60);
  24.         }
  25.         else if (options.expires_hour)
  26.         {
  27.             this.set_expires_date (options.expires_hour , 60*60);
  28.         }
  29.  
  30.         //-- domain
  31.         if (options.domain)
  32.         {
  33.             var domain = "domain=" + options.domain;
  34.             this.cookie_arr.push (domain);
  35.         }
  36.  
  37.         //-- path
  38.         if (options.path)
  39.         {
  40.             var path = 'path=' + options.path;
  41.             this.cookie_arr.push (path);
  42.         }
  43.  
  44.         //-- secure
  45.         if( options.secure === true )
  46.         {
  47.             var secure = 'secure';
  48.             this.cookie_arr.push (secure);
  49.         }
  50.  
  51.         document.cookie = this.cookie_arr.join('; ');
  52.         //console.log (this.cookie_arr.join('; '));
  53.     },
  54.  
  55.     get : function (name)
  56.     {
  57.         var nameEQ = escape(name) + "=";
  58.         var ca = document.cookie.split(';');
  59.  
  60.         for(var i=0;i < ca.length;i++)
  61.         {
  62.             var c = ca[i];
  63.             while (c.charAt(0)==' ') c = c.substring(1,c.length);
  64.             if (c.indexOf(nameEQ) == 0) return unescape(c.substring(nameEQ.length,c.length));
  65.         }
  66.         return null;
  67.     },
  68.  
  69.     del : function (name , options)
  70.     {
  71.         options = options || {};
  72.         options.expires_day = -1;
  73.         this.set ( name , '' , options );
  74.     },
  75.  
  76.     set_expires_date : function (expires , time)
  77.     {
  78.         var date = new Date();
  79.         date.setTime(date.getTime()+(expires*time*1000));
  80.         var expires = "expires=" + date.toUTCString();
  81.         this.cookie_arr.push (expires);
  82.     }
  83. };


 

■ 옵션들에 대한 설명

 

 
  1.    옵션              내용           형식                                                                   지정 안했을경우 기본값     설명        
  2. --------------    --------------   ------------------------------------------------------------------    -----------------------    ------------------------------------------------------------------------------------------------
  3. expires           쿠키 만료일       new Date(year, month, day, hours, minutes, seconds, milliseconds)      브라우져 종료시점까지      쿠키 만료일을 정확하게 지정. new Date(2013,8,10,0,0,0) 같이 초까지만 지정하면 된다.
  4. expires_day       쿠키 생존       숫자                                                                   브라우져 종료시점까지      쿠키 만료일을 현재시간으로부터 몇일후로 지정
  5. expires_hour      쿠키 생존 시간    숫자                                                                   브라우져 종료시점까지      쿠키 만료일을 현재시간으로부터 몇시간후로 지정
  6. domain            도메인           www.example.com 또는 sub.example.com 또는 example.com                  현재의 도메인              쿠키가 적용될 도메인으로 example.com 으로 지정시 앞에 모든 서브도메인에서 모두 사용 가능
  7. path              경로             / 또는 /dir                                                            /                          쿠키가 적용될 디렉토리로 /dir 입력시 /dir 시작하는(/direc , /dirpath 등) 모든 디렉토리에 적용
  8. secure            ssl             true 또는 false                                                        false                      true 설정하면 보안을 위해 ssl https 프로토콜일때만 쿠키 생성

  - 모든 옵션은 말 그대로 필요한것이 있을경우 지정하면 되고, 지정 안하면 기본값으로 세팅된다.

  - expires , expires_day , expires_hour 는 경우에 맞게 적당한것으로 한가지를 골라 사용하면 된다. 3개중 2개 이상을 중복해서 사용하면 위 적힌 순서대로 먼저 적은것이 적용되게 된다. 즉 expires 와 expires_day 를 동시에 옵션을 주면 expires 가 적용되고 expires_day는 무시된다.

 

■ 사용 예제

 

  ◎ 쿠키 만들기


    1. 기본옵션으로 쿠키 만들기
      - 브라우저가 종료되면 없어지고, 현재 도메인에서, 모든 디렉토리 (/) 에서 사용가능한 쿠키가 만들어진다.
 

 
  1. Cookie.set ('cookie_name1' , 'cookie_value1');


    2. 모든 옵션
 

 
  1. Cookie.set ('cookie_name2' , 'cookie_value2' , {
  2.     expires : new Date(2013,8,10,0,0,0),
  3.     domain: 'example.com',
  4.     path : '/dir',
  5.     secure : true
  6. });


    3. 만료일 : 일(day)단위
      - 현재시간으로부터 1일동안 사용가능한 쿠키 만들기
      - 위 2번에서 expires 옵션 대신 사용하면 된다.
 

 
  1. Cookie.set ('cookie_name3' , 'cookie_value3' , {
  2.     expires_day : 1
  3. });


    4. 만료일 : 시간(hour)단위
      - 현재시간으로부터 12시간동안 사용가능한 쿠키 만들기
      - 위 2번에서 expires 옵션 대신 사용하면 된다.
 

 
  1. Cookie.set ('cookie_name4' , 'cookie_value4' , {
  2.     expires_hour : 12
  3. });


    5. 특수문자(; 와 =) 처리
      - 쿠키는 document.cookie 에 = 과 ; 을 이용하여 값들을 문자열로 연결하여 저장하고, 값을 가져올때에도 = 과 ; 을 기준으로 잘라서 가져오기때문에 2개 문자를 포함한 특수문자들을 처리해준다.
 

 
  1. Cookie.set ('cookie_name=;=' , ';=cookie_value3=a=;b');
 


  쿠키값 가져오기


    6. 쿠키값 가져오기
 

 
  1. Cookie.get ('cookie_name1');


    7. 5번에서 특수문자가 포함된 이름과 값으로 생성된 쿠키값 확인
 

 
  1. Cookie.get ('cookie_name=;=');

   쿠키 삭제


    8. 1번에서 기본옵션값으로 생성한 쿠키값 삭제
 

 
  1. Cookie.del ('cookie_name1');


    9. 2번에서 옵션값을 정해서 생성한 쿠키값 삭제
      - 만료일을 제외한 모든 옵션을 생성할때와 똑같이 지정해서 삭제해야 함
 

 
  1. Cookie.del ('cookie_name2' , {
  2.     domain: 'example.com',
  3.     path : '/dir',
  4.     secure : true
  5. });


출처 : http://steadypost.net/post/knowhow/id/161/
 
| |





      1 page / 3 page
번 호 카테고리 제 목 이름 조회수
76 javascript/jquery , . 바다아이 7107
75 javascript/jquery , . , 바다아이 5300
74 javascript/jquery javascript , ... 바다아이 7040
현재글 javascript/jquery , cookie class 바다아이 7619
72 javascript/jquery select 3 바다아이 8593
71 javascript/jquery , ... 바다아이 7973
70 javascript/jquery , timezone, , ... moment.js 바다아이 10192
69 javascript/jquery textarea cursor . focus, cursor ... 바다아이 10240
68 javascript/jquery (block) , ... 바다아이 8354
67 javascript/jquery textarea cursor , , focus 바다아이 11501
66 javascript/jquery jquery ajax option .... 바다아이 8631
65 javascript/jquery jquery open api , ajax JSONP cross domain , , error 0 ... sop 바다아이 8397
64 javascript/jquery javascript , , , , () 바다아이 9268
63 javascript/jquery javascript (date ) 바다아이 9424
62 javascript/jquery CSS3 javascript 바다아이 10204
61 javascript/jquery javascript , cookie, , , , , 바다아이 9470
60 javascript/jquery javascript 바다아이 10078
59 javascript/jquery javascript / , , , 바다아이 13298
58 javascript/jquery url , , encode, decode ... 바다아이 8564
57 javascript/jquery javascript ... frame location.href 바다아이 14106
56 javascript/jquery File Upload Progress, .... . 바다아이 9018
55 javascript/jquery javascript, json , json Highlight 바다아이 9163
54 javascript/jquery javascript json , , JSON.stringify, JSON.parse, 바다아이 10477
53 javascript/jquery javascript innerHTML, innerTEXT ... 바다아이 9233
52 javascript/jquery javascript entity , , encode, decode 바다아이 9427
51 javascript/jquery javascript post, get , 바다아이 10729
50 javascript/jquery text copy, , How to copy a TEXT to Clipboard on a Button-Click 바다아이 9527
49 javascript/jquery jquery autocomplete , , . 바다아이 9104
48 javascript/jquery javascript, jquery, , autocomplete 바다아이 10086
47 javascript/jquery substring, substr, indexOf, lastIndexOf (javascript , , ) 바다아이 9352
| |









Copyright ⓒ 2001.12. bada-ie.com. All rights reserved.
이 사이트는 리눅스에서 firefox 기준으로 작성되었습니다. 기타 브라우저에서는 다르게 보일 수 있습니다.
[ Ubuntu + GoLang + PostgreSQL + Mariadb ]
서버위치 : 오라클 클라우드 춘천  실행시간 : 0.05785
to webmaster... gogo sea. gogo sea.