一 应用
source.html程序调用window的open方法打开一个新的窗口,接下来程序即可调用新窗口对应的window对象的postMessage向该文档发送消息。
二 代码
1、source.html
<!DOCTYPE html> <html> <head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> <title> 跨文档发送消息 </title> <script type="text/javascript"> var send = function() { // 打开一个新窗口 var targetWin = window.open('http://localhost/test1/1/target/target.html' ,'_blank','width=400,height=300'); //① // 等该窗口装载完成时,向该窗口发送消息 targetWin.onload = function () { // 向http://localhost:8888/target发送消息 targetWin.postMessage(document.getElementById("msg").value , "http://localhost/test1/1/target"); //② } } // 通过onmessage监听器监听其他窗口发送回来的消息 window.onmessage = function(ev) { // 忽略来自其他域名的跨文档消息(只接受http://localhost的消息) if (ev.origin != "http://localhost") { return; } var show = document.getElementById("show"); // 显示消息 show.innerHTML += (ev.origin + "传来了消息:" + ev.data + "<br/>"); }; </script> </head> <body> 消息:<input type="text" id="msg" name="msg"/> <button onclick="send();">发送消息</button> <div id="show"></div> </body> </html>
2、target.html
<!DO CTYPE html> <html> <head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> <title> 跨文档发送消息接收 </title> <script type="text/javascript"> window.onmessage = function(ev) { // 忽略来自其他域名的跨文档消息(只接受http://localhost:8888的消息) if (ev.origin != "http://localhost") { return; } document.body.innerHTML = (ev.origin + "传来了消息:" + ev.data); // 向发送该消息的页面回传消息 ev.source.postMessage("回传消息,这里是" + this.location , ev.origin); //① }; </script> </head> <body> </body> </html>
三 运行结果
相关推荐
Kahla是一个跨平台的业务消息传递应用程序。 在这里尝试: Kahla当前针对Windows,Linux,macOS,Android和iOS。 Kahla是使用Angular 8和打字稿构建的。 是使用.NET Core构建的。 有关Kahla项目和Kahla API的更...
包括多篇文档: ...HTML5对移动应用的影响 ...一种基于HTML5的安全跨文档消息传递方案 HTML5在移动互联网中的应用 HTML5发展趋势的研究和探索 常用HTML5移动应用框架 基于HTML5的离线存储技术 dz̸HTML5
一对一和群聊影像撷取照片分享文件附件位置分享推送通知应用内通知在线存在最后看于未读邮件数打字指示邮件已发送,交货报告离线讯息多设备同步应用于用户消息传递自定义聊天气泡UI自定义工具包跨平台支持(iOS,...
RabbitMQ是一个开源的消息代理(message broker)软件,用于支持应用程序之间的消息传递。它实现了AMQP(Advanced Message Queuing Protocol)协议,并提供了可靠的消息传输、灵活的消息路由、消息队列、发布/订阅等...
Applozic支持跨任何设备,任何平台和世界上任何地方的实时消息传递。 集成我们的简单SDK,以使您的用户参与图像,文件,位置共享和音频/视频对话。 在上注册以获取您的应用程序密钥。 ANDROID SDK 概述 Android...
顶扑聊天使用Flutter&Firebase开发的跨平台演示聊天客户端,适用于Toptal Engineering Blog文章。搭建环境该项目旨在与flutter channel stable一起工作。 无法保证它将在不同的抖动通道上工作。API密钥注意-如果您...
此外,集团化应用、泛组织、多视图智能表单、Portal空间、跨平台多数据库、高 性能多并发、移动应用、短信应用、国际化多语言、多软件功能整合等都是NC协 同-OA套件软件的新特征。 随着我们对协同管理的不断深入研究...
通过无缝地到任何消息传递应用程序,让您的客户按照您想要的方式与您。 在每台设备上同步对话,并在客户使用的渠道上进行同步。 与感觉和外观适合您的网站的消息传递建立更好的关系。 使用,以最引人入胜的对话体验...
另一方面,jBus 是一种跨扩展消息传递架构,设计时考虑到了防止命名冲突,它具有简单但富有表现力的 API,并且可以实现任意两段 JavaScript 代码之间的松耦合共享,就像一个 DOM 。文档和兼容性jBus 与任何支持...
深入浅出地探讨了面向对象编程、Ajax 与Comet 服务器端通信,HTML5 表单、媒体、Canvas(包括WebGL)及Web Workers、地理定位、跨文档传递消息、客户端存储(包括IndexedDB)等新API,还介绍了离线应用和与维护、...
第13章介绍了HTML5中的Ajax、跨文档消息传递、Web套接字等通信技术的原理,以及它们的API;第14章讲解了HTML5中Web Workers的使用方法和实现原理,以及它的API;第15章和第16章介绍了HTML5中的历史接口和脱机功能,...
7.10 跨进程处理消息 7.11 消息钩子 7.11.1 钩子和过滤器 7.11.2 钩子的类型和范围 7.11.3 安装和解除消息钩子 7.11.4 使用线程范围和钩子实例 7.11.5 使用全局钩子实例 7.12 小结 第8章 对话框 8.1 ...
全书从JavaScript语言实现的各个组成部分——语言核心、DOM、BOM、事件模型讲起,深入浅出地探讨了面向地理定位、跨文档传递消息、客户端存储(包括IndexedDB)等新API,还介绍了离线应用和与维护、性能、部署相关的...
超级有影响力的Java面试题大全文档 1.抽象: 抽象就是忽略一个主题中与当前目标无关的那些方面,以便更充分地注意与当前目标有关的方面。抽象并不打算了解全部问题,而只是选择其中的一部分,暂时不用部分细节。...
深入浅出地探讨了面向 对象编程、Ajax 与 Comet 服务器端通信,HTML5 表单、媒体、Canvas(包括 WebGL)及 Web Workers、 地理定位、跨文档传递消息、客户端存储(包括 IndexedDB)等新 API,还介绍了离线应用和与...
地理定位、 跨文档传递消息、 客户端存储(包括 IndexedDB) 等新 API, 还介绍了离线应用和与维护、 性 能、 部署相关的最佳开发实践。 本书附录展望了未来的 API 和 ECMAScript Harmony 规范。 本书适合有一定编程...
深入浅出地探讨了面向对象编程、Ajax 与Comet 服务器端通信,HTML5 表单、媒体、Canvas(包括WebGL)及Web Workers、地理定位、跨文档传递消息、客户端存储(包括IndexedDB)等新API,还介绍了离线应用和与维护、...
深入浅出地探讨了面向对象编程、Ajax 与Comet 服务器端通信,HTML5 表单、媒体、Canvas(包括WebGL)及Web Workers、地理定位、跨文档传递消息、客户端存储(包括IndexedDB)等新API,还介绍了离线应用和与维护、性 ...
地理定位、跨文档传递消息、客户端存储(包括 IndexedDB)等新 API,还介绍了离线应用和与维护、性 能、部署相关的最佳开发实践。本书附录展望了未来的 API 和 ECMAScript Harmony 规范。 本书适合有一定编程经验的 ...
深入浅出地探讨了面向 对象编程、Ajax 与 Comet 服务器端通信,HTML5 表单、媒体、Canvas(包括 WebGL)及 Web Workers、 地理定位、跨文档传递消息、客户端存储(包括 IndexedDB)等新 API,还介绍了离线应用和与维护、...