Search code examples
iframesame-origin-policy

How do I load iFrame resources, that have a different origin?


I'm working on a project, that uses a third-party ticketing product which provides iFrames as part of their service. This product's admin portal provides the means to upload resources (css, js, fonts, etc), that are injected into the head of the generated iFrames.

However, I need to be able to style these iFrames and manually re-uploading the necessary resources, each time I want to test something, is obviously far from ideal. I don't have full control of how these iFrames are generated; I do, however, have the option to add custom inline resources into the document head.

The issue is, whenever I try and include a resource (usually hosted on a test domain), as it's not on the same domain as the iFrame itself, I get the error: Referrer Policy: strict-origin-when-cross-origin.

Is there any way that I can somehow inject/load a resource that bypasses this?


Solution

  • I found a working answer on another post here. For clarity, here is what the post says at the time of writing:


    For windows users with Chrome Versions 60.0.3112.78 (the day the solution was tested and worked) and at least until today 19.01.2019 (ver. 71.0.3578.98). You do not need to close any chrome instance.

    1. Create a shortcut on your desktop
    2. Right-click on the shortcut and click Properties
    3. Edit the Target property
    4. Set it to "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir="C:/ChromeDevSession"
    5. Start chrome and ignore the message that says --disable-web-security is not supported!

    BEWARE NOT TO USE THIS PARTICULAR BROWSER INSTANCE FOR BROWSING BECAUSE YOU CAN BE HACKED WITH IT!


    I can confirm that this method still works now using version 106.0.5249.119 (Official Build) (64-bit). I also had to change the file path slightly to C:\Program Files\Google...