상세 컨텐츠

본문 제목

COOKIE 개념

IT 세상

by 이현민 (지후지율아빠) 2008. 5. 29. 16:42

본문

--> http는 비연결지향 프로토콜이므로 상태정보를 유지하지 못한다. 따라서 특정 페이지에서 생성된 값이 다른 페이지로 이동되었을 때도 사용되어야 한다면 해당 값을 별도로 저장해 두었다가 사용해야 된다.


상태 유지
사용자가 웹사이트내의 한페이지에서 다른 페이지로 이동할때 그에 관한 정보를 기억하는 뚯이다
이 정보를 기초로 폼을 작성할때 사용자 등록정보의 몇몇 값을 기본값으로 설정할수도 있고 카운터를 계산할수도 있다
상태 유지 방법
@쿠키에 저장
@ URL 링크에 인코드
@ 숨겨진 폼 변수에 보냄
@다른 프레임의 변수에 저장
@웹서버에 저장


적용
@장바구니 어플리케이션
@사용자 주문 홈페이지
@잦은 방문자에 보너스를 줄때
@배너 교환
@북마크
@게임 : 스코어 기억

-이를 위해 개발된 기술이 Cookie와 Session이다 Cookie 는 해당 정보를 클라이언트측에 보관했다가 필요시에 자바스크립트를 통해 클라이언트 측에서 처리할수도 있다,
-session 해당정보를 서버측에 보관하므로 클라이언트측에서는 처리 할수 없다.
-cookie는 하나의 값만을 저장할 수 있으며 데이터형식은 문자열만 저장할 수 있다, 만약 여러개의 값을 저장하려면 cookie 를 여러개 생성하여 하나씩 저장하거나 모든 값을 하나의 문자열로 합쳐서 저장해야 한다.
-하나의 cookie는 최대 4kb까지의 데이타를 저장할수 있고 하나의 서버의 연관된 쿠키는 한 클라이언트당 
최대 300개 까지 저장할수 있다. 즉, 1.2MB까지 저장가능하다는 뜻이다
- cookie 로 보관된 정보는 읽을 수 있는 권한만 있다면 웹브라우저를 종료했다가 다시 실행해도 확인가능하며 새 웹브라우저를 실행해도 실행 가능하다 -> cookie는 접근 권한을 위해서 경로와 도메인, 만료기간을 가진다
-> 원칙적으로 cookie 는 생성한 페이지에서만 읽을 수 있으나 도메인이나 경로, 만료기간 등의 적절한 변화를 통해 생성한 페이지가 아닌 다른 페이지에서 읽을 수도 있다. _> 사용자의 브라우저에 설정된 기간에 지속시키면 수시로 지울수도 있고 사용자의 등록정보난 방문정보를 저장하고 필요할때 간편하게 꺼내기가 쉽다. -> ie와 nn의 쿠키는 호환되지 않는다. -> 다수의 사용자가 있을시 정보유출의 위험이 있다
* 자바스크립트에서 Cookie를 다룰때는 document,cookie를 이용하며 cookie를 저장하거난 저장된 cookie를 읽는데 모두 사용한다.   --> 단 저장할때와 읽을때 사용하는 문자열 형식은 다르다 쿠키의 실예


쿠키의 구조
--> cookie 는 이름 , 도메인 , 경로., 만료기간, 암호화 여부를 지정하는 다섯부분으로 구성된다.
     name=value, expires=날짜; domain=도메인 ; path=경로; secure
d=new Date((new Date()).getTime() + 60000)

"testCookie=testValue ;expires="+d.toGMTString() +" ;doamin=abc.com;secure"
name
쿠키의 이름, 변수 식별자로 보면된다
value
쿠키의 값, 문자열만 가능
손쉽게 쿠키 추가 (기본만)
function setCookieEZ(name,value){
	document.cookie = name + "=" + escape(value);
}
expires
쿠키의 만료시점 , GMT 문자열
expires 부분이 생략되면 웹브라우저 종료시점이 만료시점이 된다.(즉 만료시점이 없으면 그냥 사라진다)
다음의 코드는 1주일후 쿠키가 만기가 되도록 설정한것이다
var name="foo";
var value="bar";
var oneWeek=7*24*60*60*100;
var expDate=new Date();
expDate.setTime(expDate.getTime() + oneWeek);
document.cookie =name +"="+escape(value) +";expire=" + expDate.toGMTString();

doamin
쿠키의 읽을수 있는 권한을 가진 도메인
path
쿠키를 읽을수 있는 권한을 가진 경로
쿠키를 javascript 디렉과 그 하위 디렉의 페이지에 사용할 수 있도록 한것은
document.cookie = "foo=bar1; path=/javascript/sam";
서버의 모든 사람이 사용하고자 하면
document.cookie = "foo=bar2; path=/";

