搜狗浏览器如何使用内置的JSON格式化工具 搜狗浏览器开发者工具JSON视图教程

搜狗浏览器支持JSON格式化功能，可通过开发者工具的“网络”选项卡捕获JSON响应并自动以树状结构展示；在“控制台”中使用JSON.stringify(JSON.parse())方法可手动美化粘贴的JSON文本，便于查看层级与复制使用。

如果您在使用搜狗浏览器进行网页开发或调试时接收到未格式化的JSON数据，可能难以阅读和分析。内置的开发者工具提供了JSON格式化视图功能，可自动美化并结构化显示JSON内容，便于查看字段层级与数据类型。

本文运行环境：联想小新Pro 16，Windows 11

一、启用开发者工具并加载JSON响应

通过开发者工具捕获网络请求中的JSON数据是使用格式化功能的前提。该操作能确保浏览器识别响应内容类型为application/json，从而激活内置的结构化视图。

1、打开搜狗浏览器，访问包含JSON接口调用的网页，例如通过Ajax请求获取用户信息的页面。

2、按下 F12 键启动开发者工具，切换到“网络（Network）”选项卡。

3、刷新页面或触发相关操作，使浏览器发出新的网络请求。

4、在网络列表中查找类型为 fetch 或 xhr 的请求，点击进入详情页。

二、查看自动格式化的JSON数据

当响应内容为合法JSON时，搜狗浏览器会自动将其转换为可展开的树状结构，省去手动解析原始文本的麻烦。

1、在请求详情面板中，点击“响应（Response）”子标签页。

Find JSON Path Online

Easily find JSON paths within JSON objects using our intuitive Json Path Finder

30

查看详情

2、若服务器返回的是标准JSON格式，内容将自动以缩进和高亮方式呈现，并支持节点折叠。

3、对象和数组前会出现小箭头图标，点击即可展开或收起内部结构。

4、字符串、数字、布尔值等数据类型会以不同颜色区分，提升可读性。

三、手动格式化粘贴的JSON文本

对于复制的原始JSON字符串或从其他来源获取的内容，可通过控制台实现快速格式化输出。

1、切换至开发者工具的“控制台（Console）”选项卡。

2、输入以下代码并回车执行：JSON.stringify(JSON.parse(你的JSON变量), null, 2)。

3、将其中“你的JSON变量”替换为实际的JSON字符串或已定义变量名。

4、格式化后的结果将以缩进为2个空格的美化形式输出到控制台，可直接复制使用。

以上就是搜狗浏览器如何使用内置的JSON格式化工具 搜狗浏览器开发者工具JSON视图教程的详细内容，更多请关注php中文网其它相关文章！