跨域消息传递: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. Winform控件学习笔记【第四天】——WebBrowser

    常用方法 Navigate(string urlString);//浏览urlString表示的网址 Navigate(System.Uri url);//浏览url表示的网址 Navigate(st ...

  2. PyQt的signal 和 solit的补充

    from PyQt5.QtWidgets import (QWidget , QVBoxLayout , QHBoxLayout, QLineEdit, QPushButton) from PyQt5 ...

  3. Linux 系统安装配置PHP服务(源码安装)

    简介: PHP(外文名:PHP: Hypertext Preprocessor,中文名:“超文本预处理器”)是一种通用开源脚本语言.语法吸收了C语言.Java和Perl的特点,利于学习,使用广泛,主要 ...

  4. Python 判断文件是否存在的三种方法

    通常在读写文件之前,需要判断文件或目录是否存在,不然某些处理方法可能会使程序出错.所以最好在做任何操作之前,先判断文件是否存在. 这里将介绍三种判断文件或文件夹是否存在的方法,分别使用os模块.Try ...

  5. SOFA企业应用框架

    前言 从业这么多年,接触过银行的应用,Apple的应用,eBay的应用和现在阿里的应用,虽然分属于不同的公司,使用了不同的架构,但有一个共同点就是都很复杂.导致复杂性的原因有很多,如果从架构的层面看, ...

  6. 前端图片压缩(纯js)

    html代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...

  7. Mac下配置Oracle数据库客户端远程连接数据库服务器

    下载mac数据库客户端: 地址:http://www.oracle.com/technetwork/topics/intel-macsoft-096467.html 下载这俩个:(来源:http:// ...

  8. Spring定时器的两种实现方式

    有两种流行Spring定时器配置:Java的Timer类和OpenSymphony的Quartz. 1.Java Timer定时 首先继承java.util.TimerTask类实现run方法 imp ...

  9. VS2013启动浏览器链接(BrowserLink),导致页面脚本错误和页面加载变慢

    页面脚本出错场景:

  10. Three-js 创建第一个3D场景

    1.一个场景至少需要的三种类型组件 相机/决定哪些东西将在屏幕上渲染    光源/他们会对材质如何显示,以及生成阴影时材质如何使用产生影响    物体/他们是在相机透视图里主要的渲染队形:方块.球体等 ...