如何debuggingnetworking工作者

我一直在与HTML5的networking工作人员合作，并正在寻找debugging方法。 理想情况下，像萤火虫或铬debugging器。 有没有人有这个好的解决scheme。 没有访问控制台或DOM的那种难以debugging的ify代码

Answer 1

作为缺lessconsole.log的快速解决scheme，您可以使用throw JSON.stringify({data:data})

Answer 2

Chrome的开发版Chrome通过注入伪造工作者的实现来支持工作者的debugging，该工具在工作人员的客户端页面内使用iframe模拟工作人员。 您将需要导航到“脚本”窗格，并在右侧的“工作室”侧栏上勾选“debugging”checkbox，然后重新加载页面。 工作者脚本将出现在页脚本列表中。 但是，这种模拟有一定的局限性，因为worker脚本将在客户端页面线程中运行，所以worker中任何长时间运行的操作都会冻结浏览器UI。

Answer 3

在chromedebugging器中，在脚本选项卡中，滚动到工作面板，并select开始暂停..它将允许您debugging一个工人，并插入断点..但你做所有这一切在不同的窗口

Answer 4

WebWorker可以像正常的网页一样进行debugging。 Chrome为chrome：// inspect /＃workers提供WebWorkers的debugging开发工具。

find所需的运行webworker，然后单击“检查”。 一个单独的开发工具窗口将打开专用于该webworker。 官方[说明] [2]值得检查。

Answer 5

和Chrome v35一样

• 加载您的网页并打开Chrome开发者工具。
• 导航到源选项卡。

• 选中“开始暂停”checkbox，如下图所示：

  

• 重新加载页面，debugging器将暂停在networking工作者，但在一个新的窗口！

编辑：在较新版本的Chrome中（我正在使用v39），工作人员在“线程”选项卡下，而不是拥有自己的“工作人员”选项卡（如果有任何正在运行的工作人员，线程选项卡将变为可见）。

Answer 6

你可以使用self.console.log('your debugging message')

Answer 7

接受的答案并不是每个人的解决scheme。

在这种情况下，您可以在Firefox的Web Workers中使用console.log或console.debug或console.error 。 请参阅错误＃620935和错误＃1058644 。

如果您使用的是Chrome浏览器，则可以像debugging普通脚本一样debuggingWeb工作人员，但是如果您使用console.log，则会将其打印到您的选项卡中。 但是如果你的工作人员是共享的，你可能想看看chrome://inspect 。

额外的提示：因为工作人员很难学习JavaScript新手，所以我为他们编写了一个非常轻量级的包装，为这两种types的工作者提供了一致的API。 这就是所谓的工人交换 。

Answer 8

除了JSON.stringify（）之外，还有port.postMessage( (new Object({o: object})) ) 。 也许使用它与JSON.stringify会更有帮助。

希望这是有帮助的！

Answer 9

2016年2月，WebStorm发布了对Web工作人员的debugging支持。

WebStorm JavaScriptdebugging器现在可以在这些后台工作者中find断点。 您可以像浏览习惯一样浏览框架和探索variables。 在左侧的下拉列表中，您可以在工作线程和主应用程序线程之间跳转。

Answer 10

一个简单的解决scheme来获取来自工作者的消息/数据以进行debugging，就是使用工作线程中的postMessage()来传回您想要的debugging信息。

这些消息可能会在你的父进程的onmessage处理函数中被“捕获”，这可能会将从worker传回的消息/数据logging到控制台。 这具有作为非阻塞方法的优点，并且允许工作进程作为真正的线程来运行并且在通常的浏览器环境中被debugging。 虽然像这样的解决scheme不能实现工作进程代码的断点检测，但是在很多情况下，它提供了在工作进程中根据需要公开尽可能多或者less的数据以帮助debugging的能力。

一个简单的实现可能如下所示（相关摘录显示）：

//工作者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... } };