如何从控制台从iframe捕获日志？
如何从控制台从iframe捕获日志？
提问于 2020-06-30 19:08:27
我希望从我的iFrame标记中获取控制台中的日志，并将其显示在另一个元素中。
window.console = {
log: function(str){
let node = document.createElement("li");
node.appendChild(document.createTextNode(str));
document.getElementById("consoleMsgHere").appendChild(node);
}
}此代码能够从文档中获取通用控制台，但无法从iframe标记捕获日志。
任何帮助都将不胜感激。
回答 1
Stack Overflow用户
发布于 2020-06-30 19:58:33
这是一个非常基本的例子。唉，由于iframe的限制，我不能提供代码片段。因此，这是一个复制到dekstop的例子。
基本上，我将您的log()更改为window.top.postMessage()，而在window.top上，我们在message上添加了一个侦听器，它处理传入的消息。有关更多细节，请咨询文档。
<html>
<head>
<script>
//REM: Overwriting console.log()
window.console = {
log: function(str){
//REM: Forward the string to the top window.
//REM: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
window.top.postMessage(str, '*');
}
};
//REM: Listening to messages
window.addEventListener('message', function(event){
//REM: Just appending it to the body.. lazy
document.body.appendChild(document.createTextNode(event.data))
}, false);
//REM: Just required for the demo..
window.onload = function(){
if(window.top !== window.self){
//REM: Changing the color of the body to distinguish iframe and not iframe
document.body.style.background = 'limegreen'
}
else{
//REM: Adding itself as an iframe to demostrate the logic while being lazy
document.body.appendChild(document.createElement('iframe')).src = window.location.href
}
}
</script>
</head>
<body>
<input type = 'text' value = 'test' onchange = 'console.log(this.value)' />
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/62664558
复制相关文章
相似问题
腾讯云开发者
