一道有趣的XSSChallenge

早上刷某特时推送了三上悠ya的动态，猛点双击后却发现是pwnfunction更新了一道xss-challenge的wp(上当了上当了)。看了下题目难度是hard，质量很高，考点也很有趣。官方wp的payload和解题思路看起来不是很复杂，实际上还是隐藏了很多知识点，如果大家复现这个题目，希望这篇文章能够对你有帮助。

题目信息

题目名称:WW
题目难度:Hard
题目地址:https://xss.pwnfunction.com/challenges/ww3/
思路:bypass DOMPurify+DOM clobbering

可控的输入的点有两个text，img

let text = new URL(location).searchParams.get('text')
let img = new URL(location).searchParams.get('img')


img作为img标签的src属性被写入，且被过滤了关键符号。


const escape = (dirty) => unescape(dirty).replace(/[<>'"=]/g, '');


text作为文本被渲染，渲染前都经过一次DOMPurify.sanitize处理

//part1
document.write(
...
Creating meme... (${DOMPurify.sanitize(text)})
)
//part2
html = (`

DOMpurify bypass via Jquery.html()

乍一看经过DOMPurify后的这些交互点都很安全，但是使用html()解析会存在标签逃逸问题。

题目作者在wp中提到了两种解析html的方式:jquery.html&innerhtml。innerHTML是原生js的写法，Jqury.html()也是调用原生的innerHTML方法，但是加了自己的解析规则(后文介绍)。

关于两种方式:Jquery.html()和innerHTMl的区别我们用示例来看。

对于innerHTML：模拟浏览器自动补全标签，不处理非法标签。同时，


对于Jqury.html()，最终对标签的处理是在htmlPrefilter()中实现:jquery-src，其后再进行原生innerHTML的调用来加载到页面。

rxhtmlTag = /<(?!area|br|col|embed|hr|img|input|link|meta|param)(([a-z][^/>x20trnf]*)[^>]*)/>/gi
/<(?!area|br|col|embed|hr|img|input|link|meta|param)(([a-z][^/>x20trnf]*)[^>]*)/>/gi
jQuery.extend( {
htmlPrefilter: function( html ) {
return html.replace( rxhtmlTag, "<$1>" );
}
...
})
tmp.innerHTML = wrap[ 1 ] + jQuery.htmlPrefilter( elem ) + wrap[ 2 ];


有意思的是，这个正则表达式在匹配<*/>之后会重新生成一对标签(区别于直接调用innerHTML)

所以相同的语句




不过我们依然可以借助标签的name属性值，为document对象创造一个变量document.notify，熟悉dom-clobbing的都很了解这种方式也常用来覆盖document的各种属性/方法。然而这道题不需要覆盖什么，我们就先把它当作一种创造变量的手段，后文再讲。我们先看简单了解一下JS的作用域

JS作用域&作用域链

在JS的函数中，一个变量是否可访问要看它的作用域(scope)，变量的作用域有全局作用域和局部作用域(函数作用域)两种，关于详细的介绍可以移步之前博客的小记：深入Javascript-作用域&Scope Chain，这里举个最简单的例子如下

function init() {
var inVariable = "local";
}
init();
console.log(inVariable); //Uncaught ReferenceError: inVariable is not defined


这就是因为函数内部用var声明的inVariaiable属于局部作用域范畴，在全局作用域没有声明。我们可以这样理解：作用域就是一个独立的地盘，让变量不会外泄、暴露出去。也就是说作用域最大的用处就是隔离变量，不同作用域下同名变量不会有冲突

在寻找一个变量可访问性时根据作用域链来查找的，作用域链中的下一个变量对象来自包含（外部）环境，而再下一个变量对象则来自下一个包含环境。这样，一直延续到全局执行环境；全局执行环境的变量对象始终都是作用域链中的最后一个对象。

而在Javascript event handler(时间处理程序)中，也就是onxx事件中(这块地盘)，scope chain的调用就比较有意思了。它会先去判断当前的scope是否有局部变量notify，若不存在向上查找window.document.notify，仍不存在继续向上到全局执行环境即window.notify为止。

这样说起来可能有点绕，我们来看下面这个例子就明白了

//pig
//dog