拦截XMLHttpRequest并修改responseText

  • Z时代
  • 2024-01-10
  • 分类：问答

我正在尝试构建一个脚本，该脚本将充当本机XMLHttpRequest对象的代理/包装器，使我能够对其进行拦截，修改responseText并返回到原始的onreadystatechange事件。

如果应用正在尝试接收的数据在本地存储中已经存在，则上下文将中止XMLHttpRequest并将本地存储的数据传递回应用成功/失败回调方法。假设我无法控制应用程序现有的AJAX回调方法。

我最初尝试过以下想法。

var send = XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send = function(data){
   //Do some stuff in here to modify the responseText
   send.call(this, data);
};

但是正如我现在确定的那样，responseText是只读的。

然后，我尝试退后一步，向编写自己的完整本机代理XMLHttpRequest，最终最终编写了自己的本机方法版本。类似于此处讨论的内容…

http://www.ilinsky.com/articles/XMLHttpRequest/#implementation-

wrapping

但是它很快变得令人困惑，并且仍然难以将修改后的数据返回到原始onReadyStateChange方法中。

有什么建议？这有可能吗？

回答：

//
// firefox, ie8+
//
var accessor = Object.getOwnPropertyDescriptor(XMLHttpRequest.prototype, 'responseText');
Object.defineProperty(XMLHttpRequest.prototype, 'responseText', {
    get: function() {
        console.log('get responseText');
        return accessor.get.call(this);
    },
    set: function(str) {
        console.log('set responseText: %s', str);
        //return accessor.set.call(this, str);
    },
    configurable: true
});
//
// chrome, safari (accessor == null)
//
var rawOpen = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function() {
    if (!this._hooked) {
        this._hooked = true;
        setupHook(this);
    }
    rawOpen.apply(this, arguments);
}
function setupHook(xhr) {
    function getter() {
        console.log('get responseText');
        delete xhr.responseText;
        var ret = xhr.responseText;
        setup();
        return ret;
    }
    function setter(str) {
        console.log('set responseText: %s', str);
    }
    function setup() {
        Object.defineProperty(xhr, 'responseText', {
            get: getter,
            set: setter,
            configurable: true
        });
    }
    setup();
}

以上是 拦截XMLHttpRequest并修改responseText 的全部内容， 来源链接： utcz.com/qa/433139.html

回到顶部