Skip to content
Advertisement

JavaScript – Stop redirection without user intervention and get destination URL

I want to run some JS in a webpage so I can click elements that will take me to another webpage and do 2 things:

  1. Get the destination URL.
  2. Stop the redirection.

So far I read about adding an event listener to stop redirection:

window.addEventListener('beforeunload', function (e) {
    // Cancel the event
    e.preventDefault(); // If you prevent default behavior in Mozilla Firefox prompt will always be shown
    // Chrome requires returnValue to be set
    e.returnValue = '';
});

but there’s always a popup and I cannot figure out the destination address.

Edit:

I was able to obtain the destination URL from the microservice by intercepting the XMLHttpRequests so the first problem is solved … redirection is still an issue.

const xhrOpen = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function(method, url, async, user, pass) {
    if (method === "GET") {
        const urlQuery = "some_discrimination_factor";
        const urlPropertyName = "redirection_url";
        if(url.endsWith(urlPropertyName)) {
            this.onload = function(){
                const response = JSON.parse(this.responseText);
                if (response.hasOwnProperty(urlPropertyName)) {
                    console.log(response[urlPropertyName]);
                }
            };
        }
    }
    xhrOpen.call(this, method, url, async, user, pass);
};

Here’s the same thing but using DOM Level 2 Events:

let xhrListener; //use only to avoid multiple listeners error while debugging
const xhrOpen = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function(method, url, async, user, pass) {
    if (method === "GET") {
        const urlQuery = "some_discrimination_factor";
        const urlPropertyName = "redirection_url";
        if(url.endsWith(urlPropertyName)) {
            if (xhrListener) { //use only to avoid multiple listeners error while debugging
                this.removeEventListener("readystatechange", xhrListener);
            }
            this.addEventListener("load", function nonAnonymWrap(e){
                xhrListener = nonAnonymWrap;//use only to avoid multiple listeners error while debugging
                const response = JSON.parse(this.responseText);
                if (response.hasOwnProperty(urlPropertyName)) {
                    console.log(response[urlPropertyName]);
                }
            });
        }
    }
    xhrOpen.call(this, method, url, async, user, pass);
};

Advertisement

Answer

Ockham’s razor:

Entities should not be multiplied without necessity.

Being new to JavaScript’s rabbit hole I started going heavy on XMLHttpRequest but apparently something simpler was sufficient for my case:

//backup original function in case redirection is needed later
const windowOpen = window.open;
let isRedirectionEnabled = false;
window.open = function() {
    //destination URL obtained without redirection
    let targetUrl = arguments[0]; 
    console.log(targetUrl);
    if(isRedirectionEnabled) {
        windowOpen.apply(this, arguments);
    }
};
User contributions licensed under: CC BY-SA
3 People found this is helpful
Advertisement