Jua*_*iso 6 javascript iframe cross-domain
我有一个来自domain1.com的网页,我有一个domain2.com的iframe然后我在domain3.com的domain2.com里面有另一个iframe
我想在domain2.com拦截来自domain3.com的消息,如果domain2.com不在domain1.com内,则消息被正确接收,但如果我在domain1.com内有domain2.com则来自domain3.com的消息由domain1.com而不是domain2.com收到.有没有办法在domain2.com内捕获这些消息?
结构是这样的
domain1.com里面有iframe src ="domain2.com"domain2.com里面有iframe src ="domain3.com"
当我直接访问domain2.com时它捕获domain3.com消息,当我访问domain1.com时,domain3.com发送的消息由domain1.com而不是domain2.com接收
我试图重新创建你的iframe地狱.希望这是你正在寻找的.这应该涵盖您上面列出的方案.如果我误解了什么,请告诉我.
我也创造了一个Plunker
index.html(domain1)
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
domain 1
<form id="form">
<input type="text" placeholder="Enter message" name="message">
<input type="submit" value="Click to send">
</form>
<iframe src="domain2.html" id="iframe" style="display:block;height:120px"></iframe>
<script>
window.addEventListener('message', function(event){
const [message, domain] = event.data.split('|');
alert(`domain1: Received ${message} from ${domain}`);
});
form.onsubmit = function() {
iframe.contentWindow.postMessage(`${this.message.value}|domain1`, '*');
return false;
};
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
domain2.html
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
domain 2
<form id="form">
<input type="text" placeholder="Enter message" name="message">
<input type="submit" value="Click to send">
</form>
<iframe src="domain3.html" id="iframe" style="display:block;height:60px"></iframe>
<script>
window.addEventListener('message', function(event){
const [message, domain] = event.data.split('|');
alert(`domain2: Received ${message} from ${domain}`);
});
form.onsubmit = function() {
iframe.contentWindow.postMessage(`${this.message.value}|domain2`, '*');
return false;
};
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
domain3.html
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
domain 3
<form id="form">
<input type="text" placeholder="Enter message" name="message">
<input type="submit" value="Click to send">
</form>
<script>
window.addEventListener('message', function(event){
const [message, domain] = event.data.split('|');
alert(`domain3: Received ${message} from ${domain}`);
});
form.onsubmit = function() {
window.parent.postMessage(`${this.message.value}|domain3`, '*');
return false;
};
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
423 次 |
| 最近记录: |