Chrome的Dev频道版本支持通过注入模拟使用iframe的假工作者实现工作者的调试。您需要导航到脚本窗格并在右侧的Workers侧边栏上勾选Debug复选框,然后重新加载页面。然后,工作脚本将出现在页面脚本列表中。但是,这种模拟有一定的局限性--由于工作者脚本将在客户端页面线程中运行,因此工作者中的任何长时间运行的操作都会冻结浏览器UI。
chrome://inspect
似乎是最好的选择。它可以让您为共享工作者的运行时打开一个控制台。 - Alec HewittWebWorker可以像普通网页一样进行调试。Chrome在chrome://inspect/#workers提供了WebWorker的调试工具。
找到需要调试的正在运行的WebWorker,然后点击“检查”。将会打开一个专门用于该WebWorker的调试工具窗口。官方的说明值得参考。
throw JSON.stringify({data:data})
。postMessage
,而不进入被调用者/worker代码。 - WestCoastProjectsasync
的话(请注意,截图/视频并没有显示它为异步..)。否则它就不起作用。 - WestCoastProjects在Chrome v35中
加载您的页面并打开Chrome开发者工具。
导航到 Sources 选项卡。
勾选 Pause on Start 复选框,如下所示:
重新加载页面,调试器将会停在Web Worker中,但在新窗口中!
编辑:在更新的Chrome版本中(我正在使用v39),工作者位于“ Threads” 选项卡下,而不是拥有自己的“ Workers”选项卡(如果有任何运行中的工作者,则“ Threads”选项卡将变为可见)。
self.console.log('您的调试信息')
。一种简单的解决方案,以便从工作线程中获取消息/数据进行调试的目的是使用postMessage()
,从工作线程中传回所需的调试信息。
然后,这些消息可以在父进程的onmessage
处理程序中“捕获”,例如将从工作线程传回的消息/数据记录到控制台。这具有非阻塞的优点,并允许工作进程作为真实线程运行并在通常的浏览器环境中进行调试。虽然这样的解决方案不能启用对工作进程代码的断点级别检查,但对于许多情况,它提供了从工作进程内部公开所需的尽可能多或尽可能少数量的数据来帮助调试。
一个简单的实现可能如下所示(显示相关摘录):
// 在工作线程的onmessage
函数范围中的某个位置(根据需要使用):
postMessage({debug:{message:"This is a debug message"}});
// 在父级的 onmessage
处理程序中:
myWorker.onmessage = function(event) {
if(event.data && event.data.debug) {
// handle debug message processing here...
if(event.data.debug.message) {
console.log("message from worker: %o", event.data.debug.message);
}
} else {
// handle regular message processing here...
}
};
console.log
或console.debug
或console.error
。请参见Bug#620935和Bug#1058644。chrome:// inspect
。
debugger;
了吗? - Ruan Mendes