I have a reactjs website, that uses react-router with browserHistory.
Today I found an issue and I have no clue how to solve this.
The problem is, when my website is opened inside an iframe, for example in google translate page. Navigation in my website no longer works everytime a link is clicked it gives me this error:
Uncaught DOMException: Failed to execute 'pushState' on 'History': A history state object with URL 'https://www.mywebsite.com/page' cannot be created in a document with origin 'https://translate.googleusercontent.com' and URL 'https://translate.googleusercontent.com/translate_c?depth=2&hl=fr&prev=sear….com&sl=en&u=https://www.mywebsite.com/&usg=ALkJrhiWY47c812s4y3W0cS1VDZX0xRNqA'.
Does anyone knows how can I 'fix' this?
Btw, I've tested this using the latest version of Chrome, and Firefox (both on Windows)
This is a security design. You cannot push history state cross-domain.
Mozilla documents this limitation pretty well here: https://developer.mozilla.org/en-US/docs/Web/API/History_API