Matej Posted January 8, 2015 Share Posted January 8, 2015 (edited) Hola , im trying to communicate with two windows (both local html files) using window.postMessage() , here are my scripts : first site function kolko(){ var x=window.open("torek.html"); //this opens new windowx.postMessage("hello","torek.html");} <button onclick="kolko()">click</button> second site var g;window.addEventListener("message",function(){if(event.origin==="fasd.html"){g=event.data;alert(g);}},false) The second one doesnt work , it didnt even thrown error in consoleany solutions ? Edited January 8, 2015 by Matej Link to comment Share on other sites More sharing options...
justsomeguy Posted January 8, 2015 Share Posted January 8, 2015 Have you verified that the event is firing, and what the data is for it? Link to comment Share on other sites More sharing options...
Matej Posted January 8, 2015 Author Share Posted January 8, 2015 (edited) Right , i tried to do simply window.addEventListener("message",function(){alert("working")},false) and nothing happens = event aint firing at all , why is that? // but now , it did throw error on parent site :Uncaught SyntaxError: Failed to execute 'postMessage' on 'Window': Invalid target origin 'torek.html' in a call to 'postMessage'.: it says invalid target origin , whats with that? Both of thise sites are in the same foled and window.postMessage works on local files Edited January 8, 2015 by Matej Link to comment Share on other sites More sharing options...
justsomeguy Posted January 8, 2015 Share Posted January 8, 2015 If I do a search for that error message, and check the documentation for postMessage, I find that the second parameter is not simply a filename. The second parameter is the target origin. Link to comment Share on other sites More sharing options...
Matej Posted January 8, 2015 Author Share Posted January 8, 2015 Im quite confused now , so what should be "target origin"? , it didnt work with " * " either , Link to comment Share on other sites More sharing options...
Ingolme Posted January 8, 2015 Share Posted January 8, 2015 Here's the documentation: https://developer.mozilla.org/en-US/docs/Web/API/Window.postMessage The targetOrigin property contains information about the website that's meant to receive the information. It can be "*" or a URI which has the scheme (http: or https:) and the domain name of the site that's receiving the message. It's probable that some browsers won't allow this to work in the local filesystem for security reasons, I find it happens with a lot of features. Link to comment Share on other sites More sharing options...
justsomeguy Posted January 8, 2015 Share Posted January 8, 2015 If at the time the event is scheduled to be dispatched the scheme, hostname, or port of otherWindow's document does not match that provided in targetOrigin, the event will not be dispatchedWhat do you suppose the scheme, hostname, and port are for a file you just double-click on? Link to comment Share on other sites More sharing options...
Matej Posted January 9, 2015 Author Share Posted January 9, 2015 Thanks for answers , yes thought too it would be problem that my "sites" are just local html files , but i found on stackoverflow that it works with local files (maybe the persons were wrong) Link to comment Share on other sites More sharing options...
Ingolme Posted January 9, 2015 Share Posted January 9, 2015 If they say on StackOverflow that it can be done on the filesystem then it probably is true. I assume that if it can work on the local filesystem at all it probably only does with "*" as the target origin. When you pass "*" to the function, what error message do you get? Link to comment Share on other sites More sharing options...
Matej Posted January 9, 2015 Author Share Posted January 9, 2015 If they say on StackOverflow that it can be done on the filesystem then it probably is true. I assume that if it can work on the local filesystem at all it probably only does with "*" as the target origin. When you pass "*" to the function, what error message do you get? Uncaught SyntaxError: Failed to execute 'postMessage' on 'Window': Invalid target origin ' * ' in a call to 'postMessage'. also when i use "*" it says nothing (i used " * " ) Link to comment Share on other sites More sharing options...
justsomeguy Posted January 9, 2015 Share Posted January 9, 2015 It's a problem if you put spaces around that. Link to comment Share on other sites More sharing options...
Matej Posted January 9, 2015 Author Share Posted January 9, 2015 Thanks, wasnt sure about that , thats why i tried to use both , with but "*" didnt work nor throw error Link to comment Share on other sites More sharing options...
Ingolme Posted January 9, 2015 Share Posted January 9, 2015 Show the code you have on both of your pages. Link to comment Share on other sites More sharing options...
Matej Posted January 9, 2015 Author Share Posted January 9, 2015 (edited) Show the code you have on both of your pages. var x;function kolko(){ x=window.open("torek.html");x.postMessage("Hello world!","*");} window.addEventListener("message",function(){alert("success");alert(event.data);},false); Edited January 9, 2015 by Matej Link to comment Share on other sites More sharing options...
Ingolme Posted January 9, 2015 Share Posted January 9, 2015 Try this: x=window.open("torek.html");x.onload = function() { x.postMessage("Hello world!","*");} In the second window, be sure you create the event variable: window.addEventListener("message",function(event){ The theory behind it is that the moment you open the new window, the Javascript inside it has not yet started running, so it's not there to listen to the message you sent to it. Link to comment Share on other sites More sharing options...
Matej Posted January 9, 2015 Author Share Posted January 9, 2015 (edited) Try this: x=window.open("torek.html");x.onload = function() { x.postMessage("Hello world!","*");} In the second window, be sure you create the event variable: window.addEventListener("message",function(event){ The theory behind it is that the moment you open the new window, the Javascript inside it has not yet started running, so it's not there to listen to the message you sent to it. Still not working :/ and still without error , also i tried to simple x.onload=function(){alert("loaded");} which didnt work either Edited January 9, 2015 by Matej Link to comment Share on other sites More sharing options...
Ingolme Posted January 9, 2015 Share Posted January 9, 2015 It's working for me in Firefox, but Chrome doesn't fire the onload event because the window seems to already be considered loaded by the time I assigned the event listener. As a test to confirm this, I substituted the onload event with a setTimeout call that waits one second before sending the message and it works, that's an unstable solution. I'm currently trying to figure out a way to detect when the script is ready in Chrome, but it's not behaving properly. document.readyState is set to "complete" when I check it from the parent window even when the page isn't fully loaded. Link to comment Share on other sites More sharing options...
Matej Posted January 9, 2015 Author Share Posted January 9, 2015 (edited) I found only this. The targetOrigin argument for a message sent to a window located at a chrome: URL is currently misinterpreted such that the only value which will result in a message being sent is "*". Since this value is unsafe when the target window can be navigated elsewhere by a malicious site, it is recommended that postMessage not be used to communicate with chrome: pages for now; use a different method (such as a query string when the window is opened) to communicate with chrome windows. Lastly, posting a message to a page at a file: URL currently requires that the targetOrigin argument be "*". cannot be used as a security restriction; this restriction may be modified in the future. Which means it should works with local html files but target.origin has to be "*" , dunno why it aint workin Edited January 9, 2015 by Matej Link to comment Share on other sites More sharing options...
Ingolme Posted January 9, 2015 Share Posted January 9, 2015 It's not about the targetOrigin parameter, the postMessage function works fine. The problem is that you're sending the message before the receiving document is listening for it. It looks like Chrome doesn't let you set the onload function because it's being executed in the local filesystem and security features prevent functions from being executed between local files. This works fine on a server environment. page1.html var target = window.open("page2.html");target.onload = function() { target.postMessage("Hello, World!", "*");}; page2.html window.addEventListener("message",function(e){ alert(e.data);},false); This works on the desktop but is not a reliable solution: page1.html var target = window.open("page2.html");setTimeout(function() { target.postMessage("Hello, World!", "*");}, 1000); Link to comment Share on other sites More sharing options...
Matej Posted January 9, 2015 Author Share Posted January 9, 2015 Seems like problem is "solved" , thanks for effort Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now