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

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

53
0
0
0

功能特性

错误堆栈追踪解析器 提供了全面的堆栈追踪解析和 Source Map 映射功能。以下是各功能模块的详细介绍:

四种浏览器堆栈格式支持

工具能够解析四种主流浏览器和运行环境生成的堆栈追踪格式。Chrome/V8 格式的堆栈以 "at" 关键字开头,格式为 "at 函数名 (文件路径:行号:列号)";Firefox/SpiderMonkey 格式使用 "函数名@文件路径:行号:列号" 的结构;Safari/JavaScriptCore 格式为 "函数名@文件路径:行号"(通常不包含列号);Node.js 格式与 Chrome 格式类似,但在模块系统的文件路径表示上有所不同。工具会自动检测输入堆栈的格式类型,用户无需手动选择格式,即可获得准确的解析结果。

Source Map URL 加载

支持通过 URL 地址加载远程 Source Map 文件。用户只需在 Source Map 地址输入框中填入 .map 文件的 URL,工具会自动发起请求获取文件内容并解析其中的映射关系。URL 加载方式适合 Source Map 文件托管在 CDN 或开发服务器上的场景。工具支持跨域请求,当目标服务器配置了 CORS 头信息时,可以直接从浏览器端加载远程 Source Map。加载完成后,工具会缓存 Source Map 数据,避免重复请求。

直接粘贴 Source Map JSON

支持直接将 Source Map 的 JSON 内容粘贴到工具的输入区域。Source Map 文件本质上是一个 JSON 格式的映射数据,包含了版本号(version)、源文件列表(sources)、映射数据(mappings)等字段。用户可以从构建工具的输出目录中复制 Source Map 文件的内容,然后粘贴到工具中即可使用。这种方式适合在无法直接访问远程文件或需要分析本地构建产物的场景中使用。

拖拽上传 .map 文件

支持通过拖拽操作将本地的 .map 文件上传到工具中进行解析。用户只需将 Source Map 文件从文件管理器拖拽到工具的上传区域,文件内容会自动被读取和解析。该方式是加载本地 Source Map 文件最便捷的操作方式,特别适合在本地开发和调试环境中使用。工具支持同时上传多个 .map 文件,用于解析涉及多个源文件的复杂堆栈追踪。

VLQ 解码器

内置了一个 VLQ(Variable Length Quantity)解码器,支持将 VLQ 编码的字符串解码为对应的整数值。Source Map 文件的 mappings 字段中大量使用 Base64-VLQ 编码来存储行列号的偏移量。用户可以在 VLQ 解码器中输入 VLQ 编码字符串,工具会将其解码为原始的整数序列,并展示每个编码值对应的实际含义(如列号偏移、源文件索引偏移、原始行号偏移等)。该功能适合想要深入了解 Source Map 内部数据结构和编码原理的开发者。

解析结果表格

解析结果以结构化的表格形式展示,包含以下列信息:序号、函数名称(Function)、源文件路径(File)、行号(Line)、列号(Column)和原始位置(Original Position)。表格中的每一行对应堆栈追踪中的一条调用记录,按照调用顺序从上到下排列。如果堆栈中某一行无法通过 Source Map 进行映射(如第三方库代码或内联代码),该行会在原始位置列中显示原始的压缩代码位置。表格支持排序和搜索功能,帮助开发者快速定位关键的调用帧。

复制结果与导出 JSON

提供了一键复制解析结果的功能,用户可以将表格中的数据以文本格式复制到剪贴板。此外,工具还支持将完整的解析结果导出为 JSON 格式文件,包含堆栈信息、映射结果、统计信息等完整的数据结构。导出的 JSON 文件可以直接集成到自动化错误监控流程中,用于错误追踪系统的数据预处理。导出功能帮助开发者将解析结果与其他开发工具和平台进行集成。

堆栈统计信息

工具在解析完成后会自动计算并展示堆栈的统计信息,包括四个关键指标:(1) 堆栈总行数——输入的堆栈追踪信息中包含的调用帧总数;(2) 解析成功数——成功通过 Source Map 映射到原始位置的调用帧数;(3) 涉及文件数——堆栈追踪中涉及的不同源文件数量;(4) 映射成功率——成功映射的调用帧数占总调用帧数的百分比。这些统计信息帮助开发者快速评估堆栈信息的可调试性,映射成功率越高,调试效率越高。