Capture and change all ajax requests' url dynamically after a page is loaded

Viewed 7

I have got a situation where I need to change request urls of all ajax requests of a page once the page is loaded. I did some research and found out that we can access some data of a request from

XMLHttpRequest.prototype.

but I can't find a way to change the url of the request.

Through the below immediately invoked function expression I get some info when the request is in progress etc but is there any way where I can redirect the request?

(function () {
  var origOpen = XMLHttpRequest.prototype.open;
  XMLHttpRequest.prototype.open = function () {
    console.log(" open request started!");
    console.log(this);
    this.addEventListener("load", function () {
      console.log(" open request completed!");
      console.log(this.readyState); //will always be 4 (ajax is completed successfully)
      console.log(this.responseText); //whatever the response was
    });
    this.addEventListener("error", function () {
      console.log("open error!");
      console.log(this.readyState); 
      console.log(this.responseText); 
    });
    this.addEventListener("abort", function () {
      console.log(" open abort!");
      console.log(this.readyState); 
      console.log(this.responseText); 
    });
    this.addEventListener("progress", function () {
      console.log("open progress!");
      console.log(this);
    });

    origOpen.apply(this, arguments);
  };
})();
0 Answers
Related