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. Java学习----对象的状态和行为

    1.什么是对象 对象是已知的事物 对象会执行动作 类是对象的蓝图 2.对象的属性和状态 使用变量来描述 private String name; private int age; private St ...

  2. PHP5的对象复制

    今天用yii开发程序,一个bug改了一晚上,最后发现问题出在了对象复制机制上,PHP5之前的对象复制只需要$object_a = $object_b即可,但PHP5这样得到的是浅复制,及指针指向,并不 ...

  3. JQUERY1.9学习笔记 之基本过滤器(十) 非选择器

    非选择器jQuery( ":not(selector)" ) 例:找出所有input标签为非"checked"的,并且高亮其邻居元素span. <!DOC ...

  4. js 联系电话验证实现

         var str=$('#tele').val();                                       var regPartton=/1[3-8]+\d{9}/;  ...

  5. python面试题大全

    注:本面试题来源于网络,转载请注明来自http://www.cnblogs.com/goodhacker/p/3366618.html. 1. (1)python下多线程的限制以及多进程中传递参数的方 ...

  6. tornado项目

    tornado项目之基于领域驱动模型架构设计的京东用户管理后台 本博文将一步步揭秘京东等大型网站的领域驱动模型,致力于让读者完全掌握这种网络架构中的“高富帅”. 一.预备知识: 1.接口: pytho ...

  7. java的类加载机制

    1.概述 Class文件由类装载器装载后,在JVM中将形成一份描述Class结构的元信息对象,通过该元信息对象可以获知Class的结构信息:如构造函数,属性和方法等,Java允许用户借由这个Class ...

  8. PYTHON WEATHER

    小玩一下python强大的库文件,调api获取天气情况 #coding:utf-8 import urllib import json content = urllib.urlopen('http:/ ...

  9. 在c++中使用Outlook Object Model发送邮件

    一.Outlook Object Model简介 Outlook Object Model(OOM)是outlook为开发者提供的一个COM组件,我们可以在程序中使用它来发送邮件.管理邮箱等.相关介绍 ...

  10. android视图切换动画:ViewAnimator类及其子类

    类图: