Visualizador de JSON
Visualizador de texto e árvore recolhível com expandir/recolher e caminhos de nós.
Seu JSON é analisado e exibido localmente no seu navegador, e nada é enviado para um servidor.
Precisa de tipos TypeScript a partir do seu JSON? Experimente a ferramenta JSON para TypeScript.
Sobre Visualizador de JSON
Este visualizador json oferece um espaço de trabalho com dois painéis para ler e organizar JSON: edite, formate ou minifique seus dados na aba Texto e depois mude para a aba Visualizador para percorrê-los como uma árvore recolhível. Foi feito para desenvolvedores, engenheiros de QA e qualquer pessoa depurando uma resposta de API que precisa ver json online sem caçar em meio a um muro de texto. Expanda ou recolha nós, mergulhe em objetos e arrays aninhados e clique em qualquer valor para copiar seu caminho exato. Como visualizador de árvore json, ele também funciona como um formatador json rápido, ajudando você a embelezar payloads minificados e enxergar a estrutura num relance. Tudo roda inteiramente no seu navegador, então seus dados nunca saem do dispositivo e nada é enviado para um servidor.
Recursos
- Layout de dois painéis: uma aba Texto para editar e formatar, uma aba Visualizador para explorar
- Visualização em árvore recolhível para expandir e recolher objetos e arrays aninhados
- Botões Expandir tudo e Recolher tudo para remodelar o documento inteiro de uma vez
- Clique em qualquer nó para ver seu caminho completo (por exemplo, author.links) na barra inferior
- Copie o caminho de um nó com um clique para usar em código ou consultas
- Formate para embelezar ou Minifique para compactar JSON bruto na aba Texto
- Baixe o JSON formatado ou copie o documento inteiro instantaneamente
- Roda inteiramente no seu navegador, sem nada enviado para um servidor
Como usar Visualizador de JSON
- Cole ou digite seu JSON na aba Texto.
- Clique em Formatar para embelezá-lo, ou em Minificar para compactá-lo, e confirme que é válido.
- Mude para a aba Visualizador para ver a árvore recolhível.
- Use Expandir tudo ou Recolher tudo, ou clique em nós individuais para mergulhar.
- Clique em um valor e copie seu caminho na barra inferior.
Exemplo
Entrada
{"author":{"name":"Ada","links":["site","blog"]}}
Saída
{
"author": {
"name": "Ada",
"links": [
"site",
"blog"
]
}
}
Formatado na aba Texto; ao clicar no primeiro link no Visualizador, aparece o caminho author.links[0].
Erros comuns e solução de problemas
- A aba Visualizador está vazia ou não mostra nada para expandir. — Verifique na aba Texto se há um erro de sintaxe, como uma vírgula sobrando ou uma chave sem aspas; a árvore só renderiza JSON válido.
- Um trecho colado tem aspas simples ou chaves no estilo JavaScript. — JSON exige chaves e valores de string com aspas duplas. Converta as aspas simples em aspas duplas antes de visualizar.
- Um documento enorme parece lento ao expandir. — Use Recolher tudo primeiro e depois expanda apenas os ramos que você precisa, em vez de abrir todos os nós de uma vez.
- Você copiou um caminho, mas ele não corresponde ao seu código. — Os caminhos usam notação de ponto e colchete a partir da raiz; ajuste para a sintaxe de acesso da sua linguagem, se ela for diferente.
Perguntas frequentes
- Para que serve o Visualizador JSON?
- O Visualizador JSON permite formatar, minificar e explorar JSON como uma árvore recolhível, para que você leia respostas de API e arquivos de configuração sem examinar um muro de texto bruto.
- Como obtenho o caminho de um valor no Visualizador JSON?
- Clique em qualquer nó na aba Visualizador e seu caminho, por exemplo author.links, aparece na barra inferior, pronto para copiar.
- Posso expandir ou recolher a árvore inteira de uma vez?
- Sim. Use os botões Expandir tudo e Recolher tudo na barra de ferramentas para remodelar o documento inteiro com um clique.
- O Visualizador JSON também formata e minifica meu JSON?
- Sim. A aba Texto embeleza ou compacta JSON bruto com os botões Formatar e Minificar, e a aba Visualizador então o exibe como uma árvore navegável.
- Meu JSON é enviado para algum lugar quando uso o Visualizador JSON?
- Não. O Visualizador JSON processa tudo localmente no seu navegador, então seus dados nunca saem do dispositivo e nada é enviado.
- Como o Visualizador JSON lida com JSON inválido?
- A aba Visualizador precisa de JSON válido para construir a árvore; corrija os erros sinalizados na aba Texto, incluindo a linha e coluna, e a árvore será renderizada.
Ferramentas relacionadas
Todas as ferramentas de ArrayKit