Js 不同源页面数据传递问题。
你好。已经在A页面（Id='pageA'）取得了数据'aaa'。现在B页面（Id='pageB'）如何得到这个数据？是要用window.postMessage吗？能否写出...
你好。
已经在A页面（Id='pageA'）取得了数据'aaa'。
现在B页面（Id='pageB'）如何得到这个数据？
是要用window.postMessage吗？能否写出传递和接受'aaa'的代码。谢谢了 展开
已经在A页面（Id='pageA'）取得了数据'aaa'。
现在B页面（Id='pageB'）如何得到这个数据？
是要用window.postMessage吗？能否写出传递和接受'aaa'的代码。谢谢了 展开
1个回答
展开全部
你都已经知道答案了。最简单最有效的方法就是postMessage。其他方法应该只有flash的方法了，是最简单的了，至于flash我不懂，所以不方便说什么了，我就谈谈postMessage。
A页面：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<iframe id="pageB" src="b.html" frameborder="0"></iframe>
<button id="button">发送信息</button>
<script>
var button = document.querySelector("#button")
var pageB = document.querySelector("#pageB")
var innerWindow = pageB.contentWindow;
pageB.addEventListener('load', function(evt) {
button.addEventListener('click', function(e) {
innerWindow.postMessage("Page A发出信息", "http://localhost:3000")
})
})
</script>
</body>
</html>
B页面：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div id="content"></div>
<script>
var num = 0
window.addEventListener('load', function() {
window.addEventListener('message', function(e) {
if (e.origin === 'http://localhost:3000') {
var data = e.data
if (data === "Page A发出信息") {
num += 1
document.querySelector("#content").innerText += num + '次 ' + data + "\n";
}
}
})
})
</script>
</body>
</html>
这个是可以跨页面，跨域，只要接收的页面判断一下请求来源
安全问题可以认真看看，真的不需要多少时间
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
