首页 > 代码库 > Html5 跨域通信
Html5 跨域通信
H5 跨域通信：
在主页面中通过iframe嵌入外部页面，通过iframe的window对象postMessage方法向iframe页面传递消息。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>跨域通信示例</title> 6 <script type="text/javascript"> 7 function hello(){ 8 var iframe = document.getElementById("iframe").contentWindow; 9 iframe.postMessage("hello, 这是主页面传过来的数据", "http://localhost/html5/b.html");10 }11 </script>12 </head>13 <body>14 <h1>跨域通信示例</h1>15 <iframe width="400" src="http://localhost/html5/b.html" onl oad="hello()" id="iframe">16 </iframe>17 </body>18 </html>iframe页面中通过对窗口对象的message事件进行监听，以获取消息。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <script type="text/javascript"> 6 window.addEventListener("message", getEvent, false); 7 function getEvent(event){ 8 alert("从" + event.origin + "那里传递过来的信息是:\n" + event.data); 9 }10 </script>11 </head>12 <body>13 iframe 页面14 </body>15 </html>
Html5 跨域通信
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。