HTML Entity

HTML Entity란?

HTML Entity는 특수 문자나 기호를 HTML 문서에서 표시하기 위한 코드입니다
HTML에서는 <,>,&등의 문자는 태그나 HTML 구조를 나타내는 데 사용되기 때문에, 이를 문자 그대로 출력하려면 HTML Entity변환해야 합니다

HTML Entity 사용하는 이유: 
브라우저에서 특수 문자를 정확히 렌더링및 언어별 기호나 유니코드 문자를 HTML에서 표시하기 위해서 사용합니다

HTML Entity 특징:
HTML Entity는 &로 시작하고, 특정 코드나 이름 뒤에 ;를 붙여 사용합니다
EX> &lt; → <

 

 

일반문자열에서는 반응이 없지만 

 

 

특수문자를 삽입하면 값입 변환되어 출력되는 것을 확인 할 수 있습니다

 

 

문자	Entity 이름	10진수 코드	16진수 코드
<	&lt;	&#60;	&#x3C;
>	&gt;	&#62;	&#x3E;
&	&amp;	&#38;	&#x26;
"	&quot;	&#34;	&#x22;
'	&apos;	&#39;	&#x27;

지금까지 많은 CTF를 풀면서 여러 페이지에서 HTML Entity가 적용된 것을 볼 수있었습니다 이유가 XSS공격을 어느 정도 방지 할 수 있기 때문입니다

HTML Entity를 통한 XSS 차단 원리
HTML Entity를 사용하면 사용자 입력이 HTML 태그나 JavaScript 코드로 해석되는 것을 방지할 수 있습니다

 

 

입력: <script>alert(1)</script>
출력: &lt;script&gt;alert(1)&lt;/script&gt;

HTML Entity로 인해 브라우저는 <script>를 HTML 태그로 해석하지 않고 텍스트로 렌더링하므로 XSS 실행이 차단됩니다

Reflected XSS:
URL 파라미터나 폼 입력에서 삽입된 악성 코드가 출력될 때 HTML Entity로 처리되면 공격이 무효화됩니다

Stored XSS:
데이터베이스나 서버에 저장된 악성 코드가 HTML 엔터티로 변환되어 저장되면 브라우저가 이를 스크립트로 해석하지 못합니다

예외로 HTML Entity가 적용이 안되는 곳이 있습니다 그곳은 HTML Editor라는 곳입니다
우리가 예전 블로그나 카페글 작성할때 자주 보던 그것입니다

 

HTML Editor란?

 

사용자가 HTML 코드를 작성, 편집, 미리보기할 수 있는 도구이고 간단한 텍스트 기반 HTML 코딩부터 다양한 스타일의 편집기를 제공합니다

HTML Editor에서 HTML Entity가 적용되지 않는 이유는 HTML Editor의 기본 동작 원리와 관련이 있습니다

HTML Editor는 사용자가 작성한 HTML을 그대로 브라우저에서 렌더링합니다. 즉 <, > 같은 특수 문자를 태그로 해석하고 실행합니다.
반면 HTML Entity(&lt;, &gt;)는 브라우저에서 텍스트로 출력되도록 설계된 것이므로 Editor의 기본 동작과 충돌합니다



HTML Editor에서 HTML Entity를 적용하려면 다음과 같은 과정을 진행해야 합니다

 

1. 파라미터에서 HTML 특수문자들을 전부 HTML Entity로 치환

• 사용자가 입력한 HTML 코드의 특수 문자를 HTML Entity로 변환하여,
  브라우저가 코드로 해석하지 않도록 만듭니다.
  
  입력: <script>alert('XSS');</script>
  출력: &lt;script&gt;alert('XSS');&lt;/script&gt;
  
  
• 모든 HTML 태그와 특수 문자를 기본적으로 무력화하여
  잠재적인 XSS 공격을 방지합니다.

 

2. 허용해줄 태그를 식별하고 그 태그를 다시 살림 (화이트리스트)

• 허용 태그 리스트(화이트리스트)를 기반으로 필터링

 

 

• 적용 전: &lt;script&gt; ➖ &lt;input&gt;
  적용 후: <script> ➖ <input>
  
  
• 특정 태그만 허용하여 안전하게 사용할 수 있도록 보장
  허용되지 않은 태그는 여전히 무력화된 상태로 유지

3. 허용된 태그 내에 악의적인 이벤트 핸들러를 필터링 (블랙리스트)

• 허용된 태그라도 태그 내부에 포함된 악의적인 이벤트 핸들러를 제거하여
  추가적인 보안을 확보합니다.

 

 

 

• 적용 전: <input onclick="alert(1)"굵은 텍스트/>                                                                                                                적용 후: <input 굵은 텍스트/>                                                                                                                                                          
• 이벤트 핸들러(예: onclick, onmouseover, onload)는 JavaScript 코드를
  실행할 수 있으므로 이를 제거하여 공격 가능성을 차단합니다.