DOM Clobbering技术详解<\/h1>

1. 什么是DOM Clobbering<\/h2>
DOM Clobbering是一种利用HTML元素及其属性来覆盖或"破坏"(clobber)JavaScript全局变量或对象属性的技术。这种攻击方式在XSS和CSRF等经典客户端漏洞被修复后变得越来越重要。<\/p>

2. 基本原理<\/h2>
DOM Clobbering的核心原理是：浏览器会自动将具有`id<\/code>或name<\/code>属性的HTML元素作为全局变量或DOM对象的属性暴露出来。<\/p>`

基本示例<\/h3>
<form<\/span> id<\/span>=<\/span>"x"<\/span>><output<\/span> id<\/span>=<\/span>"y"<\/span>>I've been clobbered<\/output<\/span>>
<\/span><\/span><script<\/span>>
<\/span><\/span>alert<\/span>(x<\/span>.y<\/span>.value<\/span>);  \/\/ 输出"I've been clobbered"
<\/span><\/span><\/span><\/span><\/script<\/span>>
<\/span><\/span><\/code><\/pre>3. 元素关系确定<\/h2>
通过以下代码可以确定哪些HTML元素可以组合在一起形成DOM Clobbering:<\/p>
var<\/span> log<\/span>=<\/span>[];
<\/span><\/span>var<\/span> html<\/span> =<\/span> ["a"<\/span>,"abbr"<\/span>,"acronym"<\/span>,...,"xmp"<\/span>]; \/\/ 所有HTML元素
<\/span><\/span><\/span><\/span>var<\/span> div<\/span>=<\/span>document.createElement<\/span>('div'<\/span>);
<\/span><\/span>for<\/span>(var<\/span> i<\/span>=<\/span>0<\/span>;i<\/span><<\/span>html<\/span>.length<\/span>;i<\/span>++<\/span>) {
<\/span><\/span>    for<\/span>(var<\/span> j<\/span>=<\/span>0<\/span>;j<\/span><<\/span>html<\/span>.length<\/span>;j<\/span>++<\/span>) {
<\/span><\/span>        div<\/span>.innerHTML<\/span>=<\/span>'<'<\/span>+<\/span>html<\/span>[i<\/span>]+<\/span>' id=element1>'<\/span>+<\/span>'<'<\/span>+<\/span>html<\/span>[j<\/span>]+<\/span>' id=element2>'<\/span>;
<\/span><\/span>        document.body<\/span>.appendChild<\/span>(div<\/span>);
<\/span><\/span>        if<\/span>(window.element1<\/span> &&<\/span> element1<\/span>.element2<\/span>){
<\/span><\/span>            log<\/span>.push<\/span>(html<\/span>[i<\/span>]+<\/span>','<\/span>+<\/span>html<\/span>[j<\/span>]);
<\/span><\/span>        }
<\/span><\/span>        document.body<\/span>.removeChild<\/span>(div<\/span>);
<\/span><\/span>    }
<\/span><\/span>}
<\/span><\/span>console<\/span>.log<\/span>(log<\/span>.join<\/span>('\n'<\/span>));
<\/span><\/span><\/code><\/pre>测试结果显示以下元素组合有效:<\/p>
form->button
form->fieldset
form->image
form->img
form->input
form->object
form->output
form->select
form->textarea
<\/code><\/pre>
4. 使用DOM集合<\/h2>
可以利用id<\/code>和name<\/code>属性创建DOM集合(类似数组的对象):<\/p>
<a<\/span> id<\/span>=<\/span>"x"<\/span>><a<\/span> id<\/span>=<\/span>"x"<\/span> name<\/span>=<\/span>"y"<\/span> href<\/span>=<\/span>"Clobbered"<\/span>>
<\/span><\/span><script<\/span>>
<\/span><\/span>alert<\/span>(x<\/span>.y<\/span>)  \/\/ 输出"Clobbered"
<\/span><\/span><\/span><\/span><\/script<\/span>>
<\/span><\/span><\/code><\/pre>5. 三层破坏技术<\/h2>
通过表单可以实现三层破坏:<\/p>
<form<\/span> id<\/span>=<\/span>"x"<\/span> name<\/span>=<\/span>"y"<\/span>><input<\/span> id<\/span>=<\/span>"z"<\/span>><\/form<\/span>>
<\/span><\/span><form<\/span> id<\/span>=<\/span>"x"<\/span>><\/form<\/span>>
<\/span><\/span><script<\/span>>
<\/span><\/span>alert<\/span>(x<\/span>.y<\/span>.z<\/span>)  \/\/ 输出input元素
<\/span><\/span><\/span><\/span><\/script<\/span>>
<\/span><\/span><\/code><\/pre>6. 表单控件集合<\/h2>
Chrome会将表单控件集合转换为类似数组的对象([object RadioNodeList]<\/code>)，可以使用数组方法:<\/p>
<form<\/span> id<\/span>=<\/span>"x"<\/span>>
<\/span><\/span><input<\/span> id<\/span>=<\/span>"y"<\/span> name<\/span>=<\/span>"z"<\/span>>
<\/span><\/span><input<\/span> id<\/span>=<\/span>"y"<\/span>>
<\/span><\/span><\/form<\/span>>
<\/span><\/span><script<\/span>>
<\/span><\/span>x<\/span>.y<\/span>.forEach<\/span>(element<\/span>=>alert<\/span>(element<\/span>))  \/\/ 遍历所有input元素
<\/span><\/span><\/span><\/span><\/script<\/span>>
<\/span><\/span><\/code><\/pre>7. 属性控制<\/h2>
只有HTML规范定义的属性才会成为DOM属性。可以通过以下代码查找可控属性:<\/p>
var<\/span> html<\/span> =<\/span> [...]; \/\/ HTML元素数组
<\/span><\/span><\/span><\/span>var<\/span> props<\/span>=<\/span>[];
<\/span><\/span>for<\/span>(i<\/span>=<\/span>0<\/span>;i<\/span><<\/span>html<\/span>.length<\/span>;i<\/span>++<\/span>){
<\/span><\/span>    obj<\/span> =<\/span> document.createElement<\/span>(html<\/span>[i<\/span>]);
<\/span><\/span>    for<\/span>(prop<\/span> in<\/span> obj<\/span>) {
<\/span><\/span>        if<\/span>(typeof<\/span> obj<\/span>[prop<\/span>] ===<\/span> 'string'<\/span>) {
<\/span><\/span>            try<\/span> {
<\/span><\/span>                DOM<\/span>.innerHTML<\/span> =<\/span> '<'<\/span>+<\/span>html<\/span>[i<\/span>]+<\/span>' id=x '<\/span>+<\/span>prop<\/span>+<\/span>'=1>'<\/span>;
<\/span><\/span>                if<\/span>(document.getElementById<\/span>('x'<\/span>)[prop<\/span>] ==<\/span> 1<\/span>) {
<\/span><\/span>                    props<\/span>.push<\/span>(html<\/span>[i<\/span>]+<\/span>':'<\/span>+<\/span>prop<\/span>);
<\/span><\/span>                }
<\/span><\/span>            }catch<\/span>(e<\/span>){}
<\/span><\/span>        }
<\/span><\/span>    }
<\/span><\/span>}
<\/span><\/span>console<\/span>.log<\/span>([...new<\/span> Set<\/span>(props<\/span>)].join<\/span>('\n'<\/span>));
<\/span><\/span><\/code><\/pre>8. 锚元素的特殊属性<\/h2>
锚元素的username<\/code>和password<\/code>属性可以通过FTP URL控制:<\/p>
<a<\/span> id<\/span>=<\/span>"x"<\/span> href<\/span>=<\/span>"ftp:Clobbered-username:Clobbered-Password@a"<\/span>>
<\/span><\/span><script<\/span>>
<\/span><\/span>alert<\/span>(x<\/span>.username<\/span>)  \/\/ 输出"Clobbered-username"
<\/span><\/span><\/span><\/span>alert<\/span>(x<\/span>.password<\/span>)  \/\/ 输出"Clobbered-password"
<\/span><\/span><\/span><\/span><\/script<\/span>>
<\/span><\/span><\/code><\/pre>9. 绕过URL编码<\/h2>
使用非标准协议可以避免URL编码:<\/p>
<a<\/span> id<\/span>=<\/span>"x"<\/span> href<\/span>=<\/span>"abc:<>"<\/span>>
<\/span><\/span><script<\/span>>
<\/span><\/span>alert<\/span>(x<\/span>)  \/\/ 输出"abc:<>"
<\/span><\/span><\/span><\/span><\/script<\/span>>
<\/span><\/span><\/code><\/pre>Firefox中可以使用base<\/code>标签:<\/p>
<base<\/span> href<\/span>=<\/span>"a:abc"<\/span>><a<\/span> id<\/span>=<\/span>"x"<\/span> href<\/span>=<\/span>"Firefox<>"<\/span>>
<\/span><\/span><script<\/span>>
<\/span><\/span>alert<\/span>(x<\/span>)  \/\/ 输出"Firefox<>"
<\/span><\/span><\/span><\/span><\/script<\/span>>
<\/span><\/span><\/code><\/pre>Chrome中也可以通过base<\/code>标签实现:<\/p>
<base<\/span> href<\/span>=<\/span>"a:\/\/Clobbered<>"<\/span>><a<\/span> id<\/span>=<\/span>"x"<\/span> name<\/span>=<\/span>"x"<\/span>><a<\/span> id<\/span>=<\/span>"x"<\/span> name<\/span>=<\/span>"xyz"<\/span> href<\/span>=<\/span>"123"<\/span>>
<\/span><\/span><script<\/span>>
<\/span><\/span>alert<\/span>(x<\/span>.xyz<\/span>)  \/\/ 输出"a:\/\/Clobbered<>"
<\/span><\/span><\/span><\/span><\/script<\/span>>
<\/span><\/span><\/code><\/pre>10. 多层破坏技术<\/h2>
使用iframe<\/code>和srcdoc<\/code>可以实现多层破坏:<\/p>
<iframe<\/span> name<\/span>=<\/span>"a"<\/span> srcdoc<\/span>=<\/span>"
<\/span><\/span><\/span><iframe srcdoc='<a id=c name=d href=cid:Clobbered>test<\/a><a id=c>' name=b>"<\/span>><\/iframe<\/span>>
<\/span><\/span><script<\/span>>setTimeout<\/span>(()=>alert<\/span>(a<\/span>.b<\/span>.c<\/span>.d<\/span>),500<\/span>)<\/script<\/span>>
<\/span><\/span><\/code><\/pre>或者使用样式表加载延迟:<\/p>
<iframe<\/span> name<\/span>=<\/span>"a"<\/span> srcdoc<\/span>=<\/span>"
<\/span><\/span><\/span><iframe srcdoc='<a id=c name=d href=cid:Clobbered>test<\/a><a id=c>' name=b>"<\/span>><\/iframe<\/span>>
<\/span><\/span><style<\/span>>@import<\/span> '\/\/portswigger.net'<\/span>;<\/style<\/span>>
<\/span><\/span><script<\/span>>
<\/span><\/span>alert<\/span>(a<\/span>.b<\/span>.c<\/span>.d<\/span>)  \/\/ 输出"cid:Clobbered"
<\/span><\/span><\/span><\/span><\/script<\/span>>
<\/span><\/span><\/code><\/pre>防御措施<\/h2>

