我使用EasyXDM来处理跨域通信,以便父节点既知道子节点的大小又知道子节点的位置。我把尺寸调整好了。问题是,当我在iframe内导航时,我想将位置推回到父元素。
问题是,当我更改页面时,套接字无法再次创建,给我VM87 Core.js:324 Uncaught Error: url未定义或为空。
还有人遇到这个吗?
父(消费者):<script language="javascript">
(function () {
// CTOR has side effect of creating globals for socket
var socket = new easyXDM.Socket({
remote: "@(Model.Url)" + document.location.hash,
container: $("#pluginFrame")[0],
onMessage: function (message, origin) {
var messageAsObject = JSON.parse(message);
if (messageAsObject.height) {
$("#pluginFrame iframe").height(messageAsObject.height);
}
if (messageAsObject.path) {
document.location.hash = messageAsObject.path;
}
},
onReady: function() {
console.log("Shell Socket Ready");
$("#pluginFrame iframe").width("100%");
}
});
})();
</script>
Child(producer) Razor Layout
<script language="javascript">
(function () {
debugger;
var socket = new easyXDM.Socket({
onReady: function () {
console.log("eBox Ready");
socket.postMessage(JSON.stringify({
height: $(".body-content").outerHeight(),
path: document.location.pathname
}));
}
});
$("body-content")
.on("change",
function () {
socket.postMessage(JSON.stringify({
height: $(".body-content").outerHeight()
}));
});
$(document.location.pathname)
.on("change",
function () {
socket.postMessage(JSON.stringify({
path: document.location.pathname
}));
});
socket.postMessage(JSON.stringify({
path: document.location.pathname
}));
})();
</script>
从我所看到的一切来看,没有办法做到我所追求的。对于我最终试图解决的问题,将路由推入父节点的位置哈希,似乎唯一的解决方案是使用这里提到的双iframe方法。
根据内容调整iframe的大小