How do I get the URL of an iframe

Newb-Man · #1 (**permalink**) 01-04-09, 01:54 PM

Hey, I find myself in the same bind as these folks down in a quite old (and very dead) post. The problem involves not being able to get the updated url of a frame. It is easy to find the url, but when I try to update it on page change, I get access errors

Here's the article

The current code I use looks like this.

Frameset

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Thank you for surfing 2 save...</title>
<script type="text/javascript">
function CheckURL()
{
    parent.topFrame.makeitupdate();
    

}
</script>
</head>

<frameset rows="132,*" cols="*" framespacing="0" frameborder="no" border="0">
  <frame src="surfframe.html" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" title="surf2save" style="height:132px;" />
  <frame src="content.html" name="mainFrame" id="mainFrame" title="content" onLoad="CheckURL()" />
</frameset>

<noframes>


<body>



</body>
</noframes>
</html>

topFrame

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Surf2Save</title>

<script type="text/javascript">
//<![CDATA[


function GoToLocation()
{
    var GoToPage = document.getElementById('GoToPage');
    window.top.mainFrame.location=GoToPage.value; 
}

function makeitupdate()
{

    
    alert(parent.mainFrame.location);

}
//]]>
</script>

</head>

<body>


<div style="text-align:center">
    
    <input type="text" name="GoToPage" id="GoToPage" class="url" value="http://google.com" /><a href="#" onClick="GoToLocation();" ><img src="go.png" class="go" alt="Surf2Save" /></a>

    
</div>


</body>
</html>

Many Many Thanks in Advance

Yeroon · #2 (**permalink**) 01-05-09, 09:24 AM

Hi,

If the page loaded in the Iframe is not on the same domain as the page holding the frame you will get the Access denied error. This is a security measure implemented by browers. You can't work around this (not that I know of).

So mainpage is: www.somedomain.com/index.html

Iframe src is: www.otherdomain.com/page.html

Then you can ask for url, call events etc.

You can only access properties and events of iframe pages if they are on the same domain.

Sephr · #3 (**permalink**) 01-08-09, 10:17 PM

Quote:

Originally Posted by Yeroon

Then you can ask for url, call events etc.

You can only access properties and events of iframe pages if they are on the same domain.

If the website the user is on is owned by the same guy who owns the first domain, he could just set up message listeners and send messages (using postMessage) to each other.
Example:
http://example.a/ sends:

Code:

SomeIframe.postMessage(
JSON.stringify({
"request-var": "location.href"
}),'http://example.b');

http://example.b/ responds:

Code:

window.onmessage = function(e) {
  if (e.origin == 'http://example.a') {
    var requestVar = JSON.parse(e.data)['request-var'];
    e.source.postMessage(JSON.stringify(window[requestVar]), e.origin);
  }
}

The code either requires a Gecko-based browser (which includes the JSON object as of 1.9.1, ie. Firefox 3.1+) or json2.js to have been loaded beforehand.

postMessage will only work in Safari 3.1.2+, Firefox 3+, and IE8 beta 2.