오리도 지랄하면 날 수 있다!!!!!!

HTML 4.01 supports the ISO 8859-1 (Latin-1) character set.

The lower part of ISO-8859-1 (codes from 0-127) is the original 7-BIT ASCII standard. Most of these characters can be used without a character reference.

The higher part of ISO-8859-1 (codes from 160-255) can all be used using character entity names.

Note that the entity names are case sensitive.

ASCII Entities with new Entity Names

ISO 8859-1 Symbol Entities

ISO 8859-1 Character Entities

Some Other Entities supported by HTML

이 글은 스프링노트에서 작성되었습니다.

쿠키(Cookies) 개념잡기

출처: http://www.emh.co.kr/xhtml/cookies.html

쿠키(Cookies)는 웹 싸이트를 만드는 쪽에서 사용자와 관련된 정보를 사용자의 하드디스크에 저장해 둔 것을 뜻합니다. 여기서 주의할 단어는 '하드디스크'입니다. 사용자의 하드디스크에 작은 텍스트 파일로 저장을 해두기 때문에 사용자가 컴퓨터를 껐다가 켜더라도 언제든지 하드디스크에 저장된 쿠키 파일을 읽어와서 거기에 기록해 놓은 내용을 활용할 수가 있습니다. 그렇다면 왜 다른 곳도 아닌 사용자의 하드디스크에 정보를 저장할까요?

그것은 HTTP 프로토콜이 'stateless' 프로토콜이기 때문입니다. 웹 브라우져가 웹 써버에 접속을 해서 어떤 문서나 파일을 요청하면 웹 써버는 요청 받은 내용을 보내준 다음 접속을 끊습니다. 즉, 접속을 한 '상태(state)'가 지속되지 않고 요청된 것만 처리한 뒤 연결을 끊는 거죠.

그러므로 웹 서버는 일단 요청된 내용들을 클라이언트에 보내고 나면 그 뒤 사용자가 접속을 하고 있는지 어떤지 알 수가 없습니다. 나아가, 예전에 접속했던 클라이언트가 또 접속을 한 것인지 아닌지 등은 더더욱 알 수 없습니다. 그런데 웹 싸이트를 운용하는 측에서는 어떤 사용자가 다시 방문을 했는지와 같은 정보가 절실히 필요했고 바로 이런 점을 해결하기 위해, 즉 stateless한 http의 특징을 커버하기 위해 등장한 아이디어가 쿠키(Cookie)입니다.

쿠키의 아이디어는 간단합니다. 접속한 클라이언트의 하드디스크에 적당한 정보를 저장해 둠으로써 또 그 클라이언트가 접속한 경우 언제든지 하드디스크에 저장된 정보를 읽어 들여서 그 사용자를 인식할 수 있는 것입니다. '상태'에 관한 점검을 언제든지 할 수 있는 것이죠.

쿠키에 저장되는 내용은 천차만별입니다. 간단하게는, 사용자가 어떤 페이지를 읽었고, 로그인 아이디가 뭐고, 이메일 주소가 뭐고 등을 기록할 수도 있고, 사용자가 어떤 물품을 주문했는지, ip 주소가 뭐고, 어떤 싸이트를 거쳐서 우리 싸이트로 왔는지, 또는 서버에서 각 클라이언트를 식별할 특별한 정보를 기록하는 등, 거의 모든 형태의 정보를 저장할 수 있습니다.

사용자 처지에서는 사실 기분나쁠 수 있습니다. 나도 모르게 나의 행동이 하나하나 기록되어 '파일'로 저장되고 있고, 그 파일이 다른 곳도 아닌 '내' 컴퓨터에 나도 모르게 저장된다는 것은 별로 좋은 느낌은 아니죠.

쿠키 파일은 사용자가 컴퓨터를 끄든 켜든 하드디스크에 (상당 기간) 저장되어 있기 때문에, 언제든지 사용자가 다시 어떤 웹 싸이트에 접속하면 쿠키에 저장해 놓은 정보를 읽어 들여서 여러 형태의 '맞춤화된' 서비스를 제공할 수 있습니다. 이를 테면, 로그인을 한 번만 하면 그 다음부터 안 해도 된다든지, 어떤 페이지를 "몇 번 보셨군요" 라고 알려준다든지 등이 가능합니다.

쿠키의 이런 독특한 점은 결국 개인 정보 유출에 관한 문제를 불러 일으킵니다. 왜냐하면, 사용자 하드디스크에 그 사용자가 어떤 식으로 웹 써핑을 하고 있는지, 어떤 물건을 구입했는지, 이메일 주소는 무엇인지 등의 개인정보까지 저장될 수도 있기 때문에 누군가 악한 마음을 품고 쿠키를 뒤지면 민감한 정보가 유출될 수도 있을 것이기 때문입니다.

