Ist es möglich, XMLHttpRequest.prototype.open() zu ändern?

Question

Ich versuche, Rückrufe in XMLHttpRequest.prototype.open() zu injizieren, so kann ich die Methode und die URL kennen, sowie einen Zeitstempel für den Leistungsbericht Einstellung (allein mit dem modifizierten XMLHttpRequest.prototype.send()).

Hier ist, was ich bisher kam:

function addXMLRequestCallback(open, callback) { 
    var nativeOpen, nativeSend, i; 
    if (XMLHttpRequest.callbacks) { 
     XMLHttpRequest.callbacks.push(callback); 
    } else { 
     XMLHttpRequest.callbacks = [callback]; 
     nativeOpen = XMLHttpRequest.prototype.open; 
     XMLHttpRequest.prototype.open = function() { 
      open.forEach(function(item) { 
       // not sure what to do here... 
      }); 
     } 
     nativeSend = XMLHttpRequest.prototype.send; 
     XMLHttpRequest.prototype.send = function() { 
      for (i = 0; i < XMLHttpRequest.callbacks.length; i++) { 
       XMLHttpRequest.callbacks[i](this); 
      } 
      nativeSend.apply(this, arguments); 
     } 
    } 
} 
addXMLRequestCallback(function(method,url){ 
    // Maybe instead I should put code here... 
}, function(xhr) { 
    // then do something here? 
}); 

Answer 1

Was Sie mit dem send Methode hatte der richtige Ansatz war. Im folgenden Ausschnitt I inplemented nur einen Zuhörer, der, wenn ein XMLHttpRequest ‚s open aufgerufen wird Methode aufgerufen wird. Ich bin sicher, dass Sie dasselbe für send implementieren können.

(function() { 
 
    var nativeOpen = XMLHttpRequest.prototype.open; 
 
    var callbacks = XMLHttpRequest.callbacks = []; 
 
    XMLHttpRequest.prototype.open = function() { 
 
    callbacks.forEach(callback => callback.apply(this, arguments)); 
 
    nativeOpen.apply(this, arguments); 
 
    }; 
 
})(); 
 

 
function addXHROpenCallback (cb) { 
 
    XMLHttpRequest.callbacks.push(cb); 
 
} 
 

 
addXHROpenCallback(function (method, url) { 
 
    console.log(`XHR opened. Method: ${method}, URL: ${url}`); 
 
}); 
 

 
var xhr = new XMLHttpRequest(); 
 
xhr.open('GET', 'http://example.com');

aber fragen Sie sich, wenn Sie wirklich ein eingebautes in Prototyp ändern müssen. Erwägen Sie, eine Wrapper-Klasse zu erstellen, die das Gleiche tut, ohne jedoch einen Prototyp zu ändern.