도메인 기반 쿠키란?
쿠키(cookie)는 기본적으로 쿠키를 설정한 도메인에서만 유효합니다. 하지만 domain 속성을 지정하면 하위 도메인까지 포함한 여러 도메인에서 하나의 쿠키를 공유할 수 있습니다. 도메인 기반 쿠키를 생성하려면 쿠키 문자열에 domain과 path 속성을 함께 설정하면 됩니다.
domain=.example.com;path=/
도메인 앞에 점(.)을 붙이면 example.com뿐만 아니라 www.example.com, blog.example.com 같은 모든 하위 도메인에서 해당 쿠키에 접근할 수 있습니다. 또한 path=/를 지정하면 사이트의 모든 경로에서 쿠키가 유효하게 동작합니다.
예제 코드
아래 예제는 사용자가 이름을 입력하고 버튼을 클릭하면 도메인 기반 쿠키를 설정하는 간단한 HTML 페이지입니다. 직접 실행해 보면서 동작 방식을 확인할 수 있습니다.
<html>
<head>
<script>
<!--
function WriteCookie() {
if( document.myform.customer.value == "" ){
alert("Enter some value!");
return;
}
cookievalue= escape(document.myform.customer.value) + ";";
document.cookie = "name=" + cookievalue + ";
domain=.example.com;path=/";
document.write ("Setting Cookies : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type="text" name="customer"/>
<input type="button" value="Set Cookie" onclick="WriteCookie();"/>
</form>
</body>
</html>
코드 설명
- 입력값 검증:
document.myform.customer.value로 입력 필드의 값을 가져오고, 값이 비어 있으면alert()으로 경고를 표시한 뒤 함수를 종료합니다. - 값 인코딩:
escape()함수를 사용해 특수문자가 포함된 입력값을 안전하게 인코딩합니다. 최신 브라우저에서는encodeURIComponent()사용이 권장됩니다. - 쿠키 설정:
document.cookie속성에name=값형태로 저장할 데이터를 할당하고, 세미콜론(;)으로 구분하여domain=.example.com과path=/옵션을 추가합니다. - 결과 출력:
document.write()를 통해 설정된 쿠키 내용을 화면에 표시합니다.
주의 사항
domain 속성은 현재 접속 중인 도메인 또는 그 상위 도메인에 대해서만 설정할 수 있습니다. 예를 들어 www.example.com에서 실행되는 스크립트는 .example.com에는 쿠키를 설정할 수 있지만, 다른 도메인에는 설정할 수 없습니다. 이는 보안상의 이유로 브라우저가 강제하는 정책입니다.