I want my facebook canvas app to be able to update the address bar URL when changing context. So, for example, if my app's home URL is https://apps.facebook.com/myapp/
, and the user clicks on some item on the home screen, I'd like the URL shown in the address bar to change to https://apps.facebook.com/myapp/1/
or https://apps.facebook.com/myapp/#1
.
Normally, my app could do that with HTML5's history.pushState()
. Problem is, the canvas app runs inside an iframe, and cannot access the parent window's pushState
(because the iframe is not the same domain as apps.facebook.com). Another technique should be changing just the hash part of the address, i.e. window.location.hash = "1"
, but that too is not possible from within the iframe, for the same reason.
It is possible to change the parent page URL with reloading the entire page, by using
window.parent.location = "https://apps.facebook.com/myapp/1/"
However, this would cause the parent page to reload, taking up a good number of seconds, and then reload the iframe - all in all, a very long and frustrating experience for the user.
Could there be a way of doing this I haven't thought of?