假设 A: home.xxx.com --------跨域调用-------> api.xxx.com
home.xxx.com 调用:
otherWindow.postMessage( message, targetOrigin );
otherWindow:另一个的window对象的引用,这个引用可能是对象获取,如使用iframe元素的 contentWindow 属性,window.open返回的对象,或者根据名称或数字索引在window.frames中得到。
message:发送到另一个窗口的数据。
targetOrigin:特别说明必须指定otherWindows要发送事件的来源,可以为文本字符串”*” (显示任意来源) 或者是一个URI。如果在事件被指定发送后, otherWindow文档的协议,主机名称,或端口号与targetOrigin提供的不相符的话,这个事件将不后被发送。只有当所有三个全部匹配后事件才会被发送。 这种机制提供消息发送到哪的控制权,例如,如果postMessage的被用来发送一个密码,这将是绝对关键的,参数是一个来源和打算接收包含密码消息的接收者一样的URI,以防止由恶意的第三方截取的密码。始终提供指定的targetOrigin,而不是*,如果你知道其它window文档的地址,而没有提供一个具体的目标,将会泄露了您发送给任何有兴趣的恶意网站的数据。
api.xxx.com:
window.addEventListener(
"message"
,
function
(e) {
if
(e.origin ==
"https://home.xxx.com"
) {
alert(e.data);
}
}
,
false
);
data:从其他窗口过来的数据对象。
origin:在postMessage 被调用时发送消息窗口的来源。
source:发送消息窗口的引用。