크로스 사이트 스크립팅(XSS) - jquery DOM

Cross-site Scripting (XSS)

설명

크로스 사이트 스크립팅(XSS)은 사용자가 제어할 수 있는 값을 jQuery의 html(), append(), prepend(), wrap(), wrapInner(), wrapAll(), before(), after(), globalEval(), getScript() 등과 같은 DOM 조작 함수에 그대로 넣으면서 발생하는 취약점입니다. 공격자는 악의적인 스크립트를 삽입해 사용자의 브라우저에서 실행시킬 수 있으며, 이를 통해 쿠키 탈취, 세션 하이재킹, 피싱 등 다양한 공격이 이루어질 수 있습니다.

취약한 코드는 사용자 입력값이나 URL, 동적 데이터가 위 함수들에 직접 전달될 때 발생합니다.

잠재적 영향

• 개인정보 유출: 악성 스크립트 실행을 통해 쿠키나 인증 정보가 유출될 수 있습니다.

• 세션 하이재킹: 공격자가 사용자의 세션을 탈취하여 권한을 획득할 수 있습니다.

• 피싱 또는 사기 페이지 유도: 악의적인 HTML/JS 코드로 사용자를 속일 수 있습니다.

해결 방법

• 사용자 입력값이나 동적 데이터를 jQuery의 DOM 조작 함수(html, append 등)에 직접 전달하지 않습니다.

• 가능하다면 텍스트로만 출력할 때는 text(), val() 등 안전한 API 사용을 권장합니다.

• 어떻게든 동적 HTML을 넣어야 할 경우 반드시 데이터를 HTML 이스케이프 처리하여 <, >, &, ' 등 특수문자를 치환하거나, 신뢰할 수 있는 템플릿 엔진을 사용합니다.

• jQuery의 risky DOM API 사용에 주의하고, 사용자 입력을 절대 그대로 사용하지 않습니다.

취약한 코드 및 안전한 코드 예시

취약한 코드

// 취약: 사용자 입력값이 DOM 조작 함수에 직접 전달
function vulnerable(userInput) {
  $("#container").html(userInput); // XSS 취약점
}

// 또 다른 예시
const hash = window.location.hash;
$("div").append(hash); // XSS 가능

안전한 코드

// 안전 적용: 텍스트 출력에는 text() 사용
function safe(userInput) {
  $("#container").text(userInput); // 안전
}

// 또는 HTML 이스케이프 처리 후 사용
function escapeHTML(str) {
  return String(str).replace(/[&<>'"]/g, function (c) {
    return {
      "&": "&amp;",
      "<": "&lt;",
      ">": "&gt;",
      '"': "&quot;",
      "'": "&#39;",
    }[c];
  });
}

function safeWithEscape(userInput) {
  $("#container").html(escapeHTML(userInput)); // 이스케이프 처리 후 사용
}

설명:

• 취약한 코드: 위 취약 코드에서는 userInput, window.location.hash 등 신뢰할 수 없는 값이 .html(), .append() 등 DOM 조작 메서드에 그대로 전달되었습니다. 이 경우 공격자가 태그 등의 악성 스크립트를 삽입하여 XSS 공격을 할 수 있습니다.

• 안전한 코드: 권장 코드에서는 text()를 사용해 값을 텍스트로만 출력하거나, HTML 이스케이프 처리를 해서 <, > 등이 실제 태그나 스크립트로 인식되지 않도록 했습니다. 이로써 악성 스크립트가 실행될 위험이 사라집니다.

참조

• CWE-79