你有用过 JavaScript 中的函数劫持么?

网站建设3年前发布
83 0 0

最近业务上看到一段逻辑,找了好久,没发现它是怎么被触发的,后来发现其实使用了函数劫持,大致如下:,大致实现的逻辑就是在每次调用保存日志的同时执行自己的逻辑,比如格式化、通知等。,函数劫持,在一个函数运行之前就把它劫持下来,添加我们想要的功能。当这个函数实际运行的时候,它已经不是原本的函数了,而是被我们添加上去的功能。这也是我们常见的钩子函数的原理之一。,如上面的示例,一般函数劫持会分成三步 :,为什么可以这么做?,一开始,我看上面这段代码还有疑惑,当重新给 saveLog 赋值的时候,不会改变 originSaveLog 的引用指向么?事实上是不会的,只会将 saveLog 指向另外一个引用地址。,可以看下面的例子就很容易理解了:,基础:两个对象指向同一个地址的时候,修改某个对象的属性,另外一个对象也会随之变化,基础:将新的对象赋值给对象变量的时候,该对象变量就指向了新对象的引用地址,跟旧引用切断关联,如上面的第一个例子,在原有的函数之上,实现特定的逻辑。,一般 XSS 攻击会先利用 alert() 等方法输出信息进行测试,这个时候,我们可以对原先的 alert() 进行劫持,向其输入追踪信息的代码,最后才把原函数执行。,如下所示:,mock.js 中,就是通过对原生的 XMLHttpRequest(或 ActiveXObject)进行劫持,判断有没有找到匹配的数据模板,如果找到,则拦截 XHR 请求逻辑,执行自身规则对应的逻辑。如果未找到匹配的数据模板,则采用原生 XHR 发送请求。详细代码看这里[1]。,JavaScript 中的函数劫持是一个增强原有函数的技巧,一般我们用来对原有的 JavaScript 全局方法做一些能力的增强。,参考资料,[1]这里: https://github.com/nuysoft/Mock/blob/refactoring/src/mock/xhr/xhr.js

© 版权声明

相关文章