iframe跨域传参

394 阅读1分钟

A页面

<!DOCTYPE html>
<html lang="en">
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
    <title>Document</title>
</head>

<body>  
    <iframe id="iframe" src="地址" style="display:none;"></iframe>
</body>

<script>  
var iframe = document.getElementById('iframe');  
iframe.onload = function () {    
    var data = {name:'我是传递的参数'};    
    // postMessage(data,origin);    
    // data:传递的参数,最好转成json    
    // origin: 设置 * 代表可以传给任意的页面, 设置成 / 代表必须是跟当前页面是同源的关系    
    iframe.contentWindow.postMessage(JSON.stringify(data), '*');  };
</script>

</html>

B页面

  window.addEventListener('message', function (e) {    
    console.log(e.data,'接收的参数');  
   }, false);