跨域消息传递:postMessage()

1、兼容性问题:IE8及其以上浏览器和其它主流浏览器都已经支持

2、使用范围:跨iframe、跨页面、跨域

3、使用方法:

  发送消息:postMessage( data, scope ) data值需要传递的消息,scope指定发送给那些域

  监听消息:使用事件监听方法监听(addEventListener/attachEvent)

  之所以可以使用事件监听方法监听,是因为当调用postMessage方法时,会触发message事件,并传递给事件处理程序一个事件对象。

4、事件对象的属性:

  data:传递的消息

  source:消息源自的Window对象

  origin:消息来源的URL(可以用于过滤需要的来源的数据,忽略不明来源的数据)

原生js--跨域消息传递的更多相关文章

  1. JQuery和原生JS跨域加载JSON数据或HTML。

    前提:有时候需要在网页上,加载另一个网站上的数据.或者加载另一个网站上的一个页面.Js的Ajax请求不具备跨域功能,可以使用JQuery来实现. 网页端JS代码: $(function () { $. ...

  2. jsonp原生js跨域拿新浪数据插件封装【可扩展】

    //修改了一个bug,增加了手动释放垃圾 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  3. 前端Js跨域方法汇总—剪不断,理还乱,是跨域

    1.通过jsonp跨域2.通过修改document.domain来跨子域(iframe)3.隐藏的iframe+window.name跨域4.iframe+跨文档消息传递(XDM)5.跨域资源共享 C ...

  4. js跨域请求数据的3种常用的方法

    由于js同源策略的影响,当在某一域名下请求其他域名,或者同一域名,不同端口下的url时,就会变成不被允许的跨域请求.那这个时候通常怎么解决呢,对此菜鸟光头我稍作了整理:1.JavaScript   在 ...

  5. js跨域请求方式 ---- JSONP原理解析

    这篇文章主要介绍了js跨域请求的5中解决方式的相关资料,需要的朋友可以参考下     跨域请求数据解决方案主要有如下解决方法:   1 2 3 4 5 JSONP方式 表单POST方式 服务器代理 H ...

  6. 5种处理js跨域问题方法汇总(转载)

    1.JSONP跨域GET请求 ajax请求,dataType为jsonp.这种形式需要请求在服务端调整为返回callback([json-object])的形式.如果服务端返回的是普通json对象.那 ...

  7. JS跨域(ajax跨域、iframe跨域)解决方法及原理详解(jsonp)

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  8. 【js跨域】js实现跨域访问的几种方式

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  9. 【前端】【转】JS跨域问题总结

    详情见原博客:详解js跨域问题 概念:只要协议.域名.端口有任何一个不同,都被当作是不同的域. 跨域资源共享(CORS) CORS(Cross-Origin Resource Sharing)跨域资源 ...

  10. js跨域访问,No 'Access-Control-Allow-Origin' header is present on the requested resource

    js跨域访问提示错误:XMLHttpRequest cannot load http://...... No 'Access-Control-Allow-Origin' header is prese ...

随机推荐

  1. linux mount 挂接新硬盘

    1.先用fdisk -l查看一下,先加入的外设地址名称   2. #fdisk /dev/sdb进入fdisk模式:Command (m for help):p //查看新硬盘的分区Command ( ...

  2. MFC中CString.Format的详细用法

          本文转载自:http://blog.csdn.net/wangkaishou/article/details/5846152,感谢网友 Technorati 标签: CString For ...

  3. MVC Controller向View传递数据

    ASP.NET MVC中,Controller向View传递数据的方式有一下6种 ViewData ViewBag PartialView TempData ViewModel Tuple 1.Vie ...

  4. level 1 -- unit 4 -- where 引导的疑问句

    where be sb/sth 询问地点,用where where is the restaurant? where are my socks ? where was tome just now? w ...

  5. python unittest 1

    今天开始研究python的unittest模块,为我们当前做的项目定制测试方案,包括unittest和自动化流程测试. python的unittest的基本使用方法如下:   1.import uni ...

  6. InstallShield 制作MSI

    1.  click [project Assistant] 2. select [Build Installation], open this tab asfollow: 3.whenbuild ok ...

  7. [OpenCV] Samples 06: logistic regression

    logistic regression,这个算法只能解决简单的线性二分类,在众多的机器学习分类算法中并不出众,但它能被改进为多分类,并换了另外一个名字softmax, 这可是深度学习中响当当的分类算法 ...

  8. javascript拖拽操作

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. iOS 图片加载速度极限优化—FastImageCache解析

    FastImageCache是Path团队开发的一个开源库,用于提升图片的加载和渲染速度,让基于图片的列表滑动起来更顺畅,来看看它是怎么做的.优化点iOS从磁盘加载一张图片,使用UIImageVIew ...

  10. Python easyGUI 猜数字

    import easygui as g import random d=random.randint(0,10) while 1: g.msgbox("现在开始猜数字小游戏:") ...