这是我喜欢采用的方法;请注意,掌握 XHR 猴子补丁的黑暗艺术是一种艺术形式。
将整个套件和堆放在 IIFE 中。因此,请从以下内容开始:
(function(open, send) {
//...overrides of the XHR open and send methods are now encapsulated within a closure
})(XMLHttpRequest.prototype.open, XMLHttpRequest.prototype.send)
使用这种通用方法可以覆盖任何方法,但上述脚手架为您提供了一种覆盖(又名猴子补丁)XMLHttpRequest 的 open 和 send 方法的方法;在一个整洁的效用函数中。注意“基本”方法(来自 API 的原型对象)是如何被送入 IIFE 并分配给 var 的“打开”和“发送”,并安全地限定到功能块的范围内。
现在是胆量以及坚持猴子补丁的关键。再说一次,这就是我这样做的方式并且它有效。
一般模式(都在 IIFE 的范围内)是:
1) 复制方法及其参数,(签名,在其整体,每个规范/原型),
2)滑入你的模组,并且
3) 将您的 mod 应用到 XHR 原型属性,以确保所有 XHR 请求都通过您的代码。
例如,“打开”看起来像:
XMLHttpRequest.prototype.open = function(method, url, async, user, password) {
xhrOpenRequestUrl = url; // update request url, closure variable
open.apply(this, arguments); // reset/reapply original open method
};
不要挂断 xhrOpenRequestUrl = url; 行,此代码是从我需要 url 以供以后处理的示例中复制的。关键要点是“open.apply”,它巩固了您对 XHR 开放方法的调整,如果您不熟悉“apply”方法或“arguments”对象,那么现在是学习它们做什么的好时机.
同样对于“发送”方法......
XMLHttpRequest.prototype.send = function(data) {
//...what ever code you need, i.e. capture response, etc.
if (this.readyState == 4 && this.status >= 200 && this.status < 300) {
xhrSendResponseUrl = this.responseURL;
responseData = this.data; // now you have the data, JSON or whatever, hehehe!
}
send.apply(this, arguments); // reset/reapply original send method
}
同样,“应用”很重要,必须在所有覆盖之后完成。所以现在把它们放在一起......
(function(open, send) {
// Closure/state var's
var xhrOpenRequestUrl; // captured in open override/monkey patch
var xhrSendResponseUrl; // captured in send override/monkey patch
var responseData; // captured in send override/monkey patch
//...overrides of the XHR open and send methods are now encapsulated within a closure
XMLHttpRequest.prototype.open = function(method, url, async, user, password) {
xhrOpenRequestUrl = url; // update request url, closure variable
open.apply(this, arguments); // reset/reapply original open method
};
XMLHttpRequest.prototype.send = function(data) {
//...what ever code you need, i.e. capture response, etc.
if (this.readyState == 4 && this.status >= 200 && this.status < 300) {
xhrSendResponseUrl = this.responseURL;
responseData = this.data; // now you have the data, JSON or whatever, hehehe!
}
send.apply(this, arguments); // reset/reapply original send method
}
})(XMLHttpRequest.prototype.open, XMLHttpRequest.prototype.send)
哦,最后一件事,你的猴子补丁可以反过来被猴子补丁!为了尽量减少这种可能性,IIFE 代码应该在页面中的所有其他 JS 之后。至少所有可能会使用 XHR 的 JS,但在您可能针对的任何 AJAX 调用之前。此外,类似地,可以通过 Chrome 或 Web 扩展程序注入 XHR 猴子补丁,并覆盖您的覆盖!哈!
希望有帮助!