使用CSP<\/code>限制内联脚本<\/li>
避免直接使用全局变量访问DOM元素<\/li>
使用document.getElementById()<\/code>等安全方法替代直接属性访问<\/li>
对用户输入进行严格的过滤和转义<\/li>
<\/ol>
DOM Clobbering是一种强大的客户端攻击技术，理解其原理和实现方式对于Web安全至关重要。<\/p>

DOM Clobbering技术详解<\/h1>

1. 什么是DOM Clobbering<\/h2> DOM Clobbering是一种利用HTML元素及其属性来覆盖或"破坏"(clobber)JavaScript全局变量或对象属性的技术。这种攻击方式在XSS和CSRF等经典客户端漏洞被修复后变得越来越重要。<\/p>

2. 基本原理<\/h2> DOM Clobbering的核心原理是：浏览器会自动将具有id<\/code>或name<\/code>属性的HTML元素作为全局变量或DOM对象的属性暴露出来。<\/p>

1. 什么是DOM Clobbering<\/h2>
DOM Clobbering是一种利用HTML元素及其属性来覆盖或"破坏"(clobber)JavaScript全局变量或对象属性的技术。这种攻击方式在XSS和CSRF等经典客户端漏洞被修复后变得越来越重要。<\/p>

2. 基本原理<\/h2>
DOM Clobbering的核心原理是：浏览器会自动将具有`id<\/code>或name<\/code>属性的HTML元素作为全局变量或DOM对象的属性暴露出来。<\/p>`