如何将控制台添加到客户端页面

Question

我正在寻找一种使控制台可见并能够接受来自 node.js 电子应用程序客户端的输入的方法。 需要明确的是，这是我开发的一个应用程序，供我个人使用，用于帮助从本地 excel 文件构建图表和报告，因此安全性不是问题。

我将我的数据保存为 JS 对象，用于提供我的图表和表格。 然而，每隔一段时间，我需要从一个对象访问数据，因为它的稀有性而不值得创建客户端进程。 有没有办法让控制台在我的应用程序的客户端可见，这样我就可以从控制台中的全局对象快速查找数据？

谢谢，西和弦

Answer 1

您可以覆盖console.log的默认行为以改为打印到页面：

 console.log = function(text){ document.body.insertAdjacentHTML('beforeend', `<div class='log'><div class='text'>${text}</div><div class='time'>${new Date().toLocaleString()}</div></div>`) } console.log('Hello World!') console.log('Log #2')

 .log{display:flex;justify-content:space-between;padding:15px 20px;border-bottom:1px solid grey;margin-bottom:5px}.log .text{font-weight:bold}

为了让用户像在控制台中一样输入，您可以使用eval来评估他们的 JS：

 console.log = function(text){ document.body.insertAdjacentHTML('beforeend', `<div class='log'><div class='text'>${text}</div><div class='time'>${new Date().toLocaleString()}</div></div>`) } window.onerror = function(text){ document.body.insertAdjacentHTML('beforeend', `<div class='log danger'><div class='text'>${text}</div><div class='time'>${new Date().toLocaleString()}</div></div>`) } btn.addEventListener('click', function(){ eval(input.value) })

 .log{display:flex;justify-content:space-between;padding:15px 20px;border-bottom:1px solid grey;margin-bottom:5px}.log .text{font-weight:bold}.danger{background-color:tomato}

 <input id="input"><button id="btn">Execute</button> <br><br> Try entering something like: console.log('hi')