I am writing a plugin for wordpress, and I provide a way for users to log in to my service, when they click on log in a popup opens with the service's website (which is on a different url than the wordpress blog).
So to avoid cross domain errors, I use postMessage This works great but the second argument of postmessage is the domain name of the website to send the data to.
I did a lot of research and all the examples seem to hardcode the domain name directly into it, but since it's a wordpress plugin, any domain can go there.
So I want to get the domain name of the parent window (the one who opened the popup).
I noticed that firefox manages to extract the url
when using the developer tools but I can't seem to manage to do it myself as almost all the properties are restricted.
So how can I get the url/domain name of the parent window for my popup?
The Same Origin Policy forbids JavaScript access to the location of a page on a different origin.
However, from the documentation you link to:
targetOrigin
Specifies what the origin of targetWindow must be for the event to be dispatched, either as the literal string "*" (indicating no preference) or as a URI.
If you want to limit message reading to a selection of origins (without making it public), then you could try to post a message to each in turn, or you could have the parent send its origin to the child (either through postMessage — although that has issues with timing, since you have to wait for the new page to load — or by simply passing it in the query string when requesting the page.
Pass it to your login page via query string added to the end of your service's website that opens your pop up.
Example:
var myservice = 'myservice.com?'+window.location.href;
Then from your site you get the parts you need and create a variable and substitute that for the hard coded address.
Getting the parts:
var prot = window.location.protocol;
var dom = window.location.host;
var path = window.location.pathname;
var qry = window.location.search;
document.getElementById("demo").innerHTML = dom + path + qry;
Related
I have written a page, served from the domain banana.example.com. I own that domain. The purpose of the page is for it to be embedded in pages from mango.example.com, which I don't own. (Same "big domain," but not exactly the same domain.) This works fine. I give the people at Mango the URL and they can embed my Banana page in an iframe on their site.
I would like for my page to display slightly different content depending on exactly which page on mango.example.com it is being embedded.
If I write:
console.log(window.parent.window.location);
I get the full URL printed to the console as a Location object, but I can't access any of that object's properties (e.g., href, pathname) or use either implied or explicit methods to stringify the location object.
Is there any way that I can get information about the page that my page is being embedded in? URL, title, anything? (For the purposes of this question, please assume that I only have authority over banana.example.com and can't ask the folks at mango.example.com to do anything.)
It is because of the browser's CORS (Cross Origin Resource Sharing). A solution for this problem would be to post a message to the outer page requesting for information, which, in turn would post a response to your iframe which will have a handler for that. Read about postMessage here. Note that in case you are not controlling the outer page you will not be able to solve the problem like this. You will need to convince the owner of Mango to receive your message where the iframe is requesting for information and to use postMessage to respond to it.
I currently have a form that is being iFramed into an application that acts as a search bar. When users hit enter in this search, the form redirects the parent window to a different URL within the application. Note that these have the same domain, but different sub-domains. This part works well. See the code below.
window.parent.location = redirectUrl;
The issue is that I have a customer who is iFraming this application into another application. When they go to perform this search in this scenario, we are getting an error that says that "the frame attempting navigation is neither same-origin with the target, nor is it the target's parent or opener."
Is there a workaround around for getting this to work?
The browsers would typically disallow that if the domain is different.
You might be able to set response headers to tell the browser to allow the request to go through:
Access-Control-Allow-Origin: http://example.com
See below:
http://www.staticapps.org/articles/cross-domain-requests-with-cors
You're accessing the window object which, being on a different domain, is restricted by cross origin policy.
You could look at accessing the parent document directly, going up from the active frame, rather than going down from the top (window)
Credit for the image and decent reference
http://eligeske.com/jquery/what-is-the-difference-between-document-and-window-objects-2/
I want to get the final URL after the redirection with just Javascript.
For example I have the url http://example.com/testClient, this redirects to different places with hashes and query parameters based on client cookies. I want to get the final URL with Javascript only.
The URL redirects to different location, with different hash and different query parameter on different clients based on cookies, user-agent, platform, etc.
This is similar to get the original (expanded) URL of a bit.ly link with Javascript.
Any suggestions on how to do this??
You could use an iframe like in this example: http://jsfiddle.net/BaliBalo/qsX6U/
iframe.addEventListener('load', function(){
console.log(iframe.contentWindow.location.href);
}, false);
BUT there is an issue: domain of the final URL has to be the same as the one the script is running on, otherwise it will raise a cross-domain error and contentWindow properties would not be accessible.
I use JavaScript to insert the specific into the page. The problem is that it is necessery to load this iframe for the specific domain. I mean like in GoogleMaps, where you have to insert special key to be able load maps for your domain.
In few words I want to check where my script is linked from.
You can not get the parent property if your page is not on the same domain, the only solutions is to check the document referrer
var ref = document.referrer;
alert(ref);
I open a new window to a Google docs presentation using the method window.open :
NewWindow = window.open("https://docs.google.com/presentation/d/1Qs9......");
I want to retrieve that url in order to know of it has changed (each slide of the presentation has a different url and i want to see if the user changed slides), using NewWindow.location.href
All i get is an undefined value. I can change href though
NewWindow.location.href ="http://www.google.com"; //works
I've read that if you are not in the same domain, you are not allowed to access the href or any other properties on the remote window.
Isn't there any other way to do it?
Thanks in advance.
There is a workaround but not in JavaScript.
The standard solution is to map the documents into your own domain using a proxy server that runs hidden under some URL of your own domain.
That way, you can access the documents via https://your.doma.in/google/presentation/...
A word of warning: If you make a mistake with configuring the proxy, crackers can abuse it to do nasty things (like trying to hack Google or send spam; the police will come knocking on your door).