postMessage的使用

postMessage的使用postMessage是H5的API,用来解决跨页面通信的。postMessage的使用分为发送方和接收方。发送方的代码用法如下:otherWindow.postMessage(message,targetOrigin,[transfer]);otherWindow是接收方的window对象。可以通过以下几种方法获得,例如window.open()方法返回的值就是打开页面的window对象,或…

大家好,又见面了,我是你们的朋友全栈君。

postMessage是H5的API,用来解决跨页面通信的。postMessage的使用分为发送方和接收方。

发送方的代码用法如下:

otherWindow.postMessage(message, targetOrigin, [transfer]);

otherWindow是接收方的window对象。可以通过以下几种方法获得,例如window.open()方法返回的值就是打开页面的window对象,或者iframe元素的contentWindow属性能获得iframe标签内页面的window对象,等等。

message是你要发送到其他 window的数据。

targetOrigin是接收方域,即接收方页面的window.origin属性。如果接收方窗口的协议、主机地址或端口这三者的任意一项不匹配targetOrigin提供的值,那么消息就不会被发送。该参数也可以是‘*’,表示对接收方的域没有任何限制。

[transfer]是可选项,数组内的对象是实现Transferable接口的对象。它和message一样会被传递给目标页面,这些对象的所有权将被转移给消息的接收方,而发送一方将不再保有所有权。

接收方要开启事件监听,监听message事件,接收方的代码如下:

window.addEventListener("message", receiveMessage, false);

function receiveMessage(event)
{
  var origin = event.origin; 
  if (origin !== "http://example.org:8080")// 假设接受方只接受来自http://example.org:8080域的信息
    return;
  // ...
}

这里的event是MessageEvent的实例,里面包含了data、origin、source属性。data是发送方发送的message,origin是发送方所属的域,source是发送方的window对象的引用。

案例以后在进行补充…

更多详情请看MDN,链接地址:
https://developer.mozilla.org/zh-CN/docs/Web/API/Window/postMessage

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/158555.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长

相关推荐

  • 八皇后问题详解(四种解法)

    八皇后问题详解(四种解法)如果你去百度百科八皇后这个问题,你会发现人家也是历史上有头有脸的一个问题,最后一句“计算机发明后就有一万种方式解决这个问题”读起来也让程序猿们很快活。闲话少说,开始阐述我的思路:最无脑的解法一定是八个for遍历,浪费了太多的计算资源在各种无用功上面,我们稍微构思一下:首先如何决定下一个皇后能不能放这里可以有两种思路,第一种是尝试维护一个8*8的二维矩阵,每次找到一个空位放下一个皇后就把对应行列对

    2022年6月30日
  • mysql数据库备份方法有几种_MySQL几种方法的数据库备份

    mysql数据库备份方法有几种_MySQL几种方法的数据库备份MySQL有几个方法来备份最近博客一直想写点。可是不知道写什么,感觉自己近期的知识没有什么添加,今天想到了一篇能够写的博客。曾经试过依据data目录备份MySQL。可是从来没有成功过。前几天帮助朋友还原MySQL,最终成功的将备份的data目录还原成功了。MySQL数据库算是经常使用的数据库中最好使用的数据库了,对于备份的操作也不例外。所以今天分享一下MySQL数据库的备份的几种方式。方式一:使用…

    2022年5月14日
  • 阿里云polardb_阿里云用的什么数据库

    阿里云polardb_阿里云用的什么数据库前言一年一度的数据库领域顶级会议VLDB2019于美国当地时间8月26日-8月30日在洛杉矶召开。在本届大会上,阿里云数据库产品团队多篇论文入选ResearchTrack和IndustrialTrack。本文将对入围IndustrialTrack的论文《AnalyticDB:RealtimeOLAPDatabaseSystematAlibabaCloud》进行深度…

    2022年9月16日
  • SSL证书绑定成功

    SSL证书绑定成功

    2021年10月14日
  • SVN的安装与配置

    SVN的安装与配置本文主要介绍windows与阿里云liunx(centos)的安装与配置SVN工作原理:客户端-服务端代码的提交、更新每一个版本都会在svn的安装配置目录下SVN下载地址:http://subv

    2022年7月2日
  • 扫描系统漏洞的工具_免费漏洞扫描工具

    扫描系统漏洞的工具_免费漏洞扫描工具端口扫描之王NMAPNmap是一款非常强大的实用工具包含的功能如下:扫描到的端口状态:TCP扫描(-sT):这是一种最为普通的扫描方法,这种扫描方法的特点是:扫描的速度快,准确性高,对操作者没有权限上的要求,但是容易被防火墙和IDS(防入侵系统)发现运行的原理:通过建立TCP的三次握手连接来进行信息的传递SYN扫描(-sS):这是一种秘密的扫描方式之一,因为在SYN扫描中Client端和Server端没有形成3次握手,所以没有建立一个正常的TCP连接,因此不被防火墙和日志所记录…

    2022年9月12日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号