iframe的postMessage什么情况下需要用?

项目里报表是通过iframe嵌入的,报表的筛选条件是通过报表外面通过get请求传参传入,网上说postMessage是解决跨域问题要用的,那是不是可以无脑用postMessage?目前我们直接拼接地址参数也可以实现效果。

阅读 2.1k
4 个回答

视业务场景,如果你的筛选条件是不可变的用拼接地址(querystring)方式就不错,但如果在上层页面中可以修改这个筛选条件postMessage更合适。

postMessage
相当于网页间建立了一个通信管道,可以网页间数据交互
(上层页面中修改了筛选条件,可以使用postMessage通知iframe变更)

querystring
一次性设置,不具备“交互”能力

window.postMessage() 方法是为了解决跨域网页间的通讯而引入的,它可以实现两个网页间的双向通信,目前在主流浏览器上已经得到了良好支持。

你的需求是可以通过此方法来实现的,不过要求改造已有的两个页面的代码,这要求你有权限修改这两个页面。此外,需要注意 postMessage() 如果使用不当,可能有安全问题,最常见的是没有检查消息的 originsource 属性。

一个项目需要调用另外一个项目的功能时候用

最近刚好做了一个使用 <iframe> postMessage 的功能,是一个网站迁移域名,希望新域名可以继续使用老域名的数据(存在 localStorage 里)。

于是乎,我们要这样做:

  1. 在新域名里 iframe 老域名的迁移页面
  2. 新域名页面调用了iframe 里的 postMessage 方法,把 localStorage 传出来
  3. 新域名写入 localStorage
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题