iframe session实现跨域,iframe跨域调用js
当我们想在域名A.com下使用域名B.com提供的页面服务时，直观的实现方式就是使用iframe。但是iframe的直接交互有* *跨域问题* *。目前看来，有两种解决方案。先用nginx代理转发，在A域名的nginx上配置指定的转发规则，直接指向B域名，直接杀跨域；另一种方法是使用postMessage方法。这里，对于第二种方法，看一下用法和可能出现的问题。
postMessage是什么
这里引用了MDN对postMessage的详细描述。简而言之：postMessage是一种挂载在window下的方法，用于不同域名下的两个页面之间的信息交互。父子页面通过postMessage()发送消息，然后通过侦听消息事件接收消息。
postMessage使用
假设有一个父页面indexPage.html和一个子页面iframePage.html。
一、父页面向子页面发送消息
//父页面index.html//获取iframe元素iframe=document . getelementbyid( iframe )//在发送消息之前加载iframe，否则子页面不会收到message iframe . onload=function(){//一加载iframe就发送消息iframe . content window . postmessage({ msg: messagefrommindexpage }， \ * )；} iframe . content window . postmessage( MessageFromIndexPage ， b.com )
方法的第一个参数是发送的消息，没有格式要求；第二个参数是域名限制。当域名不受限制时，填写*，第三个可选参数transfer一般不填。此参数有严重的浏览器兼容性问题。
二、子页面接收父页面发送的消息
//子页面iframePage.html//监听消息事件window . addevent listener( message ，function (event) {console.log(这里是从父页面收到的消息，消息内容在event.data属性，event )}，false)三、子页面给父页面传递消息
window . parent . postmessage({ name:张三 }， \ * )；方法的第一个参数是发送的消息，但目前没有格式要求。GECKO 6.0之前(火狐6.0/雷鸟6.0/SeaMonkey 2.3)，参数消息必须是字符串；第二个参数是域名限制。当域名不受限制时，填写 *
四、父页面接收子页面的消息
//监听消息event window . addevent listener( message ，函数receive messagefromframepage(event){ console . log(这里是子页面发来的消息，消息内容在event.data属性，event)}，false)；postMessage的安全问题
使用postMessage交互，默认情况下允许跨域行为。一旦允许跨域行为，就会出现一些安全问题。攻击邮件有两种主要方式。一是数据发送方(父页面)是伪造的，容易导致数据接收方(子页面)受到XSS攻击或其他安全问题；第二种是伪造数据接收者，类似于jsonp劫持。
1.伪造数据的发送者
攻击方法：伪造一个父页面，引导用户触发功能，向子页面发送消息。如果子页面直接将父页面发送的消息插入到当前的文档流中，就会触发XSS攻击，或者子页面会利用父页面发送的消息进行其他操作，比如写数据，这样就会产生安全问题。
防范方法：子页面iframe限制接收消息信息的域名。
//子页面iframePage.html//监听消息事件window . addevent listener( message ，Function(event){ origin=event . origin event . origin event . originif(origin= 3359 a . com ){ console . log(这里是从父页面收到的消息，消息内容在event.data属性，event )}}，false) II .虚假数据接收
攻击方式：伪造子页面，将子页面引入父页面，在伪造的页面中接收父页面发送的消息。这时候你就可以获得用户的敏感消息了。
预防措施：父页面限制发送消息的页面的域名。
//父页面index.html//获取iframe元素iframe=document . getelementbyid( iframe )//发送消息前加载iframe，否则子页面无法接收message iframe . onload=function(){//一旦加载iframe，发送消息iframe . content window . postmessage( messagefrommindexpage ， 3359 b . com )；}以上是本文的全部内容。希望对大家的学习和支持有帮助。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。