给postmessage加上callback方法
postmessage双向通信中,是不能使用回调函数的。
window.postmessage({msg:'hello',callback:function(e){
do something with e
}})
这样是不行的,js会提示function不会被克隆。
我猜啊因为postmessage是通过dom通讯,js对象会被json化
也就是说不能传递方法。
不过,话说回来,有什么不能的呢,大不了,把function tostring一下,也是可以传过去的。
那这里就要考虑你传callback是干什么用了,如果是作为一种自定义 的数据处理方法,你就tostring一下,过去随便用用就好了,就好像foreach那样,传一个方法,在foreach内部用用。
如果就是想要得到返回值,让自己的书写比较连续。业务逻辑比较连续,callback的结果不会再传到对面。也就是说,callback始终是在本window下运行的。
保持业务逻辑连续的在你所写的方法里,不会因为调用postmessage而把业务处理逻辑跳跃到onmessage里。
这是我要在这里讨论的。
1.很显然,callback从来没真正被传递到对面window里。
2.callback将在onmessage(addlistoner里注册的接收事件)里执行。
3.基于以上两点 ,可以得出很简单的结论。在本window里缓存callback,等onmessage接收到对面发回来的数据时,用callback处理即可。
话有点儿绕嘴,分步来一次,应该会更清楚一点。
1.用postmessage发消息给对面。
2.对面收到消息,处理,
3.用postmessage给本地发消息。
4.本地接收到消息,处理
那么本地要用callback去处理,要知道用的是哪个function去处理。那么本地有一个指向callback的变量,就可以得到该callback。
而因为通讯不可能只一次,该callback会被放在数组里,同时会用唯一性id来标示它,而这个标示 也将被告诉对面window,再让对面告诉本地,从而,本地的接收事件中,去调用这个function。
还是绕,
写一下代码吧,也许代码一目了然。
对面的接收单元
window.addEventListener("message", function(e) {
var data = e.data //拿到传递的数据 {msg:'给我来杯可乐',callbackid:'15146484468'}
//打一杯可乐
var res = '返回的可乐'
window.postmessage({result:res,callbackid:data.callbackid})//发出去
}, false);
本地的单元
var callbacks : {}
function 点杯可乐(callback){
callbacks[随机id] = callback
xxxwindow.postmessage ({msg:'给我打一杯可乐',callbackid:'随机id'})
} function 吃肯德基的方法(){
//点汉堡
点汉堡(吃汉堡的方法)
//点可乐
点杯可乐(喝可乐)
//结账走人了
}
//喝可乐就是callback对吧
function 喝可乐(){
//咚咚咚。。。哈
}
很显然,吃肯德基就是业务,那么业务顺序就是如此的,如果突然跳到接收事件里去吃汉堡,喝可乐,总是很诡异的。
通过,缓存callback假装callback被传递出去,然后被调用,其实,就达到了目的。
以上。
给postmessage加上callback方法的更多相关文章
- 通过Html5的postMessage和onMessage方法实现跨域跨文档请求访问
在项目中有应用到不同的子项目,通过不同的二级域名实现相互调用功能.其中一个功能是将播放器作为单独的二级域名的请求接口,其他项目必须根据该二级域名调用播放器.最近需要实现视频播放完毕后的事件触发,调用父 ...
- 回调函数: 一定要在函数名前加上 CALLBACK,否则有可能引起内存崩溃!
今天又遇到一个莫名其妙的内存崩溃问题,问题代码 EnumChildWindows(...): EnumChildWindows(hwnd_panel_text_watermark, (WNDENUMP ...
- delphi Timage 加上滚动条方法
elphi Timage 加上滚动条方法 1:将 Timage 放入 TScrollBox内,即 [1]设image1.parent:= ScrollBox1; [2]在Object Ins ...
- jQuery.each(object, [callback])方法,用于处理json数组
通用例遍方法,可用于例遍对象和数组. 不同于例遍 jQuery 对象的 $().each() 方法,此方法可用于例遍任何对象.回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或内 ...
- Javascript中的Callback方法浅析
什么是callback? 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用为调用它所指向的函数时,我们就说这是回调函数.回调函数不是由该函数 ...
- iframe的父子层跨域 用了百度的postMessage()方法
父层:第一个是方法申明 第二个是接收子层过来的数据 <script type="text/javascript"> $("#main").load( ...
- jQuery Callback 方法
Callback 函数在当前动画 100% 完成之后执行. jQuery 动画的问题 许多 jQuery 函数涉及动画.这些函数也许会将 speed 或 duration 作为可选参数. 例子:$(& ...
- 【学亮IT手记】jQuery callback方法实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...
- form submit 的callback方法
参考:http://hayageek.com/jquery-ajax-form-submit/ form的submit方法返回数据处理. 普通的form: $("#ajaxform" ...
随机推荐
- 写给新手看的 MyBatis 入门
目录 MyBatis 使用前的准备 什么是 MyBatis 使用Maven 进行 MyBatis 开发环境搭建 MyBatis 入门 项目整体结构一览 MyBatis 的简单生命周期 1.获取 Sql ...
- arcgis python 获得表字段的唯一值
#获得唯一值 by gisoracle def getuniqueValue(inTable,inField): rows = arcpy.da.SearchCursor(inTable,[inFie ...
- Linux下使用 Nginx
1. 下载Nginx 下载地址 下载完成后,上传到linux服务器,我上传到了 /opt文件夹下. 2. 安装Nginx前的准备 要想使用Nginx需要安装PCRE库和zlib库,否则直接安装Ngin ...
- Flink简介
Flink简介 Flink的核心是一个流式的数据流执行引擎,其针对数据流的分布式计算提供了数据分布,数据通信以及容错机制等功能.基于流执行引擎,Flink提供了诸多更高抽象层的API以方便用户编写分布 ...
- udp如何实现可靠性传输?
版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[+] 1udp与tcp的区别 TCP(TransmissionControl Protocol 传输控制协议)是一种面向连接的 ...
- benchmark在postgresql上的安装及使用
BenchmarkSQL是一款经典的开源数据库测试工具,内嵌了TPCC测试脚本,可以对EnterpriseDB.PostgreSQL.MySQL.Oracle以及SQL Server等数据库直接进行 ...
- linux设置脚本开机自启
由于在centos7中/etc/rc.d/rc.local的权限被降低了,所以需要赋予其可执行权 chmod +x /etc/rc.d/rc.local 赋予脚本可执行权限假设/opt/script/ ...
- SQL-W3School-高级:SQL JOIN
ylbtech-SQL-W3School-高级:SQL JOIN 1.返回顶部 1. SQL join 用于根据两个或多个表中的列之间的关系,从这些表中查询数据. Join 和 Key 有时为了得到完 ...
- kotlin 修饰符
在kotlin中有四种修饰符: private 仅在类的内部使用 protected类似private,但在子类中可以访问 internal任何在模块内部类都可以访问 public:任何类都可以访问
- Pytorch Tensor, Variable, 自动求导
2018.4.25,Facebook 推出了 PyTorch 0.4.0 版本,在该版本及之后的版本中,torch.autograd.Variable 和 torch.Tensor 同属一类.更确切地 ...