目录

实验环境：

分析：

找破坏点：

查看源码找函数：

找到了三个方法，loadComments、escapeHTM 、displayComments

loadComments

escapeHTM

displayComments：

GOGOGO 

---

实验环境：

Lab: Exploiting DOM clobbering to enable XSS | Web Security Academy (portswigger.net)

分析：

找破坏点：

第一个输入框可以看见是<texarrea>;不能插入语句.：

 构造一个语句试试

 <img src=1 οnerrοr=alert(1)>bxbxbxb

可以看到onerror被过滤掉了，所以就不能在这里注入了：

查看源码找函数：

主要看.js，因为js可能会出现DOM破坏的点；找到了这个东西，看看：

loadCommentsWithDomClobbering.js

找到了三个方法，loadComments、escapeHTM 、displayComments

loadComments

将   <>'"  过滤为实体编码；这意味着不会再走进标签开始状态，恶意代码不会在这生效了：

escapeHTM

XMLHttpRequest()这个类是js的请求方法的总结

建立了一个request请求，监听了一个onreadystatechange ，将返回的requesText用json进行解析，解析完后调用displayComments进行展示；

就是做一个提交然后解析后展示。

displayComments：

1. 获取DOM元素：首先，通过document.getElementById("user-comments")获取一个HTML元素，这个元素将作为容器来显示所有的评论。

2. 遍历评论数组：使用for循环遍历传入的comments数组，每个元素代表一个评论。

3. 创建评论部分：对于每个评论，创建一个section元素，并设置其class属性为comment。

4. 创建段落元素：在section元素内部创建一个p元素，用于显示评论内容。

5. 处理头像：获取评论中的头像URL，如果评论中没有提供头像URL，则使用默认头像。头像URL被插入到一个img标签中，并添加class="avatar"。

6. 创建头像容器：创建一个div元素，用于包含头像的img标签。

7. 将头像添加到容器中：将头像的HTML代码添加到div元素中

发现问题：

如果没有头像的话会使用默认的头像 ，如果能去到defaultAvatar这里，就有可能闭合下面的src

let defaultAvatar = window.defaultAvatar || {avatar: '/resources/images/avatarDefault.svg'}
let avatarImgHTML = '<img class="avatar" src="' + (comment.avatar ? escapeHTML(comment.avatar) : defaultAvatar.avatar) + '">';

GOGOGO 

window.defaultAvatar这个东西可以创造，如何去创造呢？

根据前面的知识，这是一个两层的层级关系，我们可以用 HTMLCollection 来操作

<a id=defaultAvatar><a id=defaultAvatar name=avatar href="cid:&quot;onerror=alert(1)//">

这里注意  "  需要进行 HTML实体编码，用 URL 编码的话浏览器会报错

Failed to load resource: net::ERR_UNKNOWN_URL_SCHEME

这样评论以后我们可以在自己的评论处看到:

<a href="cid:&quot;onerror=alert(1)//" name="avatar" id="defaultAvatar"></a>

好像并没有实现：(需要再评论一次，再次获取头像时会被   ↑  这个覆盖掉)

cid:提交一个不存在的伪协议，后面的语句不会被编码为Unicode的形式去，会顺利的进入到HTML中，随着HTML解码被解出。