&;HTML 엔티티 변환
HTML 엔티티 인코딩/디코딩
HTML 엔티티 완벽 이해
HTML 엔티티는 HTML 문서에서 특수 의미를 가지는 문자(<, >, &, ")를 안전하게 표시하기 위한 표현법입니다. 사용자 입력을 웹 페이지에 출력할 때 XSS(Cross-Site Scripting) 공격을 방지하거나, HTML 소스 코드를 화면에 그대로 보여줄 때 반드시 사용합니다.
Named Entity vs Numeric Entity
HTML 엔티티는 두 가지 방식으로 표현됩니다. 이름 참조(Named: &)는 가독성이 높고, 숫자 참조(Numeric: & 또는 16진수 &)는 모든 환경·파서에서 보장됩니다. HTML5는 둘 다 지원하지만 XML에서는 일부 이름 참조가 인식되지 않을 수 있습니다.
자주 쓰이는 엔티티 총정리
| 문자 | 이름 참조 | 숫자 참조 | 용도 |
|---|---|---|---|
| < | < | < | 태그 시작 |
| > | > | > | 태그 끝 |
| & | & | & | 엔티티 시작 |
| " | " | " | 속성 구분자 |
| ' | ' | ' | 속성 구분자 |
| 공백 | |   | 줄바꿈 방지 공백 |
| © | © | © | 저작권 |
| ® | ® | ® | 등록상표 |
| € | € | € | 유로 |
XSS 방지 관점에서 활용
XSS(Cross-Site Scripting)는 악의적인 스크립트를 HTML에 주입하는 공격입니다. 사용자 입력을 그대로 innerHTML에 넣으면 공격자가 <script> 태그를 실행시킬 수 있습니다. HTML 엔티티로 인코딩하면 브라우저가 마크업이 아닌 텍스트로 처리합니다.
- 사용자 입력은 반드시 인코딩 후 출력 (가장 중요)
- 가능하면
innerHTML대신textContent사용 (자동 이스케이프) - HTML 속성, JS, CSS, URL 컨텍스트마다 별도 인코딩 필요
- CSP(Content Security Policy) 헤더로 인라인 스크립트 차단
사용 방법
- Encode 모드: HTML에 삽입할 텍스트를 입력하면 엔티티로 변환합니다.
- Decode 모드: 엔티티가 포함된 HTML을 입력하면 원래 문자로 복원합니다.
- 이름 엔티티 옵션으로
&와&형식을 선택할 수 있습니다.