从JavaScript以编程方式打开Safari/Google Chrome开发工具

我正在寻找一种从附加到网页的脚本打开WebKit“开发者工具”的方法。我需要Google Chrome和Safari的解决方案，如果开发者工具窗格还没有打开，它将打开，并且（希望，如果你能弄清楚如何打开的话）在打开时也会切换到该窗格的特定选项卡/部分

（如果有人感兴趣，请使用用例：如果出现错误并且开发人员正在查看页面，我想打开

console.log

output窗口；此特定页面将是一些JavaScript单元测试的输出。）

---

我在这个问题上悬赏，因为这显然是一个以前没有得到任何人满意的回答的问题，而答案是毛茸茸的。请不要回答这个问题，除非你有一个真正的答案：1）在两种浏览器中都能工作，2）不需要在静态网页上无法工作的私有扩展API

---

请参阅（与Chrome相关但特定于Chrome和扩展）：

您不能从网页直接使用Chrome的开发工具。它与浏览器捆绑在一起

但您可以像使用常规web应用程序一样使用它。转到Chrome开发者工具，然后转到。您将找到有关为应用程序使用开发工具的帮助

设置

• 在Mac OS/Windows上安装Chrome Canary或从Linux上的Chrome continuous builds存档下载最新的Chrome版本
• 从中克隆Blink git回购
• 设置本地web服务器，在某些端口（8090）上提供来自WebKit/Source/WebCore/inspector的文件

跑步

• 使用以下命令行标志运行Chrome Canary的一个副本：--远程调试端口=9222--用户数据目录=闪烁/chromeServerProfile--远程调试前端=”http://localhost:8090/front_end/inspector.html". 这些标志使Chrome允许websocket连接到localhost:9222，并从本地git repo为前端UI提供服务。（将chromeServerProfile的路径调整为系统中的某个可写目录）
• 打开一个示例页面（如www.chromium.org）
• 使用命令行标志运行Chrome Canary的第二个副本：--user data dir=/work/chromeClientProfile。打开

  http://localhost:9222

  。在这些缩略图中，您将看到来自其他浏览器实例的示例页面。单击它开始远程调试示例页面
• 打开的DevTools网页由第一个浏览器实例中的远程调试前端提供服务，该实例由本地文件系统的git repo提供服务。调试此Devtools网页并像任何其他Web应用程序一样编辑其源代码

---

我希望这就是您所需要的。

除了通过提供主要日志记录功能的脚本之外，无法从页内脚本控制web developer工具。让脚本控制更多的内容将是一个严重的安全问题，因为它将允许网页控制浏览器的某些部分

与您尝试执行的操作远程相关的唯一API是命令，只有在开发人员工具已打开时，该命令才会切换到脚本窗格

但是你想为谁开发这个功能呢

如果是针对在站点上工作的开发人员，那么最好通过设置断点或暂停异常切换手动使用现有的开发人员工具

如果是针对最终用户，不要。除非你的网站应该被高技术的web开发人员使用，否则如果开发人员工具突然出现错误，你只会吓跑用户

---

如果您真的想显示错误，您可以实现自己的日志框架和错误报告UI，它与basic JS一起工作，不依赖于特定的浏览器环境。

否，任何安全浏览器都不允许脚本打开扩展，因为这会导致不安全

但是，您可以设计一个附加组件/扩展或控制台API来实现同样的功能。。对于特定站点

创建一个附加组件以满足该需求

您可以尝试发送“CTRL”+SHIFT+I”键 这可能适用于任何FireFox浏览器（也就是说，你需要使用'F12'

我在需要时使用它，因为在这个附加使用中只有很少的UTIL比内置的更好地工作

编辑： 现在，Chrome有了许多新的进步

我希望这有帮助！

简单地说：你不能

开发工具没有沙盒（与任何网页不同），因此授予沙盒环境打开和控制未沙盒环境的能力是一个主要的安全设计缺陷

---

我希望这能回答您的问题：-）

这里有另一个答案，它为您提到的用例/目标（检测错误、获取和显示控制台日志）提出了解决方案，而不是标题中不可能实现的目标

您可以制作和使用控制台包装器，并在代码中使用它

---

和/或如果使用/导入外部js，您可以使用控制台功能，但在加载它们之前需要应用它。

如果可能，应该修复它。网页不能访问浏览器的界面。您应该考虑为此编写一个扩展或独立应用程序。如果通过扩展这样做是所有可能的，那么这仍然是一个可接受的答案；只要为所有通用浏览器提供了方法，我就可以提供扩展垫片，在所有浏览器中公开单个界面。您是否想过在您的开发环境中简单地在弹出窗口中插入控制台日志输出，而不是打开开发工具？对于JS错误和性能数据，我们都是这样做的。在开发环境中运行时，我们在页面底部插入一个小弹出窗口，开发人员可以单击该窗口进行扩展，查看日志以及每次调用（常规回发和AJAX）到服务器的往返时间。Riateche是对的。你问什么，妈