var sendToParent = function(event, data, listener) {
var message = {
event: event,
data: data,
listener: listener
};
window.parent.postMessage(JSON.stringify(message), "*");
};
var iframe = document.getElementById('iframe');
var sendToIframe = function(event, data, listener) {
if (iframe && iframe.contentWindow) {
var message = {
event: event,
data: data,
listener: listener
};
iframe.contentWindow.postMessage(JSON.stringify(message), '*')
}
};
var bindEvent =function (el, event, listener, useCapture) {
'use strict';
if (typeof useCapture === 'undefined') {
useCapture = false;
} if (el.addEventListener) {
el.addEventListener(event, listener, useCapture);
}
else if (el.attachEvent) {
el.attachEvent('on' + event, listener);
}
};
bindEvent(window, "message", function(e){
var data = JSON.parse(e.data)||{};
if(data.event && (typeof events[data.event] == "function") ){
events[data.event](data.data||{});
if(data.listener){
//callback
}
}
});

跨域信息传递postMessage的更多相关文章

  1. iframe跨域数据传递

    项目中需要和其他单位合作开发,方案采用iframe嵌入页面,开发过程中设计到了跨域数据的传递,初步方案决定使用html5 API postMessage进行iframe跨域数据传递: 域名A下的页面 ...

  2. html5跨域数据传递(postMessage)

    在html5中有个支持跨域传递的方法postMessage,可是实现iframe之间的数据传递! 代码如下:数据发送页面 <!DOCTYPE HTML> <html lang=&qu ...

  3. html5跨域通讯之postMessage的用法

    转自:http://www.cnblogs.com/wshiqtb/p/3171199.html postMessagePortal.html 页面代码 <!DOCTYPE html> & ...

  4. 跨域通信--Window.postMessage()

    一.跨源通信概述 源:协议.端口号(https默认值433).主机域名(document.domain) 作用:向目标窗口派发MessageEvent消息(四个属性) 兼容参考 MessageEven ...

  5. JavaScript 跨域:window.postMessage 实现跨域通信

    JavaScript 跨域方式实现方式有很多,之前,一篇文章中提到了 JSONP 形式实现跨域.本文将介绍 HTML5 新增的 api 实现跨域:window.postMessage . 1 othe ...

  6. 跨域请求传递Cookie问题

    问题描述 前后端完全分离的项目,前端使用Vue + axios,后端使用SpringMVC,容器为Tomcat. 使用CORS协议解决跨域访问数据限制的问题,但是发现客户端的Ajax请求不会自动带上服 ...

  7. node.js 关于跨域和传递给前台参数

    /*为app添加中间件处理跨域请求*/ app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin& ...

  8. CORS跨域cookie传递

    服务端 Access-Control-Allow-Credentials:true Access-Control-Allow-Methods:* Access-Control-Allow-Origin ...

  9. java 后台实现ajax post跨域请求传递json格式数据获取json数据问题

    参考大神:http://blog.csdn.net/chunqiuwei/article/details/19924821 java后台: public String ajaxProxy(Intege ...

随机推荐

  1. 中文版kendoUI API — Grid(一)

    1.altRowTemplate 类型:Function | String 说明:提供表格行的交替模板,默认grid表格为每一个数据元素提供一个tr 注意:模板中最外层的html元素必须是<tr ...

  2. JS判断鼠标从哪个方向进入DIV容器

    写的不够高大上 , 不要介意哦... Js: //进去 $(".flash").bind("mouseenter",function(e){ /** the w ...

  3. php中抽象类和接口的特点、区别和选择

    一.特点: 1.抽象类特点 (1) 用 abstract 来修饰一个类,那么这个类就是抽象类:抽象类绝对不能被实例化,即$abc = new 抽象类名();会报错. (2) 用abstract 来修饰 ...

  4. Rotate List 面试题

    今天做了leetcode的Rotate List,刚开始头脑不清楚,写的乱七八糟的,后来改了下,提交了,能过,把代码贴出来. 做题的时候头脑要清楚,我刚开始做完的时候才发现我把向左向右移动弄反了,后来 ...

  5. 构建高可用web站点学习(三)

    分布式的构建 做为网站访问的生命线(数据访问),当然也可以采用分布式的方法来减轻单台服务器的访问压力.之前有讲过Memcached的分布式,但是Memcached服务器互不通信,所以我们也提过redi ...

  6. LRU 算法简单实现

    在学习很多服务器软件中,当内存不够,而需要淘汰内存的时候,一般会使用LRU算法,便产生了浓厚的兴趣.在学习操作系统的过程中发现LRU在系统中用寄存器和栈来实现.所以我就尝试着学习用栈来解决LRU的问题 ...

  7. Solr4.8.0源码分析(12)之Lucene的索引文件(5)

    Solr4.8.0源码分析(12)之Lucene的索引文件(5) 1. 存储域数据文件(.fdt和.fdx) Solr4.8.0里面使用的fdt和fdx的格式是lucene4.1的.为了提升压缩比,S ...

  8. Extjs4.1.x使用Application动态按需加载MVC各模块

    我们知道Extjs4之后提出了MVC模块开发,将以前肥厚的js文件拆分成小的js模块[model\view\controller\store\form\data等],通过controller拼接黏合, ...

  9. 【Hybrid App】Hybrid App开发 四大主流移平台分析

    转自http://dev.yesky.com/238/34657738.shtml Hybrid App在过去的两年中已经成为移动界的核心话题,但是作为一名Web开发者来说要如何站在移动互联网的浪潮之 ...

  10. mobile plugin

    http://fronteed.com/iCheck/ http://spritely.net/documentation/ http://www.mobilexweb.com/blog/mobile ...