HTML 특수문자 엔티티 인코더 및 디코더
HTML 특수문자(&, <, >, ", ') 엔티티 인코딩 및 디코딩 변환과 XSS 이스케이프 지원
Responsive 728x90 / 320x100 Ad Slot
(CLS Prevention Active · Zero Shift)주요 HTML 엔티티 퀵 레퍼런스
Native In-Feed / High Viewability Ad Slot
(CLS Prevention Active · Zero Shift)HTML 엔티티 인코딩과 웹 표준 및 XSS 보안 방어
HTML 엔티티 인코더 및 디코더(HTML Entity Encoder & Decoder)는 웹 페이지와 애플리케이션에서 예약된 특수문자(&, <, >, ", ')와 다국어 유니코드 기호를 안전한 HTML 엔티티(HTML Entities)로 상호 변환해 주는 필수 웹 개발 유틸리티입니다. 브라우저는 HTML 문서를 파싱할 때 `<`와 `>`를 태그의 시작과 끝으로 인식하며, `&`를 엔티티 선언의 시작 기호로 해석합니다. 만약 블로그 본문, 댓글, 기술 문서 또는 관리자 시스템에서 이러한 기호가 원형 그대로 브라우저에 렌더링되거나 적절한 이스케이프(Escaping) 없이 innerHTML에 삽입되면, 브라우저가 이를 마크업으로 오인하여 화면 레이아웃이 깨지거나 심각한 보안 결함으로 이어집니다.
특히 사용자가 입력한 임의의 문자열이 검증과 엔티티 치환 없이 웹 브라우저에 그대로 출력될 경우, 악의적인 해커가 `<script>` 태그나 악성 이벤트 핸들러(`onload`, `onerror`)를 주입하여 세션 쿠키를 탈취하거나 권한을 가로채는 XSS(Cross-Site Scripting, 크로스 사이트 스크립팅) 공격에 치명적으로 노출됩니다. 또한 레거시 웹사이트를 크롤링하거나 서드파티 RSS 피드, 이메일 본문을 수집할 때 `&quot;`, `&amp;` 등 다중 중복 인코딩(Double Encoding)된 깨진 텍스트를 원래의 깨끗한 문자열로 복원하는 작업에도 엔티티 디코딩 파이프라인이 필수적입니다.
본 도구는 W3C HTML5 공식 명세서에 정의된 2,000개 이상의 명명 엔티티(Named Character References)뿐만 아니라 10진수 숫자 엔티티(`&#...;`), 16진수 유니코드 엔티티(`&#x...;`)를 완벽히 지원합니다. 모든 변환 연산은 네트워크 통신 없이 사용자의 웹 브라우저 로컬 자바스크립트 엔진 메모리 내에서 100% 클라이언트 사이드로 실행되므로, 보안 및 기밀 텍스트를 안심하고 인코딩/디코딩할 수 있습니다.
HTML 특수문자 이스케이프 및 XSS 방어 원리
예약된 구문 토큰을 명명 문자 참조(Named Reference) 또는 유니코드 코드포인트로 치환하여 안전성을 확보합니다.
예약 문자 5종을 명명 엔티티로 매핑하고, 확장 기호는 유니코드 코드포인트 16진수 엔티티로 변환합니다.
👉 브라우저 화면에서 스크립트 실행 없이 안전한 텍스트로 렌더링됩니다.
- 5대 핵심 예약 문자(Core 5 Reserved Characters): HTML 파서의 구문 트리를 왜곡할 수 있는 `&`(&), `<`(<), `>`(>), `"`("), `'`(' 또는 ')를 최우선 치환합니다.
- 명명 문자 참조(Named Entities): 사람이 직관적으로 읽고 이해할 수 있도록 공식 W3C 명칭(예: `©` for ©, ` ` for Non-breaking Space, `™` for ™)으로 매핑합니다.
- 10진수 및 16진수 숫자 엔티티: 명명 엔티티가 존재하지 않는 특수 유니코드 기호나 이모지를 표준 유니코드 코드포인트를 기반으로 `&#[10진수];` 또는 `&#x[16진수];` 형태로 변환합니다.
- 양방향 무손실 복원(Bidirectional Decoding): 브라우저 내장 TextNode 및 DOM 생성 역변환 알고리즘을 통해 복잡하게 중첩된 엔티티를 원본 문자로 100% 무손실 복구합니다.
핵심 HTML 엔티티 및 XSS 방어 치환 기준표
| 문자 (Char) | 문자 명칭 | 명명 엔티티 (Named) | 10진수 엔티티 | 16진수 엔티티 | 주요 보안 위험 및 용도 |
|---|---|---|---|---|---|
| & | Ampersand | & | & | & | 엔티티 파싱의 시작 기호, URL 쿼리스트링 및 텍스트 충돌 방지 |
| < | Less Than | < | < | < | 태그 시작 기호, 악성 <script> 및 <div> 태그 인젝션 원천 차단 |
| > | Greater Than | > | > | > | 태그 종료 기호, 닫는 태그 주입을 통한 구조 왜곡 방어 |
| " | Double Quote | " | " | " | HTML 속성값 이탈(`" onfocus="...`) 방어 |
| ' | Single Quote | ' / ' | ' | ' | 작은따옴표 기반 HTML 속성 및 인라인 JS 탈출 방어 |
| Non-breaking Space | |   |   | 브라우저 자동 줄바꿈 및 연속 공백 축소 방지용 특수 공백 | |
| © | Copyright | © | © | © | 웹 푸터 저작권 표기 시 인코딩 깨짐 방지 |
| ™ | Trademark | ™ | ™ | ™ | 상표권 및 브랜드 명칭 표기 시 표준 렌더링 보장 |
High-Engagement In-Article Native Ad Slot
(CLS Prevention Active · Zero Shift)사용 방법
11. 텍스트 또는 HTML 코드 입력
변환하고자 하는 일반 텍스트, HTML 마크업 코드 스니펫, 또는 웹 크롤링된 엔티티 문자열을 입력 영역에 붙여넣습니다.
22. [인코딩(Encode)] 또는 [디코딩(Decode)] 모드 선택
특수문자를 안전한 HTML 코드로 치환하려면 [Encode]를, 반대로 `<div>` 등을 읽기 쉬운 원본 문자로 복원하려면 [Decode]를 클릭합니다.
33. 인코딩 범위 및 엔티티 형식 옵션 지정
필수 5대 특수문자만 치환할지, 비-ASCII 문자 및 이모지까지 모두 숫자 엔티티(&#x...;)로 바꿀지 옵션을 필요에 맞게 조정합니다.
44. 결과 복사 및 즉시 적용
[복사] 버튼을 눌러 안전하게 처리된 HTML 문자열을 클립보드에 담고 블로그 글, 웹 템플릿, 데이터베이스 쿼리 파라미터에 바로 붙여넣습니다.
실무에서의 HTML 엔티티 인코딩/디코딩 활용 사례
웹 보안 강화부터 기술 블로그 마크업 작성까지 다양하게 쓰입니다.
HTML, XML 또는 React 코드를 문서 본문에 있는 그대로 보여주기 위해 `<`와 `>`를 `<` 및 `>`로 변환하여 렌더링 오류를 방지합니다.
사용자가 입력한 텍스트를 데이터베이스에 저장하거나 화면에 출력할 때 HTML 엔티티로 이스케이프하여 스크립트 실행을 원천 무력화합니다.
크롤링한 뉴스 기사나 상품 설명에 섞여 있는 `&quot;`, `&nbsp;`, `&amp;` 등 복잡한 엔티티를 사람이 읽을 수 있는 한글 및 기호로 디코딩합니다.
구형 이메일 클라이언트(Outlook 등)에서 문자셋 인코딩 차이로 특수기호(©, ®, €)가 깨지는 현상을 방지하기 위해 표준 엔티티로 변환합니다.
💡 HTML 엔티티 처리 전문가 팁 & 보안 가이드
다른 문자를 먼저 변환한 뒤 `&`를 나중에 변환하면, 이미 생성된 `<`의 `&`가 `&lt;`로 이중 인코딩되는 대참사가 발생합니다.
React JSX는 `{userInput}` 바인딩 시 기본적으로 HTML 이스케이프를 수행하지만, `dangerouslySetInnerHTML`을 사용할 때는 반드시 사전 검증과 엔티티 변환을 거쳐야 합니다.
`<input value="...">` 같은 속성 내부에서는 작은따옴표와 큰따옴표의 이스케이프가 본문보다 훨씬 더 엄격하게 요구됩니다.
URL 파라미터는 퍼센트 인코딩(`%20`, `%26`)을 사용해야 하며, HTML 엔티티 인코딩(`&`)은 웹 문서 본문/속성에 배치될 때만 적용되어야 합니다.
⚠️ 흔히 하는 실수 & 예방법
자주 묻는 질문 (FAQ)
사용자 및 전문가들이 가장 자주 묻는 핵심 질문과 명확한 해답입니다.
브라우저는 HTML 문서 파싱 시 태그 구문 기호(`<`, `>`)를 만나는 즉시 렌더 트리를 구성하고 내장 자바스크립트를 실행합니다. 이를 엔티티(`<`, `>`)로 치환하면 브라우저가 실행 코드가 아닌 화면에 표시해야 할 단순 텍스트 데이터로 안전하게 인식하기 때문에 악성 스크립트 실행을 원천 차단할 수 있습니다.
Wide Responsive Banner
(CLS Prevention Active · Zero Shift)관련 도구 추천
URL 인코더 · 디코더 및 Query String 파라미터 파서
웹 주소 퍼센트 인코딩/디코딩, 한글 깨짐 방지 및 URL Query String(?key=value) 표 형태 구조 분석
유니코드 & UTF-8 바이트 정밀 분석기
텍스트 및 이모지의 글자별 Unicode 코드포인트(U+XXXX), UTF-8 Hex 바이트, 이진수 분석
코드 압축기(Minifier) 및 정렬기(Beautifier)
HTML, CSS, JavaScript 코드의 공백과 주석을 제거해 용량을 줄이는 압축 및 들여쓰기 정렬
JSON 포매터 및 유효성 검증기
JSON 정렬, 들여쓰기 2칸/4칸/압축(Minify), 문법 에러 위치 감지, 코드/트리 뷰 및 다운로드