JavaScript, PHP, Ajax, Mac, iPhone and Talk Talk Talk

워드프레스를 처음 설치하고 나면 한글 태그 문제가 발생할 수 있습니다. 예를 들어, http://mygony.com/tags/영화 로 접근하면 이상하게 분명히 존재하는 영화 라는 태그를 못 찾는 문제죠. 제 경우엔 심지어 http://mygony.com/tags/%EC%98%81%ED%99%94 와 같은 형태로 보내도 괴상한 문자로 받곤 해서 짜증났던 적이 있습니다.

그러다가 문제점을 발견할 수 있었는데, 바로 mod_url 때문이었습니다. 알고 보니, 제가 받는 웹 호스팅에서 서버측 인코딩을 아예 euc-kr 로 박아놓았더군요. -_-;; 그래서 .htaccess 파일을 통해  받는 인코딩을 무조건 utf-8으로 변환해주도록 수정해두었습니다.

해보시면 알겠지만, 지금 제 블로그에는 한글 이름으로 검색하거나 태그를 입력해도 잘 동작합니다. ^^ .htaccess 파일에 다음과 같이 추가해주시면 됩니다.

<IfModule mod_url.c>
    ServerEncoding UTF-8
    ClientEncoding EUC-KR
</IfModule>

만약 블로그 언어로 EUC-KR을 사용하신다면 위의 UTF-8과 EUC-KR 자리를 바꾸시면 됩니다.

추가1: 서버측 언어를 EUC-KR로 하면 IE7과의 문제가 발생할 수 있다고 합니다.
추가2: 추가1의 문제가 최신 버전에서는 수정되었다고 합니다.

UI 개발을 하면서 JS와 CSS를 사용할 일이 많은데, 이 문자셋이라는 것이 문제가 될 때가 왕왕 있다.

특히, IE의 경우 HTML 문서와 링크된 외부 JS 파일/CSS 파일의 문자셋이 다르면 대부분의 경우 CSS는 무시, JS는 오류가 발생한다. 이 때, 자바스크립트 파일과 CSS 파일에 문자셋을 지정해 HTML 문서와 다른 문자셋을 써도 정상적으로 인식하게 만들 수 있다.

JavaScript 파일

자바스크립트는 외부 파일을 호출하는 <script> 태그에 속성으로 기술한다. 예를 들면, 외부 자바스크립트 파일이 utf-8 문자열을 사용한다면, 다음과 같이 작성할 수 있다.

<script type="text/javascript" src="path/file.js" charset="utf-8"></script>

붉은 글씨로 된 부분의 utf-8 을 원하는 문자열로 바꾸면 된다. charset 속성에 기술된 문자셋은 HTML 문서의 문자셋과 상관없이 인식되므로, 외부 자바스크립트 파일의 인코딩을 자유롭게 사용할 수 있다. 이 속성은 <script> 태그를 이용한 동적 스크립트 등에 유용하게 사용될 수 있다(이를 이용해 JSONP를 구현할 수도 있다). 또한 이 속성은, <a> <meta> <link> 태그에도 사용할 수 있다.

이 속성은 HTML 4.1 표준에 정의되어 있다.

CSS 파일

자바스크립트 파일은 HTML 문서에 있는 <script> 태그에 속성을 기술했지만, 이와 반대로 CSS 파일은 외부 파일에 직접 기술한다. 예를 들어, 외부 CSS 파일이 utf-8 문자열을 사용한다면, 다음 코드를 CSS 파일 제일 앞에 기술한다.

@charset "utf-8";

물론, 문자셋의 대소문자는 관계없으며, 역시 HTML 문서의 문자셋과는 상관없이 기술된 문자셋으로 인식된다.

이 선언은 CSS 2.1 표준에 정의되어 있다.