本文详细介绍了如何利用HTML5的postMessage方法来实现JavaScript跨域通信。首先解释了什么是跨域以及浏览器的同源策略，然后重点解析了postMessage的跨域思路，包括发送消息和接收消息的实现细节。最后，提供了封装postMessage工具的使用方法，并指出该方法在现代浏览器中的兼容性情况。
一、概要介绍
1、什么是跨域？
跨域是指从一个域名的网页去请求另一个域名的资源。比如从www.baidu.com 页面去请求 www.google.com 的资源。但是一般情况下不能这么做，它是由浏览器的同源策略造成的，是浏览器对JavaScript施加的安全限制。跨域的严格的定义是：只要 协议，域名，端口有任何一个的不同，就被当作是跨域。
2、跨域通信的解决方法：
（1）通过jsonp实现跨域
（2）通过修改document.domain实现跨子域
（3）通过修改window.name实现跨域
（4）通过HTML5的postMessage实现跨域
本文只讲解postMessage实现跨域的方法，其他方法请自行百度。
二、postMessage跨域思路解析
假设业务场景：a.com/a.html（以下简称a页面）中嵌套了b.com/b.html（以下简称b页面）页面，现在b页面要向a页面发送消息。
实现思路：
（1）b页面调用a页面的postMessage方法发送消息。b页面代码如下：
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
