The Widnow.postmessage () method allows secure cross-domain transport.
Syntax
Otherwindow.postmessage (Message, Targetorigin, [transfer]);
-
otherWindow
-
A reference to another window:.
-
message
-
Information that is transmitted to another window
-
targetOrigin
-
A String that specifies the source of the message (in the form of a URL). Remember to always provide a specific URL address if you know, don't always use "*" (for all URLs), because specifying a specific URL can prevent malicious websites from attacking.
The dispatched event
Other windows can listen to the messages being sent through the following code:
false ); function ReceiveMessage (event) { var// for Chrome, the Origin property was in the Event.originalevent object. if (Origin!== "http://example.org:8080") return ; // ...}
The properties of the information being sent are as follows:
-
data
-
Data passed from other windows
-
origin
-
When PostMessage is called, the origin of the message window is sent. This string is the protocol and "://" and the hostname and later use ":" To connect an interface name if the interface name is different from the default interface name. For example http://example.org (the default interface is 443), http://example.net (the default interface is 80) and http://example.com:8080. Note that this origin does not necessarily have to be the origin of the current or future window, so this would be possible when calling PostMessage, causing the jump to another completely different address.
-
source
-
the Window object that sent the message. You can use this to establish two communication between different origin between two windows.
Security concerns
If you do not want to receive information from other websites, do not add any listening on the message object.
Use origin, which may also use the Source property, to determine the identity of the sender if you do not want to receive information about other sites.
Any window (including, for example, http://evil.example.com) can send information to any other window, and you do not have any guarantees to ensure that the unknown sender does not send malicious information. Once you have ensured the identity of the person who sent the message, you also need to verify the syntax of the received content. Otherwise, a trusted Web site that sends trust information may create a cross-domain scripting vulnerability on your site.
Instead of "*", identify the target origin, and when you use PostMessage to send messages to other windows, prevent other websites from intercepting the messages you send when you postmessage.
Example
/** In Windows a ' s scripts, with A being on */varPopup =window.open (... popup details ...);//When the popup had fully loaded, if not blocked by a popup blocker://This does nothing, assuming the window hasn ' t changed it location.Popup.postmessage ("The user is ' Bob ' and the password are ' secret '", "Https://secure.example.net");//This would successfully queue a message to being sent to the popup, assuming//The window hasn ' t changed its location.Popup.postmessage ("Hello there!", "http://example.org");functionReceiveMessage (event) {//Do We trust the sender of this message? (Might be //different from what we originally opened, for example). if(Event.origin!== "http://example.org") return; //Event.source is popup //Event.data is "Hi there yourself! The secret response is:rheeeeet! "}window.addeventlistener ("Message", ReceiveMessage,false);/** In the popup ' s scripts, running on *///called sometime after PostMessage is calledfunctionReceiveMessage (event) {//Do We trust the sender of this message? if(Event.origin!== "http://example.com:8080") return; //Event.source is Window.opener //event.data is "Hello there!" //assuming you ' ve verified the origin of the received message (which //a convenient idiom for replying to a must //message is to call PostMessage on Event.source and provide //Event.origin as the targetorigin.Event.source.postMessage ("Hi there yourself! The secret response "+" is:rheeeeet! ", Event.origin);} Window.addeventlistener ("Message", ReceiveMessage,false);
Notes
Any window can use this method on any other window to send information at any time, regardless of the location of the current page in the window.
Therefore, any object listener that is used to receive information must first check the identity sent by the message, using origin and the possible attribute source to judge.
This must be repeated: not checking origin and source may lead to cross-site scripting attacks.
And any asynchronous execution of the script (timeout, user generated script), call PostMessage to listen to when the event handler listens for PostMessage sent event object is not possible, will throw an error.
The Origin property of the sending object is not affected by the current Document.domain value in the calling window.
For IDNs host names only, the value of the property is not origin
consistently Unicode or Punycode; for greatest Compatibili Ty check for both the IDNs and Punycode values when using the "If you expect messages from IDN sites. This value would eventually be consistently idns, but is now should handle both IDN and Punycode forms.
The value of the origin
sending window contains a or URL is the origin of the javascript:
data:
script that load Ed the URL.
Using window.postmessage in extensions
window.postMessage
is available to JavaScript running in chrome code (e.g., in extensions and privileged code), but thesource
property of the dispatched event was alwaysnull
As a security restriction. (The other properties has their expected values.) ThetargetOrigin
Argument for a message sent to a window located at achrome:
URL is currently misinterpreted such, the only value which would result in a message being sent are"*"
. Since This value was unsafe when the target window can be navigated elsewhere by a malicious site, it's recommended thatpostMessage
Not being used to communicate withchrome:
Pages for now; Use a different method (such as a query string when the window was opened) to communicate with chrome windows. Lastly, posting a message to a page at afile:
URL currently requires that thetargetOrigin
Argument be"*"
.file://
cannot be used as a security restriction; This restriction is modified in the future.
Browser Compatibility
Feature |
Chrome |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari (WebKit) |
Basic Support |
1.0 |
6.0 (6.0) [1] 8.0 (8.0) [2] |
8.0[3] 10.0[4] |
9.5 |
4.0 |
transfer Argument |
? |
20.0 (20.0) |
Not supported |
? |
? |
[1] Prior to Gecko 6.0 (Firefox 6.0/thunderbird 6.0/seamonkey 2.3), the message
parameter must is a string. Starting in Gecko 6.0 (Firefox 6.0/thunderbird 6.0/seamonkey 2.3), the message
parameter is serialized using the Structur Ed clone algorithm. This means your can pass a broad variety of data objects safely to the destination window without have to serialize them yourself.
[2] Gecko 8.0 introduced support for sending File
and FileList
objects between windows. This is a allowed if the recipient ' s principal is contained within the sender's principal for security reasons.
[3] IE8 and IE9 only support it for <frame>
and <iframe>
.
[4] IE10 have important limitations:see this article for details.
Cross-domain transfer information postmessage