Format JSON

Co to jest Formatowanie JSON?

Formatowanie JSON to proces przekształcania danych JSON w spójną, czytelną formę dla ludzi poprzez dodanie wcięć, odstępów i łamań linii — bez zmiany struktury czy zawartości. Poprawne formatowanie ułatwia przeglądanie, debugowanie, udostępnianie i edycję JSON, jednocześnie zapewniając kompatybilność z maszynami i narzędziami programistycznymi.

JSON z definicji ignoruje odstępy poza wartościami tekstowymi. Jednak źle sformatowany (lub zminimalizowany) JSON — bez wcięć lub upakowany w jednej linii — jest niemal niemożliwy do czytania lub modyfikowania przez ludzi.

Formatowanie vs Minimalizowanie JSON

• Formatowanie dodaje odstępy, wcięcia i łamanie linii dla większej przejrzystości i czytelności.
• Minimalizowanie usuwa wszystkie zbędne odstępy dla maksymalnej kompaktowości i efektywności w przechowywaniu lub przesyłaniu.
• Solidny format JSON umożliwia przełączanie między tymi trybami, pozwalając łatwo wybierać między wersją przyjazną dla ludzi a zoptymalizowaną dla maszyn.

Przykład: Minimalizowany vs. Formatowany JSON

{"id":"3f4b2c","user":{"name":"Dana","is_active":true},"roles":["admin","editor"],"count":7}

{
  "id": "3f4b2c",
  "user": {
    "name": "Dana",
    "is_active": true
  },
  "roles": [
    "admin",
    "editor"
  ],
  "count": 7
}

Dlaczego formatować JSON?

• Czytelność: Poprawne wcięcia i łamanie linii ułatwiają przeglądanie zagnieżdżonych obiektów, wykrywanie błędów i szybkie zrozumienie złożonych struktur danych.
• Debugowanie: Rozwiązywanie problemów z niepoprawnymi lub nieoczekiwanymi danymi jest dużo łatwiejsze, gdy można wizualnie prześledzić klucze, wartości i poziomy zagnieżdżenia.
• Współpraca: Dobrze sformatowany JSON łatwiej przeglądać, omawiać i edytować podczas przeglądów kodu, w dokumentacji czy udostępnionych plikach.
• Kontrola wersji: Git i inne systemy kontroli wersji generują bardziej czytelne różnice na sformatowanym JSON, ułatwiając śledzenie zmian w czasie.
• Zgodność: Wiele wytycznych stylu i automatycznych narzędzi do linterów (jak Prettier, ESLint czy jq) wymuszają spójne formatowanie dla jasności i standaryzacji.
• Kompatybilność narzędzi: Niektóre API, CLI i edytory oczekują sformatowanych danych dla łatwiejszej interakcji lub rejestrowania.

Jak działa format JSON?

1. Parsowanie: Formatowanie zaczyna się od próby parsowania wprowadzonego tekstu za pomocą ścisłego parsera JSON. Sprawdza to poprawność składniową — wykrywając brakujące cudzysłowy, przecinki końcowe czy nieodpowiednio zapisane znaki.
2. Ładne wyświetlanie: Po poprawnym sparsowaniu dane są serializowane na nowo do ciągu znaków z wybranym poziomem wcięcia (zazwyczaj 2 lub 4 spacje) oraz łamaniem linii, tworząc „upiększoną” wersję.

Jeśli dane nie są poprawnym JSONem, narzędzie wyświetli błąd lub podpowie miejsce oraz rodzaj problemu.

Opcje formatowania

• Wcięcia: Ustaw liczbę spacji na poziom (do 8).
• Sortuj klucze obiektów alfabetycznie
• Używaj tabulatorów zamiast spacji
• Zamień znaki spoza ASCII na Unicode
• Minimalizuj wynik (jednolinijkowy, bez spacji)

Typowe problemy rozwiązane dzięki formatowaniu

• JSON w jednej linii/minimalizowany: Dane z API lub plików logów są często minimalizowane dla oszczędności przepustowości, co utrudnia ręczną edycję. Formatowanie przywraca czytelność do przeglądu i edycji.
• Niespójne wcięcia: JSON wkleić z różnych źródeł może zawierać mieszankę tabulatorów, spacji lub różne głębokości wcięć. Formatowanie normalizuje te różnice, poprawiając klarowność i spójność.
• Duże/zagnieżdżone struktury: Głęboko zagnieżdżone tablice lub obiekty (np. pliki konfiguracyjne czy złożone odpowiedzi API) stają się czytelne i łatwiejsze do nawigacji, a edytory obsługujące składanie pozwalają na zwijanie elementów.

Przykład użycia w praktyce: Formatowanie odpowiedzi API

Przy integracji z zewnętrznymi API (jak AWS, Stripe czy Google Cloud) odpowiedzi często są skompresowane dla szybkości. Formatowanie JSON ułatwia sprawdzenie brakujących pól, debugowanie nieoczekiwanych wartości czy dzielenie się danymi ze współpracownikami.

{"amount":2500,"currency":"usd","status":"succeeded","charges":[{"id":"ch_1Gq","amount":2500}]}

