无需登录 数据私有 本地保存

错误堆栈追踪解析器 - 提取源映射位置

53
0
0
0

关于 错误堆栈追踪解析器

错误堆栈追踪解析器 是一款专为 Web 开发者设计的在线工具,用于解析、分析和还原 JavaScript 错误堆栈追踪信息。当应用程序抛出异常时,浏览器和运行环境会生成一段堆栈追踪(stack trace)信息,其中包含了错误发生的调用链路、文件路径、行号和列号等关键调试信息。然而,在生产环境中,代码通常经过了压缩和混淆,堆栈追踪中的文件路径和行列号对应的是压缩后的代码位置,而非原始源代码。本工具通过加载 Source Map 文件,将压缩后的堆栈信息还原为原始源代码中的准确位置,极大地简化了线上错误的定位和调试过程。

本工具支持多种主流浏览器和运行环境生成的堆栈追踪格式,包括 Chrome/V8、Firefox/SpiderMonkey、Safari/JavaScriptCore 和 Node.js 四种格式。每种格式在堆栈信息的结构和命名上存在差异,本工具能够自动识别并正确解析这些不同格式的堆栈数据。

Source Map(源映射)是一种将压缩/编译后的代码映射回原始源代码的映射文件。现代前端构建工具(如 Webpack、Vite、Rollup、esbuild 等)在压缩代码时都会同时生成对应的 Source Map 文件。通过 Source Map 文件中的映射关系,本工具可以将压缩代码中的行号和列号准确还原为原始源代码中的位置信息,并显示对应的函数名、文件路径等信息。

本工具支持三种方式加载 Source Map 数据:通过 URL 加载远程 Source Map 文件、直接粘贴 Source Map 的 JSON 内容、以及通过拖拽操作上传本地的 .map 文件。灵活的加载方式适应了不同的使用场景和开发者偏好。

解析结果以结构化的表格形式呈现,包含函数名、文件路径、行号、列号和原始位置等关键信息。用户可以一键复制解析结果,也可以将结果导出为 JSON 格式方便进一步处理。工具还提供了堆栈统计信息,包括堆栈总行数、成功解析行数、涉及文件数和映射成功数,帮助开发者快速评估堆栈信息的完整性和可解析性。

此外,本工具还内置了一个 VLQ(Variable Length Quantity)解码器功能,允许开发者手动输入 VLQ 编码的字符串进行解码。Source Map 文件内部大量使用 VLQ 编码来存储行列号偏移量,了解 VLQ 的编码原理有助于深入理解 Source Map 的工作机制。