그래서 웹 브라우져에는 대개 쿠키를 항상 받아들일 것이냐, 아니면 매번 대화상자를 띄워서 물어보길 원하느냐, 그렇지 않으면 쿠키를 절대 받아들이지 않느냐를 선택하는 부분이 있습니다만, 불행히도 기본 설정은 모든 쿠키를 다 받아들이는 것으로 되어 있고, 또, 대개의 엔드유져는 쿠키란 것이 있는지도 모른 채 자기 정보를 하드 디스크에 저장을 하고 있습니다. 게다가, 쿠키를 꺼놓으면 싸이트 내용을 보는데 지장을 초래하게 하는 싸이트도 아주 많구요.

그렇다면 쿠키는 어디 있을까요?

windows 2000 유져는 C: 안의 "Documents and Settings" 폴더 속에 들어 있는 자기 폴더(로그인 유져 폴더) 안에 보면, "Cookies"라는 폴더가 있습니다. 열어 보면 이상한 .txt 파일들이 많이 들어 있습니다. 윈98 은.. 잘 생각이 안 나는데, 아마 C:의 System 폴더인가, System32이던가에 "Cookies" 폴더가 있을 것입니다.

이 쿠키 파일들은 인터넷 익스플로러에서 지울 수 있습니다.
[도구] --> [인터넷옵션] 메뉴를 선택해보면 아래 그림처럼 쿠키를 지울 수 있는 부분이 나옵니다.

이제 쿠키를 실제 어떻게 만드는지, 자바스크립트 예제를 통해 알아봅시다.

자바스크립트를 이용한 쿠키 만들기

쿠키를 기록하고 읽는 것은 서버 측에서 할 수도 있고 클라이언트 측에서 할 수도 있습니다. 서버 쪽에서 한다면 펄이나 PHP, ASP 같은 server-side scripting 언어를 이용해서 http의 헤더를 통해 쿠키를 기록합니다. 클라이언트 쪽에서 한다면 자바스크립트를 이용해서 만듭니다. 이 글에서는 자바스크립트를 이용한 것을 다룹니다.

문자열 처리

쿠키를 만드려면 문자열 처리와 관련된 내용을 조금 알아야 합니다. 필요한 내용은 indexOf()의 활용, 그리고 split()의 활용입니다. indexOf() 는 괄호안의 문자가 어떤 문자열의 몇 번째에 나오는가를 알려주는 함수입니다. 예를 들어,

var name="myonghon";
 var position1 = name.indexOf("m");

의 경우엔 position2 변수에 4가 담깁니다.

"m"처럼 한 자가 아니라 한 단어를 입력하는 경우 그 단어 첫글자의 위치를 리턴합니다.

예를 들어,

var positon3 = name.indexOf("hon");

의 경우 position3 변수에는 5가 담깁니다.

만약 찾는 문자가 없으면 -1을 리턴 합니다.
어떤 문자열에 특정 문자가 있는지 없는지 알아볼 때 사용할 수 있습니다.

var address ='';
 while (address.indexOf("@") == -1) {address = prompt("이메일 주소는요?", "")};

위와 같이 하면, @가 들어간 내용을 입력할때까지 계속 이메일 주소를 묻습니다. 물론, 이메일 주소의 유효성 확인은 위와 같이 간단히 되는 것이 아닙니다. 사실은 엄청나게 복잡합니다. ^_^

그 다음, split()은 어떤 문자열을 split() 괄호 안에 들어있는 것을 기준으로 쪼개서 그 결과를 배열로 리턴하는 겁니다.

var name="george&paul&john&lingo";
 var beatle = name.split("&");

라고 하면, beatle[0]에는 george가, beatle[1]에는 paul이, beatle[2]에는 john이 들어 가게 됩니다.

쉽죠?

이제 도구는 다 갖췄으니, 쿠키를 공략해 봅시다. 쿠키를 만드는 건 정말 쉽습니다.

쿠키 굽기

복잡하게 들어가면 많은 내용이 있지만, 이 글에서 필요한 내용에 해당하는 부분은 정말 간단합니다. 쿠키는 다음과 같은 형태를 갖는 문자열에 다름 아닙니다.
쿠키이름 = 쿠키값

쿠키 이름은 우리 마음대로 정하면 됩니다. 쿠키 값은 콤마, 콜론, 공백, 세미콜론이 오면 안된다는 규칙만 지키면 됩니다. 콜론이나 공백은 escape() 함수를 이용하면 적절한 형태로 변형됩니다. 이렇게 쿠키 이름에 쿠키 값을 할당한 다음,

document.cookie=쿠키이름;

