Search code examples
javascriptbrowserbrowser-historyhtml5-history

How to change main URL in reason of navigation at iframe?


I tried this, but users need to click back button twice, one to change the back the hash and another to back the iframe content:

(TypeScript)

this.iframeApp.load(() => {
    if (this.sameDomain()) {
        window.location.hash = this.iframeApp[0].contentWindow.location.toString();
    } else {
        window.location.hash = this.iframeApp.prop('src');
    }
});

And at start:

var url = window.location.hash;
if (url.length > 1) {
    url = url.substring(1);
} else {
    url = this.settings.default;
}
this.openPage(url);

I think History Api won't help. I need something that works on IE9


Solution

  • Try this:

    this.iframeApp.load(() => {
        if (this.sameDomain()) {
            window.location.replace(window.location.toString() + '#' + this.iframeApp[0].contentWindow.location.toString());
        } else {
            window.location.replace(window.location.toString() + '#' + this.iframeApp.prop('src'));
        }
    });
    

    By using the replace() method, you can't go back to thre previous url, so your users will only need to push the back button once.