반나절을 헤메다가 100%는 아니지만 어느 정도 해결된 인코딩 문제의 해결 과정에 대하여 이야기하려 합니다. 인코딩 문제는 웹사이트 구축시 매우 자주 발생하는 이슈중 하나죠. 해결도 비교적 간단하지 않습니다.


! 문제 발생


JSON 타입의 파일을 자바스크립트(jQuery)를 사용해 AJAX로 불러온 후 화면에 출력하려고 코딩 하던 중 뜻하지 않은 오류가 발생했습니다. 이상하게도 불러올 값 중에서 제목은 아무런 문제가 발생하지 않았으나 본문을 불러올때 AJAX 기능에 문제가 생기더군요...


!! 증상


일단 본문 인코딩 때문이라 생각하고 태그도 없애고 길이도 줄여가고 인용코드인 따옴표등도 삭제하기도 하고... 참 많은 방법을 사용했습니다. 그 결과 일부 문자열 출력시 정상 동작하였으나 원하는 텍스트 전체를 불러올 경우 계속적으로 에러가 발생하였습니다.


!!! 해결 방법


우선 구글링을 통해 인코딩시 나타나는 해결방법이 무엇인지 찾아보았습니다. 참 많은 글들이 있더군요...

i. iconv() 함수로 인코딩 변환
ii. urlencode() 함수를 사용하는 방법
등등...


어쨌든 두번째 urlencode() 함수를 사용하는 방법으로 해결되었습니다... 사실 아직 정확한 원인과 해결방법은 잘모르겠고 계속 찾고 있는 중입니다.(혹시 단서가 있다면 댓글 부탁드립니다.)
쉽게 설명하자면 불러올 JSON에 있는 텍스트 값을 $text라고 가정합시다... 그러면 $text를 urlencode()를 사용해 인코딩합니다. 아래처럼요...

<?php
urlencode($text);
?>


그러면 기존의 텍스트가 $str="가나다라" 였다면 $str="%ㄹㅇ%ㄴ마런ㅇ미" 예를 들면 이런 인코딩된 문자로 변환되었을겁니다. 이 변경된 코드는 자바스크립트에서 잘 불러오더군요... ㅠ_ㅠ 불러온 텍스트를 다시 자바스크립트 함수로 디코딩해주면 끝입니다 :)

<script type="text/javascript">
// JSON을 통해 불러온 값이 value.content라고 할 경우
decodeURLComponent(value.content);
</script>


위와 같이 디코딩하면 텍스트에 정상적으로 출력됩니다. 단, 스페이스가 + 기호로 바뀐 것을 알수 있습니다....
PHP나 자바스크립트에서 replace 함수를 사용해 변경해주면 완료입니다^^

- PHP일 경우 : str_replace() 함수 사용
- 자바스크립트: replace() 함수 사용

자세한 변환 방법은 위에 서치창에 php replace 또는 자바 replace라고 넣은 뒤 검색해보시면 관련 글이 바로 나올껍니다! 도움이 되셨길 바랍니다.