Navigating an external iframe's history

Question

As a temporary transition from a series of old sites to a single new site, I'm having to display multiple websites in iframes, and I'm using jQueryUI's tabs to make it not look horrendous.

However, since there are multiple tabs, the browser history buttons might get confusing and annoying, so I'm trying to get forward/back buttons atop each tab to navigate their history.

The problem is, they're all external URLs, and I'm running into the usual security issues of XSS. My current attempt is

jQuery('#'+id).contents()[0].history.back();

However, as expected, I don't have permission to access the external document's history property.

The only other solution I can think of is tracking the iframe's src every time it changes, keeping it in a list, and changing it from that every time. I'd rather avoid this messy approach, if possible.

So, how can I navigate the history of an external iframe, getting around the XSS security?

Answer 1

Maybe this is overkill but if you are out of ideas, you could try loading these external sites using something like PHP's CURL library so that they would all be from the same domain.

Answer 2

You could keep track of the source in the iframe as the user moves around then use that list as needed....yes i am fully aware this is the alternate approach you suggested, sorry man, but i don't believe there is another way, good luck with that approach though.