Phonegap Ionic - Iframe history.back(); is not working

Question

as part of my app i need to display an iframe as a page. i need to provide back and forward buttons on the page so that iframe can go back/ forward in its history.

when i try:

$scope.backiframe = function() {

  var iframe = document.getElementById('iframe');
  iframe.contentWindow.history.go(-1);
}

with my button and iframe: <a class="button button-positive" ng-click="backiframe()">back</a> <iframe id="iframe" ng-src="{{trustSrc(url)}}" scrolling="yes"></iframe>

i get the following error: Error: Permission denied to access property "history" $scope.backiframe@http://localhost:8100/js/controllers.js:1217:16 anonymous/fn@http://localhost:8100/lib/ionic/js/ionic.bundle...

does anyone know how to get iframe back/ forward to work in a phonegap ionic hybrid app?

Possible duplicate of [Error: Can't access property href](http://stackoverflow.com/questions/15703503/error-cant-access-property-href) — Shakespeare, Apr 27 '16 at 12:35

score 0 · Answer 1 · edited Jun 20 '20 at 09:12

If the URL you are trying to access in your iframe is outside of your current page domain then you will not be able to do it. Modern browsers implement a Same Origin Policy which decides the permissions of JavaScripts when running cross site scripting.

When a parent and child come from the same domain, they have access to each other; the child can access and operate properties and methods of the parent, and vice-versa. However, when they don't, attempting such access so will trigger script errors indicating Permission denied.

You cannot access the history of the iframe if it is hosted elsewhere due to browser security restrictions. The Same Origin Policy is preventing you from going back.

Here's a couple of other related questions: -

Phonegap Ionic - Iframe history.back(); is not working

1 Answers1