Storyboard DevTools

使您能够访问配备 Storyboard 的应用程序的端到端故事（日志）

但为什么要使用故事板呢？ (http://guigrpa.github.io/storyboard/)

* 分层故事：将日志放入上下文（故事）中，并将其分组为更高阶的故事；它们可以成为并发用户操作和异步事件的救星。
* 端到端故事：在一个位置查看由用户操作（可能是单击“登录”按钮）触发的所有客户端和服务器任务。
* Storyboard DevTools Chrome 扩展：使用干净且详细信息丰富的界面查看客户端和服务器日志，包括远程监控（适用于移动设备和非 Chrome 浏览器）和相对时间戳等高级功能。
* Storyboard CLI：用它包装任何应用程序（无需更改）以使用 Storyboard DevTools 远程监控它。
* 通过 WebSockets 将服务器日志实时推送到 Storyboard DevTools 扩展，并可选择客户端-服务器时钟同步。更重要的是：远程控制从服务器各个部分获得的详细信息级别，而无需重新启动。
* 安全服务器日志：远程访问是可选的，并且可以进行身份​​验证。
* 将任何内容附加到您的日志中以供进一步调查。
* 插件架构。可用的插件包括控制台、WebSocket 服务器和客户端、文件、(PostgreSQL) 数据库和浏览器扩展，但您也可以编写自己的插件！
* 轻的。插件现在 (v3) 可以单独使用，因此您只需引入实际使用的依赖项即可。
* 丰富的过滤选项：提供日志来源和严重性属性，并应用细粒度过滤，包括白名单和黑名单。
* 色彩丰富：使用颜色来传达意义和重要性。 Storyboard 扩展了流行的 chalk 库，使其也可以在浏览器上使用。
* 享受简单而强大的 API。

您将在 Chrome 开发工具中找到一个新的“故事板”窗格。将浏览器指向普通服务器或 Storyboard 的独立日志服务器并登录（如果需要）。

一些值得强调的 DevTools 功能：

* 修改服务器的过滤器配置，无需重新启动服务器。
* 按时间顺序（“平面”）或按层次（“树”）显示故事：将鼠标悬停在故事标题上即可显示按钮。
* 折叠/展开故事：单击插入符号。即使故事被折叠，也可以通过特殊图标检测到它们包含错误或警告。
* 打开附件和例外：单击文件夹图标。
* 在 3 种时间戳格式中进行选择：UTC、本地时间或相对于现在的时间：单击任意时间戳。
* 设置参考时间戳：右键单击或按住 Control 键单击任何时间戳。
* 使用快速查找（不区分大小写）来突出显示您要查找的内容。
* 将相同的、连续的消息压缩到一个方便的摘要行中。
* 配置 Storyboard 何时以及如何“忘记”旧日志和故事。
* 根据您的喜好自定义颜色！

Storyboard 库可在此处找到：http://guigrpa.github.io/storyboard/（或者只需单击下面的网站按钮）。

演示：https://storyboard-bhibtchlhy.now.sh/（可能有点慢<—免费托管！）

关于权限的说明：

“读取和更改您访问的网站上的所有数据”权限听起来非常可怕，但需要向域（与应用程序的同一域）发送请求。它不用于其他任何用途。