javascript `未捕获的类型错误：使用 EasyXDM 发送跨域消息时，无法读取未定义的属性 'postMessage' 错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24476781/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
`Uncaught TypeError: Cannot read property 'postMessage' of undefined ` error while sending cross domain messages using EasyXDM
提问by Shiva Pareek
I am trying to make a data exchange system between two websites at their client sides. I am using EasyXDM for this. (http://easyxdm.net/). Here is my code of parent website:
我正在尝试在客户端的两个网站之间建立数据交换系统。我为此使用 EasyXDM。（http://easyxdm.net/）。这是我的父网站代码：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>EasyXDM Test</title>
<script type="text/javascript" src="easyXDM.debug.js"></script>
<script type="text/javascript">
var serv_socket = new easyXDM.Socket({
remote: "http://localhost:39452/EasyXDM/Default.aspx",
onMessage: function (message, origin) {
document.getElementById('msg').innerText="Received '" + message + "' from '" + origin + "'";
},
onReady: function () {
serv_socket.postMessage("ID");
}
});
</script>
</head>
<body>
<form id="form1">
<div>
<iframe src="http://localhost:39452/EasyXDM/Default.aspx"></iframe>
<input type="text" id="msgtext" /><a href="#" onclick="serv_socket.postMessage('d')">Send message</a>
<div id="msg"></div>
</div>
</form>
</body>
</html>
And below is the child website's code that is located at localhost:39452domain:
以下是位于localhost:39452域的子网站代码：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Server</title>
</head>
<body>
<form id="form1">
<input type="text" id="msgtext" />
<div>
<script type="text/javascript" src="easyXDM.debug.js"></script>
<script type="text/javascript">
var socket = new easyXDM.Socket({
onMessage: function (message, origin) {
//document.getElementById('msg').innerText="Received '" + message + "' from '" + origin + "'";
socket.postMessage(message);
},
onReady: function (msg) {
socket.postMessage(msg);
}
});
function send() {
socket.postMessage('this is message from server');
}
</script>
<a href="#" id="sender" onclick="send()">Send message</a>
</div>
</form>
</body>
</html>
The problem is that, when I click Send messageon child website and call socket.postMessage()it says Uncaught TypeError: Cannot read property 'postMessage' of undefined.. Please tell me how to solve this issue?
问题是，当我点击Send message子网站并调用socket.postMessage()它时说Uncaught TypeError: Cannot read property 'postMessage' of undefined.。请告诉我如何解决这个问题？
Update:socketis becoming null or undefined somehow.
更新：socket不知何故变为空或未定义。
采纳答案by Shiva Pareek
I found the solution finally here: https://stackoverflow.com/a/13122604/1576363.
I removed the iframefrom parent and added containerproperty of the socket to the idof a divand it worked. The reason for this was that the EasyXDM code automatically adds an iframeto your document. If you add iframewith the URL of child, you will get this error. From the linked answer, here is the clear explanation:
我终于在这里找到了解决方案：https: //stackoverflow.com/a/13122604/1576363。我iframe从父级中删除了container，并将套接字的属性添加到了ida 中，div并且它起作用了。这样做的原因是 EasyXDM 代码会自动iframe向您的文档添加。如果iframe使用 child 的 URL添加，则会出现此错误。从链接的答案中，这里有明确的解释：
The "consumer" is the parent document, and EasyXDM loads the "provider" which is the child iframe.
“消费者”是父文档，EasyXDM 加载“提供者”，即子 iframe。
