跨域传输信息postMessage
2016-04-27 16:40
204 查看
widnow.postMessage()方法允许安全的跨域传输。
被发送的信息的属性如下:
Security concerns
如果你不想接受到其他网站的信息,不要在message对象上增加任何监听。
使用origin(有可能也会使用source)属性来确定发送者的身份,如果你不想接受到其他网站的信息的话。
任何的window(包括,例如http://evil.example.com)可以向任何的其他window发送信息,你没有任何的保障来保证未知的发送者不会发送恶意的信息。确保了发送信息者的身份之后,你还需要确验证接收到的内容的语法。否则,发送信任信息的受信网站可能在你的网站上创建一个跨域的脚本漏洞。
不要使用“*”,而是确定的目标origin,当你使用postMessage来发送信息给其他的windows的时候,防止其他网站在你postMessage的时候拦截发送的信息。
所以,任何的对象监听被使用来接受信息时必须先检查信息发送着的身份,使用origin和可能使用的属性source来判断。
这个必须再三声明:不检查origin和source可能会导致跨站点脚本攻击。
和任何的异步执行的脚本(timeout,用户生成的脚本),调用postMessage来监听何时事件处理函数监听postMessage发送的事件对象是不可能的,将会抛出错误。
发送对象的origin属性是不会受到当前在调用窗口的document.domain值的影响。
For IDN host names only, the value of the
The value of the
[1] Prior to Gecko 6.0 (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3), the
[2] Gecko 8.0 introduced support for sending
[3] IE8 and IE9 only support it for
[4] IE10 has important limitations: see this article for details.
Syntax
otherWindow.postMessage(message, targetOrigin, [transfer]);
otherWindow指向另一个窗口的引用:。
message传输给另一个窗口的信息
targetOrigin一个字符串,指定消息来源(URL形式)。记住总是提供一个特定的URL地址如果你知道的话,不要总是使用“*”(针对所有的URL),因为指定一个特定的URL可以防止恶意的网站来攻击。
The dispatched event
其他的窗口可以通过以下代码来监听被发送的信息:window.addEventListener("message", receiveMessage, false); function receiveMessage(event) { var origin = event.origin || event.originalEvent.origin; // For Chrome, the origin property is in the event.originalEvent object. if (origin !== "http://example.org:8080") return; // ... }
被发送的信息的属性如下:
data从其他窗口传递的data
origin当postMessage调用的时候,发送信息窗口的origin。这个字符串是协议和"://"和主机名和后面用":"连接了一个接口名称,如果这个接口名和默认的接口名不一样的话。比如http://example.org(默认的接口是443),http://example.net(默认的接口是80)和http://example.com:8080。注意,这个origin并不一定要是当前亦或未来的那个窗口的origin,所以这将有可能当调用postMessage的时候,导致跳转到另一个完全不同的地址。
source发送信息的window对象。你可以使用这个在不同origin之间在两个窗口之间建立两个通信。
Security concerns
如果你不想接受到其他网站的信息,不要在message对象上增加任何监听。使用origin(有可能也会使用source)属性来确定发送者的身份,如果你不想接受到其他网站的信息的话。
任何的window(包括,例如http://evil.example.com)可以向任何的其他window发送信息,你没有任何的保障来保证未知的发送者不会发送恶意的信息。确保了发送信息者的身份之后,你还需要确验证接收到的内容的语法。否则,发送信任信息的受信网站可能在你的网站上创建一个跨域的脚本漏洞。
不要使用“*”,而是确定的目标origin,当你使用postMessage来发送信息给其他的windows的时候,防止其他网站在你postMessage的时候拦截发送的信息。
Example
/* * In window A's scripts, with A being on <http://example.com:8080>: */ var popup = window.open(...popup details...); // When the popup has fully loaded, if not blocked by a popup blocker: // This does nothing, assuming the window hasn't changed its location. popup.postMessage("The user is 'bob' and the password is 'secret'", "https://secure.example.net"); // This will successfully queue a message to be sent to the popup, assuming // the window hasn't changed its location. popup.postMessage("hello there!", "http://example.org"); function receiveMessage(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 <http://example.org>: */ // Called sometime after postMessage is called function receiveMessage(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 // you must do in any case), a convenient idiom for replying to a // 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
任何window可以在任何其他的window上使用这个方法,在任何的时候,不管当前页面在window中的location,来发送信息。所以,任何的对象监听被使用来接受信息时必须先检查信息发送着的身份,使用origin和可能使用的属性source来判断。
这个必须再三声明:不检查origin和source可能会导致跨站点脚本攻击。
和任何的异步执行的脚本(timeout,用户生成的脚本),调用postMessage来监听何时事件处理函数监听postMessage发送的事件对象是不可能的,将会抛出错误。
发送对象的origin属性是不会受到当前在调用窗口的document.domain值的影响。
For IDN host names only, the value of the
originproperty is not consistently Unicode or punycode; for greatest compatibility check for both the IDN and punycode values when using this property if you expect messages from IDN sites. This value will eventually be consistently IDN, but for now you should handle both IDN and punycode forms.
The value of the
originproperty when the sending window contains a
javascript:or
data:URL is the origin of the script that loaded the URL.
Using window.postMessage in extensions
window.postMessageis available to JavaScript running in chrome code (e.g., in extensions and privileged code), but the
sourceproperty of the dispatched event is always
nullas a security restriction. (The other properties have their expected values.) The
targetOriginargument 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
postMessagenot 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
targetOriginargument be
"*".
file://cannot be used as a security restriction; this restriction may be 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 |
transferargument | ? | 20.0 (20.0) | Not supported | ? | ? |
messageparameter must be a string. Starting in Gecko 6.0 (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3), the
messageparameter is serialized using the structured clone algorithm. This means you can pass a broad variety of data objects safely to the destination window without having to serialize them yourself.
[2] Gecko 8.0 introduced support for sending
Fileand
FileListobjects between windows. This is only 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 has important limitations: see this article for details.
相关文章推荐
- ajax动态添加tr td (并用PHP返回值设置tr样式,用于删除操作
- LeetCode 343. Integer Break
- 获取lable行数
- 数组与ARRAYLIST的关系与区别
- 字符串的封装
- Hibernate 中使用 HibernateTemplate的三种方法
- Android 加载外部so
- autolayout中 top layout guide详解
- SQL查询作业执行情况
- 怎样制作EDIUS中视频边缘模糊特效
- 《深入理解Java虚拟机》第三章读书笔记:类文件结构
- QT5添加资源文件以及设置背景
- [Android 基础系列]Service、IntentService和习以为常的误解
- 检查request返回值类型的一个小方法
- 【经典算法】——KMP,深入讲解next数组的求解
- andriod/ios webview与js交互 html_demo
- CC2541之数据加密与解密
- Mybatis数据源与连接池(一)介绍创建过程
- iOS类别(Category)与扩展(Extension)
- iOS 开发工具集合