Bypass same origin frame

Let’s say you want to execute JavaScript code after a redirect

If you use document href you won’t be able to that.

If you try with a frame the same origin will block you

Here below a practical solution!

document.getElementById("idButton").onclick=async ()=>{ 
  var myUrl = document.getElementById("myUrl").value;
  console.log(myUrl);
  var frame = document.getElementById("frame"); 
  var x = await fetch(myUrl);
  var html = await x.text(); 
  
  document.write(html);
  console.log("document written ");
 
  
  console.log('DOM is ready.');
  document.querySelector("[subscriptions-section='content']").removeAttribute("subscriptions-section");
};


Of course this is a practical solution for a specific goal and it is valid in the context of those requirements. There is no “one fits all” way to do things.

The fetch request could be blocked by cors on server in same cases, so one can resort to proxy like that

 myUrl = "https://api.codetabs.com/v1/proxy?quest=" + myUrl; 

Another free option with cloudflare for the fetch is a serverless worker.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s