【JSON】谷歌浏览器JSON可视化插件：JSON-Handle

摘要 : JSON-handle是一款对JSON格式的内容进行浏览和编辑，以树形图样式展现JSON文档，并可实时编辑。
今天我推荐一款chrome/Firfox下处理json的插件JSON-handle，这个应该是我用过最好最方便的了。

插件功能
实际开发工作中经常用到json数据，那么就会有这样一个需求：在谷歌浏览器中访问URL地址返回的json数据能否按照json格式展现出来。

比如这样一串JSON串：

{"id": 11533550,"salesNo": "SO-PRD-DMS_0001675041_SUPPLIER-230510-00736","type": "SALES_OUT_PRODUCT","status": {"history": [{"value": "SUBMITTED","on": "2023-05-10T15:08:26.477","by": "dms_pt0001@qa.aws"},{"value": "SUBMITTING","on": "2023-05-10T15:06:39.17","by": "dms_pt0001@qa.aws"}],"value": "SUBMITTED","on": "2023-05-10T15:07:57.258437","by": "ADMIN"},"audit": {"history": [{"result": "WAITING_MANUAL_VALIDATION","note": "generic.error.configurationForAutoValidationNotExist","on": "2023-05-10T15:09:30.967","by": "user.salesout.audit.user.autoAuthenticationService"},{"result": "WAITING_AUTO_VALIDATION","note": "user.salesout.audit.comments.authenticationPass","on": "2023-05-10T15:08:45.377","by": "user.salesout.audit.user.autoAuthenticationService"},{"result": "WAITING_AUTO_AUTHENTICATION","on": "2023-05-10T15:06:39.17","by": "dms_pt0001@qa.aws"}],"result": "WAITING_MANUAL_VALIDATION","note": "generic.error.configurationForAutoValidationNotExist","on": "2023-05-10T15:09:30.967","by": "user.salesout.audit.user.autoAuthenticationService"},"contractId": "6e97c4d1-f334-4415-a31f-0b698f64ddff","customer": {"name": "xxxx医院","id": "DMS_H0000000080","type": "HOSPITAL"},"supplier": {"id": "DMS_0001675041_SUPPLIER","name": "xxx公司"},"superiorSupplier": {},"salesTeam": {"id": "Medtronic_AIRWAY","name": "AIRWAY"},"subDealer": {},"productLine": {"id": "Productline_CHN_RI","name": "RI"},"fiscalMonth": "2024-01","note": "test96","product": {"cfn": "8888247031","gtin": "10884521133105","batch": "pt2024042496","ubd": "2025-12-30","quantity": {"value": 1,"uom": "EA"},"category": {"name": "鼻咽通气道","path": "RI / Airway / AN / 鼻咽通气道1 / 鼻咽通气道","id": "CD61C4A0-24BB-49A0-9C8A-A75900AE2285"},"stockroom": {"id": "0001675041_SSPPartner","name": "xxx主仓库"},"origin": {"id": "Medtronic_AIRWAY","name": "AIRWAY"},"implantable": false,"stockInstanceIds": ["d22fd0ae-a844-4b14-b3f9-26fc5e2b871f"]},"prices": {"in": {"supplier": {}},"out": {"supplier": {"taxed": true,"taxRate": 0},"medtronic": {}}},"references": [],"evidences": [{"isFromMedtronic": false,"type": "DELIVERY_NOTE","number": "031700096"},{"isFromMedtronic": false,"type": "INVOICE","number": "49632237"}]
}

用浏览器打开浏览非常困难

安装JSON-Handle插件后打开后的效果：

瞬间整个JSON字串的结构一目了然，还能对JSON中的对象进行展开及收起，可以大大提升开发效率

Chrome插件安装方法

首先下载JSON-Handle插件到本地，如果无法访问谷歌，使用个人博客下载地址：https://download.csdn.net/download/baidu_31295661/87770839https://download.csdn.net/download/baidu_31295661/87770839
打开谷歌浏览器，进入Chrome扩展程序页面，两种方式：
1. 地址栏直接输入： chrome://extensions/
2. 添加扩展程序
3. 打开右上角的开发者模式
4. 将刚刚下载的.crx后缀文件直接拖动到扩展程序页面然后确定安装即可

谷歌商店安装方式：

https://chrome.google.com/webstore/category/extensions?hl=en-US

【JSON】谷歌浏览器JSON可视化插件：JSON-Handle相关推荐

bean json转kotlin_Android kotlin插件神器Json直接生成javaBean
这是一个data class从JSON字符串生成Kotlin 的插件,换句话说,是一个将JSON字符串转换为Kotlin data class(Json到Kotlin)的插件在使用Kotlin进行开 ...
JS解析格式化Json插件,Json和XML互相转换插件
Json对象转换为XML字符串插件 http://www.jsons.cn/Down/jquery.json2xml.js var xml_content = $.json2xml(json_obj ...
asp.net 报表页面模板_CP：基于JSON配置和vue-cli插件机制的模板复用方案
前言 Atomic Design是前端开发圈中众所周知的设计理论,尤其是在中台类型的UI开发中.基于vue.js的element-ui.iview-ui和基于react.js的Ant Design都是 ...
html渲染json的插件,[ json editor] 如何在网页中使用Json editor 插件
[目的] 在自己的网页上交由用户进行json的可视化编辑 [难点]1.json中含有递归嵌套的数组和对象 2.json中的基本值类型有数字.字符串和布尔型 [方法]使用daviddurman的Flex ...
Python之基础详解（八）：必备,以制作交易收盘价走趋图为例,来可视化处理json格式的文件
在这里,我们将会用json模块来处理json格式文件.Pygal提供了一个适合初学者使用的绘图工具,我们在这里将使用它来对收盘价数据进行可视化,以帮助我们掌握基础技能.(本文所需要的文件都在资源中,记 ...
JSON解析格式化工具——非插件（超好用推荐）
原因:云桌面上外网连不上,不能用在线json解析,就想找个程序工具或者Chrome插件. 以为就一个小插件一小会就能弄好,结果找了好几个网址用了快有一小时才找到满意的,chrome搬运的下载资源都试了 ...
根据json文件，可视化LVIS和COCO数据集的GroundTruth标签
可视化LVIS和COCO数据集的GroundTruth标签 import os import json import argparse from PIL import Image, ImageDraw ...
idea之json格式化插件Json Parser
idea之json格式化插件Json Parser 安装插件安装后重启idea 使用插件 Json Parser 为啥要用Json Parser,别问你也可以不用,废话不说,自己品! 安装插件安装 ...
处理谷歌浏览器导出书签为json格式
文章目录处理谷歌浏览器导出书签为json格式前言网址导航谷歌浏览器书签导出书签原理 demo 代码 JavaScript Java 结尾处理谷歌浏览器导出书签为json格式前言最近在 ...
【中国部分省市】离线地图可视化的json文件
前言找了半天,终于找到了json文件有中国地图.部分省和市的地图json文件,但是点进去发现都是数字...不整理一下不清楚哪个对哪个. 指路Github:链接整理总览点开json文件会有些信 ...

【JSON】谷歌浏览器JSON可视化插件：JSON-Handle

Chrome插件安装方法

【JSON】谷歌浏览器JSON可视化插件：JSON-Handle相关推荐

最新文章

热门文章