不同源客户端两个页面之间的跳转实现
chrome下
在10.11.888.32服务器上的index.html代码
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>-window.postMessage()跨域消息传递</title>
</head>
<body>
<button id="send" >发送消息</button>
<script>
window.onload = function() {
var btn = document.getElementById('send');
btn.addEventListener('click', function (e) {
var receiver = window.open('http://10.11.555.155/index.html');
e.preventDefault();
setTimeout(function(){
receiver.postMessage("Hello ", "http://10.11.555.155/index.html");
}, 1000);
});
}
</script>
</body>
</html>在10.11.555.155服务器上的index.html代码
window.addEventListener('message',receiveHandle, false)
function receiveHandle(event){
console.log(event);
if(event.origin==="http://10.11.888.32"){
alert('获取信息：'+ event.data);
}
}IE下
在10.11.555.32服务器下
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>-window.postMessage()跨域消息传递</title>
</head>
<body>
<button type="button" id="send" >发送消息</button>
<script>
window.onload = function() {
var btn = document.getElementById('send');
btn.onclick = function (e) {
var receiver = window.open('http://10.11.555.155/index.html','_blank');
e.preventDefault();
setTimeout(function(){
receiver.postMessage("Hello ", "http://10.11.555.155/index.html");
}, 1000);
};
}
</script>
</body>
</html>在10.11.555.155服务器下
window.addEventListener('message',receiveHandle, false)
function receiveHandle(event){
console.log(event);
if(event.origin==="http://10.11.55.32"){
alert('获取信息：'+ event.data);
}
}
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。