跨站攻击_XSS跨站攻击之静态脚本拦截

MutationObserver

MutationObserver 是 html5 新增的 API，功能很强大，给开发者们提供了一种能在某个范围内的 DOM 树发生变化时作出适当反应的能力。

说的很玄乎，大概的意思就是能够监测到页面 DOM 树的变换，并作出反应。

MutationObserver() 该构造函数用来实例化一个新的Mutation观察者对象。

目瞪狗呆，这一大段又是啥？意思就是 MutationObserver 在观测时并非发现一个新元素就立即回调，而是将一个时间片段里出现的所有元素，一起传过来。所以在回调中我们需要进行批量处理。而且，其中的 callback 会在指定的 DOM 节点(目标节点)发生变化时被调用。在调用时,观察者对象会传给该函数两个参数，第一个参数是个包含了若干个 MutationRecord 对象的数组，第二个参数则是这个观察者对象本身。

所以，使用 MutationObserver ，我们可以对页面加载的每个静态脚本文件，进行监控：

上面的代码中，我们判断一个js脚本是否是恶意的，用的是这一句：

当然实际当中，注入恶意代码者不会那么傻，把名字改成 XSS 。所以，我们很有必要使用白名单进行过滤和建立一个拦截上报系统。

这里我们已经多次提到白名单匹配了，下文还会用到，所以可以这里把它简单封装成一个方法调用。

上面使用 MutationObserver 拦截静态脚本，除了静态脚本，与之对应的就是动态生成的脚本。

该特性已经从 Web 标准中删除，虽然一些浏览器目前仍然支持它，但也许会在未来的某个时间停止支持，请尽量不要使用该特性。

虽然不能用，也可以了解一下

然而可惜的是，使用上面的代码拦截动态生成的脚本，可以拦截到，但是代码也执行了:DOMNodeInserted 顾名思义，可以监听某个 DOM 范围内的结构变化，与 MutationObserver 相比，它的执行时机更早。

但是 DOMNodeInserted 不再建议使用，所以监听动态脚本的任务也要交给 MutationObserver。

可惜的是，在实际实践过程中，使用 MutationObserver 的结果和 DOMNodeInserted 一样，可以监听拦截到动态脚本的生成.