이러한 쿠키가 한꺼번에 존재한다면
foo=bar3; foo=bar2; foo=bar1
으로 나타낸다
function GetCookie(name) {
   var result = 0;
   var myCookie = " " + document.cookie + ";";
   var searchName = " " + name + "=";
   var nameLength = searchName.length;
   var startOfCookie = myCookie.indexOf(searchName)

   while (startOfCookie != -1) {
	result +=1;
      startOfCookie = myCookie.indexOf(searchName.startOfCookie +nameLength);
   }
   return result;
}
쿠키를 삭제할때는 본래 name과 path가 같아야 된다
secure
HTTPS 를 사용할 경우 쿠키정보를 암호화 할수 있으므로 암호화 여부
쿠키의 이름과 값은 문서 객체의 쿠키 속성에 의해 설정되고 저장된다. 쿠키 문자열을
변수에 저장하기 위해서는 다음과 같은 명령을 사용한다
var myCookie = document.cookie 

웹페이지에 표시하려면
document.write("Raw Cookies;" + document.cookie + "<br>");

또한 다음과 같은 포맷으로 쿠키를 저장한다
name1=value1;name2=value2;bame3=value3

각가의 name=value로 이루어진 쌍들은 세미콜론과 공백으로 구분한며 마지막값에는 세미콜론을 붙이지 않는다
특정 쿸키를 회수할려면 특정한 쿠키를 회수용 자바스크립트 함수
을 사용한다

자바스크립트에서 쿠키를 생성하는 경우 형식에 맞추어 문자열을 만든 다음 document.cookie 에 할당 하면된다. 여러번 수행하면 여러개의 쿠키가 저장된다. 단 name이 동일하면 덮어쓴다

*불필요한 부분은 생략하면되고 생략된 부분은 기본값으로 처리된다. 단 name과 value는 필수 요소이므로 생략 할 수 없다,
*domain 부분이 생략되면 현재 웹문서가 저장된 서버의 도메인이 지정된다, path 부분이 생략되면 현재 페이지의 경로가 사용된다. secure 는 https를 사용하는 경우가 아니라면 무의미하므로 보통은 생략한다. secure라고 기록되어 있으면 HTTPS 에 의해 쿠키정보가 암호화 됨을 의미한다
ex) cook_str = "cookTest =testValue;path/";
  document.cookie = cook_str;
*쿠키를 읽을때는 nullstring이 아니라면 document.cookie를 읽으면 되고 문자열이 저장되어 있다.
현재상태에서 읽을 수있는 모든 쿠키가 읽혀져서 하나의 문자열로 저장되어 있다
ex) "cook1 = value1 ; cook2 = value2"
즉 쓸때는 여러번 으로 저장하지만 읽을 때는 한번에 다 읽는다

cookie의 저장
쿠키의 저장과 읽기 삭제
문자열의 Encoding

*웹브라우저 종류마다 , 운영체제의 종류마다 차이가 있지만 특정 웹브라우저나 운영체제에서는 한글등 2byte로 구성되는 문자에 대한 처리가 제대로 이루어지짖 않을 때가 있다.
이로 인해 쿠키에 저장한 값(문자열)이 영문등 1byte 문자외의 2byte 문자를 포함하는 경우 쿠키를 찾았더라도 2 값이 원형대로 유지되지 않아서 처리결과가 달라질수 있게 된다. 이를 해결하기 위해서 가급적이면 쿠키의 값을 1byte문자만을 사용하는 것이 좋다.
부득이 하게 2byte 문자를 사용해야 한다면 쿠키에 저장하기전에 문자열을 ecoding 한 후에 쿠키에 저장하고 encoding 된 값을 포함하는 쿠키의 경우 읽혀진 값을 decoding 해서 사용하면 된다.

* 문자열을 encoding 하기 위해서는 내장 함수중에서 escape("문자열")함수를 사용하고 Decoding하기위해서는 unescape("encoding된 문자열")내장함수를 사용한다

*
escape("문자열") :

인수로 지정된 문자열을 대상으로 각 문자의 아스키 코드값 또는 유니코드값16진수롤 변환한 후 문자열 형태로 반환
name=%uBC15%20%uC131			___ 형태의 문자열
	% ---> 문자 시작이다
	u	---> 유니코드로 시작된다
	BC15	---> "박"을 유니코드화 한다음 16진수로 표현한 16진수
	%20		--> 공백
*unescape("문자열") :
인수로 지정된 문자열이 escape로 encoding 된 문자열인 경우 원래의 문자열로 변환하여 반환한다
그냥 문자열이면 그대로 문자열을 반환한다

Ie에서 헤드 부분은 자동으로 아스키코드로 변환하여 쓴다

쿠키의 encoding

쿠키의 카운터1 에제

쿠키의 카운터2 예제


쿠키의 login 예제

쿠키의 popup

쇼핑 장바구니

특정한 쿠키를 회수용 자바스크립트 함수

쇼핑 장바구니

소스분석
반응형

관련글 더보기