Async360/traceback-lens

GitHub: Async360/traceback-lens

一个纯客户端运行的 JavaScript 堆栈跟踪还原工具,通过 source map 将压缩后的生产环境报错映射回原始源码位置,且所有数据不上传任何服务器。

Stars: 0 | Forks: 0

# traceback-lens 一个小巧、完全在客户端运行的实用工具,用于将压缩后的生产环境 JavaScript 堆栈跟踪还原回原始的文件/行号/列号位置,它通过 source map 来实现。只需粘贴堆栈跟踪和 source map(或选择本地的 `.map` 文件),它就会尽可能解析出每一帧的信息。 **在线演示:https://Async360.github.io/traceback-lens/** ## 为什么会有这个工具 解密生产环境堆栈跟踪的常用方法是,将压缩后的堆栈跟踪和 source map 上传到错误追踪 SaaS。这意味着你要将你的 source map(实际上就是你未压缩的源代码)交给第三方,仅仅为了查看一个错误。 traceback-lens 则完全在浏览器中完成这项工作。没有后端,没有构建步骤,页面加载完成后也不会发起任何形式的外部请求: **一切都在你的浏览器中运行。你粘贴的任何内容都不会被上传到任何地方。** 在使用时打开浏览器开发者工具的 Network 标签页——除了初始页面加载外,你不会看到任何其他网络请求。 ## 如何使用 1. 打开 `index.html`(或访问[在线演示](https://Async360.github.io/traceback-lens/))。 2. 将堆栈跟踪粘贴到左侧文本框中。 3. 将匹配的 source map 原始 JSON 粘贴到右侧文本框中,或者使用“选择本地 .map 文件”从磁盘加载。 4. 点击“解析堆栈跟踪”。 每一个被识别出的帧都会被解析为其原始的源文件、行号和列号(如果 source map 中包含该帧的 `names` 条目,还会显示原始函数名)。 ## 支持的堆栈跟踪格式 - **V8 / Chrome / Node,带函数名:** ` at functionName (file.js:10:5)` - **V8 / Chrome / Node,不带函数名:** ` at file.js:10:5` - **Firefox:** `functionName@file.js:10:5`,包括被写为 `@file.js:10:5` 的匿名帧 Safari 的堆栈跟踪格式与 Firefox 非常相似,因此在常见情况下通常也能正确解析,但我们并没有对其进行专门处理或提供保证——请将其视为尽力而为。对于不符合任何已知格式的行(例如堆栈跟踪顶部的错误消息行,或不常见的 eval 包裹的帧),会被直接跳过,而不会导致程序报错。 ## Source Map v3 支持 `sourcemap-core.js` 直接实现了 Source Map v3 规范中的 Base64-VLQ 解码器和 `mappings` 解析器——本项目没有在任何地方使用第三方的 source map 库。 支持功能: - 标准(非索引型)Source Map v3 文档:`version`、`sources`、`names` 和 `mappings`。 - 所有三种段形状(每个段包含 1、4 或 5 个 VLQ 字段)。 - 忽略 `sourcesContent`(解析位置不需要它)。 **已知限制:** 不支持索引型/分节型 source map——即结构类似于 `{"version":3,"sections":[...]}` 而不是单个顶层 `mappings` 字符串的文档。如果粘贴此类文件,会显示明确的错误提示,而不会静默产生错误的结果。 ## 架构 - `sourcemap-core.js` - 纯逻辑,无 DOM 访问:包含 VLQ 解码器、`mappings` 解析器、`originalPositionFor` 以及堆栈行解析器。这部分拥有真正的单元测试覆盖。 - `app.js` - 轻量级 DOM 绑定:读取两个文本区域,调用 `sourcemap-core.js`,并渲染结果表格。 - `index.html` / `style.css` - 页面本身。 没有框架,没有打包工具,也没有任何形式的依赖。`index.html` 将 `app.js` 作为原生 ES module 加载,后者随后导入 `sourcemap-core.js`——两者均无需修改即可在任何现代浏览器中运行。 ## 运行测试 ``` node --test ``` `test/sourcemap-core.test.js` 中的测试套件涵盖: - 手动计算的 Base64-VLQ 向量(`0` -> `"A"`,通过 zigzag 编码处理的小正数和负数,以及测试延续位的多字符值)。 - 一个小型的手动构建的测试用例 source map(包含两个原始文件,跨越两行生成代码的三个映射段),其预期的解码映射和 `originalPositionFor` 结果均为手动编写,其中包括一个专门用于捕获在生成行边界处重置错误累加器这一典型 bug 的测试用例。 - 对每种支持格式的堆栈行解析,以及对畸形/空/非字符串输入的优雅处理(返回 `null`,绝不抛出异常)。 ## 许可证 MIT - 查看 [LICENSE](LICENSE)。
标签:SOC Prime, Source Map, Syscall, Web开发, 代码还原, 前端, 多模态安全, 开发工具, 数据可视化, 自定义脚本, 错误追踪