이렇게만 하면 그 html 문서에 해당하는 쿠키가 셋팅됩니다.

 <head>
 <script name="javascript">
 function readCookie() {
   var cookie2 = document.cookie;
   my_cookie = unescape(cookie2);
   var cookie_value = my_cookie.split(":");
   var name2 = cookie_value[1];
   alert("당신이름은 " + name2 + "이군요");
 }
 </script>
 </head>
 <body onload="readCookie()">

setCookie 함수의 두번째줄은 이름을 묻는 대화상자를 띄워주는 것입니다.
예를 들어 myonghon이라고 입력했다면, 그 다음 줄은 my_cookie라는 변수에 cookie1=name%3myonghon이라고 저장하게 됩니다.

name:myonghon이라는 문자열이 escape() 함수에 의해서 name%3myonghon으로 바뀌는 겁니다. escape() 함수가 콜론을 "%3"으로 바꾼 것입니다. 그런데, 이런 건 전혀 신경쓸 필요없습니다. 그냥 콜론이나 공백 등이 들어가 있는 문자열은 escape() 함수에다가 넣어 줘야 쿠키에 저장된다는 것만 기억하면 됩니다.

그 다음 줄은 my_cookie를 그 문서의 쿠키로 지정하라는 내용입니다. <body> 테그에는 onload="setCookie()" 를 넣어서, 그 페이지가 로딩되면서 자동으로 setCookie() 함수가 호출되도록 하면 됩니다.

다 입력했으면 이 html 문서를 웹 브라우져에서 불러보세요.
이름을 묻는 대화상자가 뜰 겁니다. 예를 들어 "myonghon"이라고 입력을 하게 되면,
쿠키 파일에는 cookie1=name%3myonghon이라고 저장하게 됩니다.

cookie1은 쿠키 이름, = 다음 부분은 쿠키 값입니다.

이제 이 쿠키가 정말로 저장되었는지 확인해 봅시다. 쿠키를 읽어 들이는 것도 굉장히 간단합니다. 위에서 했던 과정을 반대로 하면 됩니다.

쿠키 읽기

새로 html 문서를 하나 열고 다음과 같이 입력해 보세요.

쿠키 관련 라이브러리

라이브러리씩이나 되지는 않지만 쿠키를 만들고 읽을 때 자주 쓰이는 루틴이 있습니다. 많은 싸이트가 이 루틴을 카피해서 사용하고 있습니다. 어떻게 이뤄진 것인지 하나하나 설명하겠습니다.

먼저 쿠키를 세팅하는 루틴부터 봅시다.
쿠키 이름과 값만 세팅하는 경우는 앞에서 본 것처럼 escape() 함수와 document.cookie만 활용하면 간단하게 할 수 있습니다. 그런데 그건 제일 간단한 쿠키일 때의 이야기이고, 사실은 쿠키는 여러 가지 조건과 함께 셋팅할 수 있습니다. 제일 대표적인 것이 쿠키를 '언제까지 저장할 것인가'입니다.

쿠키는 사용자 하드디스크에 저장된다고 했습니다. 그런데, 아무 값도 할당하지 않고 쿠키 이름과 쿠키 값만을 세팅하면 그 쿠키는 하드디스크에 실제로 저장되지는 않고 웹 브라우져 창을 닫음과 동시에 사라지게 됩니다.(이런 것을 쿠키가 그 '세션에서만 유효하다'라고 합니다.)

만약 쿠키를 실제로 하드디스크에 저장하고 싶다면 name=value 다음에 세미콜론을 쓰고, expires=란 것을 붙여 줘야 합니다. (name=value;expires=)

이때 expires= 다음에 써 주는 시간은 반드시 표준화된 시간, 즉 GMT로 바꿔야 합니다. 그럴 때 사용하는 것이 toGMTString()이라는 함수입니다.

예를 들어 지금 현재 시간을 GMT 형식으로 출력하려면,

var today = new Date();
var mytime = today.toGMTString();
document.writeln(mytime);

이렇게 하면 7 Jan 2002 13:40:12 UTC라고 출력됩니다. 바로 이런 것이 GMT 형식입니다.

'지금으로부터 얼마 뒤'를 계산하려면 모두 다 "초"로 고치는것이 좋습니다. 이 때 주로 밀리세컨드(즉, 천분의 일초)를 사용합니다. 이렇게 날짜(Date)를 밀리세컨드로 바꿔 주는 함수가 getTime() 함수입니다. 다음 코드를 보세요.

쿠키 읽어들이기

먼저 약간의 설명이 필요합니다. 앞에서 얘기한 문자열 관련 함수 중에는 substr()이란 것이 있습니다. 이렇게 사용합니다.

var myname = "paul gilbert";
var a = myname.substr(0,4);