Question

我正在尝试创建一个脚本，当在当前页面上接收到数据时，该脚本将返回响应。（收到新数据>将其内容记录到控制台）

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState == XMLHttpRequest.DONE) {
        console.log(xhr.responseText);
    }
}
xhr.prototype.open = (function(fopen){
    return function(){
        console.log("Data received.");
        return fopen.apply(this,arguments); 
    }
})(XMLHttpRequest.prototype.open);

上面的脚本就是这个脚本。（source）

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState == XMLHttpRequest.DONE) {
        console.log(xhr.responseText);
    }
}
xhr.open('GET', 'http://example.com', true);
xhr.send(null);

使用此脚本合并。（source）

XMLHttpRequest.prototype.open = (function(fopen){
return function(){
    console.log("Data received.");
    return fopen.apply(this,arguments); 
}
})(XMLHttpRequest.prototype.open)

我想知道我做错了什么以及如何使它起作用。谢谢！

Answer 1

您要分配给实例化对象的prototype属性，而不是XMLHttpRequest的原型。您可能要改XMLHttpRequest.prototype.onreadystatechange：

Object.defineProperty(XMLHttpRequest.prototype, 'onreadystatechange', {
  set: function(listenerFn) {
    this.addEventListener('readystatechange', function(...handlerArgs) {
      if (this.readyState == XMLHttpRequest.DONE) {
        // Custom action:
        // console.log(xhr.responseText);
        console.log('Detected a new response');
        // Run the previous callback that was passed in:
        listenerFn.apply(this, handlerArgs);
      }
    });
  }
});

const xhr = new XMLHttpRequest();
xhr.open('GET', 'https://stacksnippets.net');
xhr.onreadystatechange = () => console.log('handler running');
xhr.send();

这当然不完全符合规范，这只是一个猴子补丁的示例。（不过，更改XMLHttpRequest.prototype之类的内置对象是一种不好的做法，请考虑避免使用它）

Answer 2

这将记录所有xhr请求

XMLHttpRequest.prototype.send = (function(fsend){
  return function(){
    this.addEventListener('load', function(){
      console.log("Data received.", this.response)
    }, {once: true})
    return fsend.apply(this, arguments); 
  }
})(XMLHttpRequest.prototype.send);

xhr = new XMLHttpRequest
xhr.open('GET', 'https://httpbin.org/get')
xhr.send()

获取XMLHttpRequest对收到的每个数据的响应

2 个答案: