Ajax 통신에서 한글 문제

Ajax 통신에는 XMLHttpRequest 객체가 사용되는데, 기존 html에서 form을 사용해 통신할 때 URL-Encoding이 되는 것과 달리 XMLHttpRequest는 자체적으로 인코딩을 수행하지 않는다. 그래서 한글이나 특수문자를 사용하는 경우 인자값을 인코딩해서 보내줘야 한다.

javascript에서 인코딩하는 방식에는 크게 escape()와 encodeURIComponent() 방식이 있는데, escape()는 유니코드로 인코딩을 하고 encodeURIComponent()는 UTF-8로 인코딩한다. (참고 XMLHttpRequest 사용시 한글 파라미터 전송 방법)

일반적인 경우 encodeURIComponent()를 사용해서 인코딩한 후 서버쪽에서 UTF-8로 처리하면 되는데, ASP에서 응답받는 서버쪽을 Response.CharSet=”utf-8″ 로 세팅한 경우 일부 한글이 깨지는 문제가 발생한다. 그래서 결국 escape()를 사용해야 하는데 escape()는 몇몇 문자를 인코딩하지 않는 문제가 있다. 그래서 가능하면 escape() 대신 encodeURIComponent()를 사용하도록 권고하고 있다. (참고 Comparing escape(), encodeURI(), and encodeURIComponent())

결국 escape()를 사용할 때, 문자열에 ‘+’이 들어가면 빈칸으로 인식되는 문제가 발생한다. 그래서 prototype.js의 Form 객체에 escape() 기능을 따로 정의해서 사용하게 되었다.

escape: function(value) {
 return escape(value).replace(/\+/g, '%2B');
}

prototype.js 내부에서도 Form.serialize()에서 사용된 encodeURIComponent()를 Form.escape()를 사용하도록 수정해서 문제는 해결됐다.

공개된 라이브러리, 특히 영어권에서 만들어진 라이브러리는 항상 유니코드 사용에 문제가 발생하는 경우가 많다. 씁쓸하지만 고쳐서 쓸 수 밖에. 국내에서 좋은 오픈소스 라이브러리가 많이 만들어지는 세상을 기대해본다. *^^*