Difference between document.referrer and window.parent.location.href - javascript

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?

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.

Related

Redirecting to a web without changing the URL

I wants to redirect my users who opens my web page to a new page but i also wants that if the user see the URL of the page in the url bar then the url of the first page should be visible.
For example,let i have a web named http://example.com and i wants that every users that visits should be redirected to http://google.com but also when he see the URL of the page in the URL bar then it should show example.com.
I there's any way to does it?
You can create an iframe which can load any website inside of it. For your question you will need to add the following code to your page:
<iframe src="http://www.google.com"></iframe>
You can then adjust other attributes of the iframe with width, height, etc.
More information on available attributes for the iframe element can be found here: http://www.w3schools.com/tags/tag_iframe.asp
Alternatively, If you have access to your DNS provider and your DNS provider supports it, you may also be able to use domain masking.
Domain masking, means that visitors to your website will only see the domain name (or URL) they typed in the address bar of their browser, not the domain name where you have forwarded them.
Specific instructions on how to do this cannot be given without knowing who your DNS provider is.

Cross-domain JavaScript iFrame-parent access blocked

I'm designing some "add-on" to certain websites, which should be embedded in them as an iframe. Inside this iframe there is a clickable button aimed at changing the iframe's position within the parent website.
Since things are done in coordination with the parent website, I am able to add some code there as well. However it seems I am not able to do neither of the following (one of them should suffice):
From the iframe, access data within the parent.document, in order to move the iframe to the desired position.
From the parent website, access data within the iframe, in order to check when the button is clicked.
Both typically produce an error: "Blocked a frame with origin XXX from accessing a frame with origin YYY. Protocols, domains, and ports must match".
Any advice (preferably with code sample) is appreciated.
After doing lots of searching around, I came across this:
http://www.codeproject.com/Tips/585663/Communication-with-Cross-Domain-IFrame-A-Cross-Bro
I actually tested the method (using my own short piece of code) and it seemed to work on Chrome, Firefox and IE. Now I'm gonna try the "real" implementation...
From what I understand based on the information you've provided in your question, cross domain scripting is not possible. What you would need to do is provide a script that the parent-level website can paste into their template/html and run from their domain, similar to how Google does with their analytics system.
As an alternative, try turning your iframe content instead, into a div loaded with the response from a service call made from the parent domain to the iframe domain. You would most likely need to create an API that a requesting site can use. Simply call that URI with whatever parameters you would use when referencing the page you wanted to load in the iframe, and have the script that you run on the parent website handle all the DOM alterations you want to achieve.

Show content from other website and track the URL

On my JSF page I am trying to show some other website in an iframe and show its URL. I understand now that for security reasons I can only access the URL of the iframe if it is showing some site of my domain. So, I've found that problem a lot of times in the internet, but I couldn't find any solution. I don't want to read the content of the iframe, but only the URL.
Is there any solution for this requirement? Using an alternative to iframes? Frameset, browser in browser? Popup?
If you want to stick to the iframe option, I would test to see if the innerhtml of the iframe matches that of the website they are meant to reach. The innerhtml in webkit does seem to change as the user browses.
The only alternative I can think of is http proxying the web sites, changing the links to refer to your proxy, then telling them they win when the requested proxy URL matches that of the destination.

How can an iFrame from another domain get rid of itself?

I am building a bookmarklet for various sites that functions basically like this:
User navigates to foo.com (an external site not on my control)
User clicks a bookmarklet on his browsers that grabs some information from foo.com and displays it on a form in bar.com inside an iframe
User submits the form inside bar.com which is inside foo.com
The iframe dissapears
The problem is getting the iFrame to remove itself. Since I can't access a function inside a parent domain in another domain I cannot create a custom function parent.removeIFrame() or even do a window.top.location.reload(). I tried many techniques but all of them fail because of cross domain scriptings.
The way I solved it was to change the top.location.href to a custom page I built at bar.com/back.html in which all it does is simply to send a single "history.back()" command that bounces the user on the original page. Althought creative, I don't think it's very elegant solution. Is there a better way?
You can try fragment identifier for cross domain messaging. There is a YUI library for it: http://www.julienlecomte.net/blog/2007/11/31/
When you injected the JS code to create the form on the site's page you can have it poll (js outside of the newly created iframe) your server to know when to remove the iframe. You can use all kinds of methods of doing this including jsonp, long polling, post message, fragment identifiers, etc. You do not need to load a big library for this - the smaller the better for bookmarklets.

Is it possible to hide/close an iframe from within itself or on server side?

Suppose I have a page that I am writing a javascript plugin for on the domain first.com. The javascript plugin injects an iframe pointing to a login page (of domain second.com) into the first.com page and displays it as a popup so that the user can login.
Is there anyway for me to hide/close the iframe after the user logs in with it? I can inject any javascript necessary into the first.com page and I control both the client and server side code on the login page within the iframe.
The main issue is that the iframe cannot access it's parent window to hide itself and the parent window cannot see any changes made in the contents of the iframe because of the same origin policy. Is there anyway around this or should I just lose the iframe idea and instead open a new window?
If the developer of second.com can be convinced to load an iframe in their login page, which loads a page at first.com, the the inner iframe can call javascript on the outer, since they are both from first.com. You can pass parameters in this way too, through the url of the inner iframe. An example here.
I think the issue you're running into is the browser stopping the cross-domain communication from happening. There is a way to sign your javascript but it is pretty much breaking the browser security model and isn't suggested unless absolutely necessary.
Is there any way that the login form is based on URL submition? You could create a simple sign in form and use AJAX to get your response back to ensure a successful login. This solution depends on having a RESTful login and again, I'm not sure about the implementation of your second.com.
If you're wondering about how to use the ajax to submit a form, I'd check this out (it is in jQuery but it applies to just about any framework.) View the source on that and see if that could work in your situation.

Categories

Resources