{
  "amount": 2500,
  "currency": "usd",
  "status": "succeeded",
  "charges": [
    {
      "id": "ch_1Gq",
      "amount": 2500
    }
  ]
}

Jak formatować JSON tym narzędziem

1. Wklej lub załaduj surowy, minimalizowany lub źle sformatowany JSON w polu wejściowym.
2. Wybierz opcje formatowania (rozmiar wcięcia, sortowanie kluczy itd.).
3. Kliknij „Formatuj”, aby przetworzyć dane.
4. Zobacz lub skopiuj czysty, czytelny wynik. Jeśli znajdą się błędy, pojawią się szczegółowe komunikaty składniowe pomagające je naprawić.

Wszystkie operacje wykonują się bezpiecznie w Twojej przeglądarce — Twoje dane nigdy nie opuszczają urządzenia.

Przykłady kodu do formatowania JSON

Zobacz, jak formatować JSON w różnych językach programowania. Te przykłady pokazują podstawowe techniki formatowania.

const ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
const pretty = JSON.stringify(JSON.parse(ugly), null, 2);
console.log(pretty);

import json
ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}'
pretty = json.dumps(json.loads(ugly), indent=2)
print(pretty)

package main
import (
  "encoding/json"
  "fmt"
)
func main() {
  ugly := []byte(`{"name":"Alice","age":30,"roles":["admin","user"]}`)
  var obj interface{}
  json.Unmarshal(ugly, &obj)
  pretty, _ := json.MarshalIndent(obj, "", "  ")
  fmt.Println(string(pretty))
}

import com.fasterxml.jackson.databind.ObjectMapper;
public class Main {
  public static void main(String[] args) throws Exception {
    String ugly = "{"name":"Alice","age":30,"roles":["admin","user"]}";
    ObjectMapper mapper = new ObjectMapper();
    Object obj = mapper.readValue(ugly, Object.class);
    String pretty = mapper.writerWithDefaultPrettyPrinter().writeValueAsString(obj);
    System.out.println(pretty);
  }
}

using System;
using Newtonsoft.Json;
class Program {
  static void Main() {
    var ugly = "{"name":"Alice","age":30,"roles":["admin","user"]}";
    var parsed = JsonConvert.DeserializeObject(ugly);
    var pretty = JsonConvert.SerializeObject(parsed, Formatting.Indented);
    Console.WriteLine(pretty);
  }
}

<?php
$ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
$obj = json_decode($ugly);
echo json_encode($obj, JSON_PRETTY_PRINT);

require 'json'
ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}'
pretty = JSON.pretty_generate(JSON.parse(ugly))
puts pretty

echo '{"name":"Alice","age":30,"roles":["admin","user"]}' | jq .

fn main() {
  let ugly = r#"{"name":"Alice","age":30,"roles":["admin","user"]}"#;
  let value: serde_json::Value = serde_json::from_str(ugly).unwrap();
  let pretty = serde_json::to_string_pretty(&value).unwrap();
  println!("{}", pretty);
}

import com.fasterxml.jackson.databind.ObjectMapper
fun main() {
  val ugly = "{"name":"Alice","age":30,"roles":["admin","user"]}"
  val mapper = ObjectMapper()
  val obj = mapper.readValue(ugly, Any::class.java)
  val pretty = mapper.writerWithDefaultPrettyPrinter().writeValueAsString(obj)
  println(pretty)
}

import Foundation
let ugly = "{\"name\":\"Alice\",\"age\":30,\"roles\":[\"admin\",\"user\"]}"
if let data = ugly.data(using: .utf8),
   let obj = try? JSONSerialization.jsonObject(with: data),
   let pretty = try? JSONSerialization.data(withJSONObject: obj, options: .prettyPrinted),
   let prettyString = String(data: pretty, encoding: .utf8) {
    print(prettyString)
}

const ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
const pretty = JSON.stringify(JSON.parse(ugly), null, 2);
console.log(pretty);

SELECT jsonb_pretty('{"name":"Alice","age":30,"roles":["admin","user"]}'::jsonb);

SELECT JSON_PRETTY('{"name":"Alice","age":30,"roles":["admin","user"]}');

$ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}'
$obj = $ugly | ConvertFrom-Json
$pretty = $obj | ConvertTo-Json -Depth 10
Write-Output $pretty

use JSON;
my $ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
my $obj = decode_json($ugly);
print to_json($obj, { pretty => 1 });

import 'dart:convert';
void main() {
  const ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
  final obj = jsonDecode(ugly);
  final pretty = JsonEncoder.withIndent('  ').convert(obj);
  print(pretty);
}

ugly = ~s({"name":"Alice","age":30,"roles":["admin","user"]})
{:ok, obj} = Jason.decode(ugly)
pretty = Jason.encode!(obj, pretty: true)
IO.puts(pretty)

import play.api.libs.json._
object Main extends App {
  val ugly = """{"name":"Alice","age":30,"roles":["admin","user"]}"""
  val jsValue = Json.parse(ugly)
  val pretty = Json.prettyPrint(jsValue)
  println(pretty)
}