IE 10에서 URL encoding (GET에서)

ajax로 GET을 보냈는데 IE에서만 한글 입력 전달이 안 된다.
인코딩 문제는 아니다(이미 meta charset=utf-8).
혹시나 해서 GET을 POST로 바꾸어 줬더니 IE에서도 잘 된다.
아, URL 인코딩 문제로군!

javascript에서 url 인코딩하는 함수는 encodeURI, encodeURIComponent가 있다.
$.ajax( { type: 'GET', url='...../xxx.php', data: "keyword=조조", timeout: 4000, success : function(result) { ...
이 부분에서 쓸 것이므로 encodeURIComponent로 조조 부분만 인코딩해주기로 한다.

주의할 점은, key-value pair를 인코딩할 때 ?, = 등은 빼고 따로 해 주어야 한다는 것이다. 즉,
"keyword=조조" 이것을 인코딩할 때,
"keyword=" + encodeURIComponent("조조") 이렇게 해야지,
encodeURIComponent("keyword=조조") 이렇게 하면 안 된다는 것이다(keyword에 해당하는 부분도 한글이라면 그 부분만 따로 encodeURIComponent해야 한다).

IE에서만 문제가 되는 이유는 아마도 크롬의 javascript 엔진이 ajax로 GET/POST를 할 때 알아서 url을 인코딩해주기 때문인 듯. (인터넷을 대충 뒤져 보니 스펙에 없으니 IE의 잘못이라기보다는 크롬의 센스인 것 같다. 어디까지나 대충이다.)

이것을 고치면서 한 가지 재미있는 사실을 알았는데, 구글 크롬에서는 주소창에 실제로는 인코딩된 값을 가지면서 사용자에게 보여줄 때만 한글을 보여준다는 것이다. 즉,
http://localhost:49351/search.php?keyword=조조           ...(1)

이것은 실제로는
http://localhost:49351/search.php?keyword=%EC%A1%B0%EC%A1%B0     ...(2)

이것이다.

(1)을 IE의 주소창에 넣으면 실행되지 않지만 (2)를 IE의 주소창에 넣으면 실행된다. 

그러면 (1)을 크롬의 주소창에 넣으면? (2)로 자동 변환되어 실행되므로 잘 실행된다(!)

이것은 크롬 주소창에서 한글이 포함된 주소를 복사해서 메모장에 붙여 보면 알 수 있다.