다섯 글자만 기억하면 된다
HTML에서 뜻이 있는 글자는 <(태그 시작), >, &(엔티티 시작), 그리고 속성값을 감싸는 "와 '입니다. 이 다섯을 < > & " '로 바꾸면 어떤 문자열이든 HTML 본문과 속성값에 안전하게 넣을 수 있습니다. 사용자 입력을 화면에 표시할 때 이 변환을 빼먹는 것이 XSS(크로스 사이트 스크립팅)의 가장 흔한 원인입니다. 본문(텍스트 노드)에만 넣는다면 < > & 셋만으로 충분하지만, 속성값에도 들어갈 수 있다면 따옴표까지 바꿔야 합니다. 변환은 브라우저 안에서 끝납니다.
'를 쓰지 않는 이유
'는 XML 엔티티이고 HTML4에는 없었습니다. HTML5 브라우저는 모두 해석하지만 오래된 환경이나 이메일 클라이언트에서 글자 그대로 보일 수 있어, 숫자 형식 '가 더 안전합니다. 반대로 언이스케이프할 때는 둘 다 받아들입니다.
이름 엔티티와 숫자 엔티티
©처럼 이름이 있는 엔티티는 HTML5 기준 2,200개가 넘습니다. 이 도구는 nbsp, copy, reg, trade, hellip, mdash, ndash, laquo, raquo, 따옴표류, 통화 기호, 화살표 등 자주 쓰는 80여 개만 알고, 나머지는 그대로 둡니다. 숫자 형식 천(10진수)과 천(16진수)는 유니코드 코드 포인트를 직접 가리키므로 모든 글자를 표현할 수 있고 항상 해석됩니다. 문서가 UTF-8이면 한글을 엔티티로 바꿀 필요가 없습니다. 옵션은 인코딩을 믿을 수 없는 오래된 시스템이나 ASCII만 받는 곳에 붙여 넣을 때만 쓰세요.
자바스크립트 문자열 이스케이프는 다른 문제
HTML 이스케이프는 브라우저가 태그로 오해하지 않게 하는 것이고, JS 이스케이프는 문자열 리터럴이 따옴표에서 끊기지 않게 하는 것입니다. 역슬래시를 \\로, 줄바꿈을 \n으로, 사용 중인 따옴표를 \"로 바꿉니다. U+2028·U+2029(줄 구분자)는 눈에 보이지 않지만 오래된 JS 파서에서 줄바꿈으로 취급돼 문자열을 깨뜨리므로 함께 이스케이프합니다. HTML 안의 <script>에 문자열을 넣는다면 JS 이스케이프 뒤에 </script가 남지 않게 <를 \u003c로 바꾸는 처리까지 필요합니다. 이 도구는 그 단계는 하지 않으니 그런 경우 JSON.stringify와 함께 별도 처리하세요.
자주 묻는 질문
이미 이스케이프된 텍스트를 또 하면요?
&가 &로 바뀌어 화면에 "<" 같은 글자가 그대로 보이게 됩니다(이중 이스케이프). 결과에 &가 많으면 입력이 이미 변환된 상태인지 확인하세요.
언이스케이프했는데 일부 엔티티가 남아요.
지원 목록에 없는 이름 엔티티입니다. 숫자 형식으로 바꾸거나 해당 글자를 직접 입력해 주세요.
JSON에 넣을 문자열은 어떻게 하나요?
JS 이스케이프(큰따옴표 기준)와 거의 같지만, JSON은 작은따옴표 문자열을 허용하지 않고 \x 형식도 없습니다. 큰따옴표 기준 결과를 쓰면 JSON에서도 유효합니다.