I am using iframe-resizer for cross domain application, The Iframe loads fine inside the application but when I click on a button which has redirection to other URL on the Iframe application, it is giving me error :
Failed to execute 'postMessage' on 'DOMWindow': The target origin provided () does not match the recipient window's origin ().
I have given src of Iframe like https://example.com, now the home page on example.com is loading fine but when I redirect to other page which has URL like https://example.com/product/details then above error is coming.
I have upgraded to 4.1 version of library and issue is resolved however its still showing the error on console. Now I am facing the issue that I can't get the URI of parent application inside the page after redirection.
I am using document.referrer to get it which works fine on main page of Iframe but not on other pages after redirection, I am also facing issue with height on redirected page on mobile devices which is showing a long blank space and reason is all child pages are picking height of main page of Iframe and not adjusting height.
Both the appliction are hosted on IIS and are under our control. Any help/sugesstion will be highly appreciated.
I used window.postMessage from parent app to post a message to child iframe app and using the property event.origin able to get the URI of parent app which is hosting the Iframe as when redirection happen the it was taking the child app page as its parent which was giving the wrong URI.
Parent app:
var frame = document.getElementById('wizardIframe');
frame.contentWindow.postMessage(window.location.href, '*');
Child page
window.addEventListener('message', function (event) {
window.iFrameResizer = {
targetOrigin: event.origin
}