js跨域传值

2019-08-24  本文已影响0人  进击的三文鱼

iframe嵌套服务器页面,怎么实现跨域 父页面与iframe页面的js函数互相调用?
今天在用子页面调用父页面时出现跨域问题 报错信息 from accessing a cross-origin frame
最终找到一个很简单的处理方式 代码也很少
使用技术是通过HTML5 postMessage
  不同域之间的跨域请求 使用postMessage。postMessage是HTML5新增的方法,简单易用高大上

   function showShopCarNum(num) {
  
            window.parent.postMessage(num, '*');
        }

父页面使用监听方法 实现父页面与子页面之间的通信
//监听子页面实现通信

window.addEventListener('message', function (e) {
    var data = e.data;
    $("#shopCarNum").val(data);
}, false);

后期发现 window.parent.postMessage(num, '*'); 存在安全问题
要指定传输的地址 * 是所有域名都可以接受 不安全
所以改成

window.parent.postMessage(num, 'http://localhost:8081');

这样只有http://localhost:8081的父域可以接收

上一篇 下一篇

猜你喜欢

热点阅读