Difference Between Document. Referrer and Window. Parent. Location. Href
Here's the Situation: There Is a Site, and It Belongs to the Client, So It's Not on My Domain, Lets Say Client. Com. on This Site There Is an Iframe, the...
Here's the situation: there is a site, and it belongs to the client, so it's not on my domain, lets say client.com.
On this site there is an iframe, the source of this iframe is a simple js code, which loads another js (client.js) - this code is on my domain.
What I need to do is to get the exact url of the page where the iframe is. So now I'm trying to fugure out the difference between document.referrer and window.parent.location.href with no luck.
Both give me exactly what I need, but I can't realize what is more reliable? Is there a situation, where one will work and another won't?
3 Answers
document.referrer gives you the URI of the page that linked to the current page. This is a value that's available for all pages, not just frames.
window.parent gives you the parent frame, and its location is its URI.
If you want to find the URI of the parent frame, then use window.parent.location.
The main difference is that the document.referrer will point to the page which linked to the current page inside the iframe. If your iframe content contain links, which allows to navigate through a few pages, then only the first page loaded inside the iframe will have parent frame URI as document.referrer.
Each page loaded by clicking link inside the iframe will have the uri of the page containing link in the document.referrer.
At the same time window.parent.location will always contain the URI of the page in parent window, but it will be accessible only if the site origin is the same.
Read about relaxing site origin policy to see what should be done on both your and your client sites, so you can access the data.
That being said, I would rather give your client something like a service key or token, which will authorize his site to use your iframed app, and which will authenticate the caller as your client, so you can know that the call is from his site.
"document.location.ancestorOrigins" is more feasible option.
David Miller brings 15 years of experience in global economics, personal finance strategy, and market dynamics. He specializes in turning complex economic trends into actionable insights for everyday readers.
