Formater JSON

Czym jest JSON formatter?

JSON formatter (nazywany też JSON beautifierem lub pretty-printerem) zamienia zwarty lub nieuporządkowany JSON w czytelne dane z wcięciami. To jedno z najczęściej używanych narzędzi programistycznych: przydaje się przy sprawdzaniu odpowiedzi API, czytaniu plików konfiguracyjnych, debugowaniu logów, porównywaniu danych testowych i przenoszeniu danych między kodem frontendu i backendu.

JSON to ścisły format: klucze muszą być w podwójnych cudzysłowach, ciągi znaków też, przecinki muszą stać we właściwych miejscach, a każdy otwierający { lub [ musi zostać zamknięty. Formatter pokazuje tę strukturę, a wbudowany walidator mówi dokładnie, gdzie składnia się psuje, jeśli do tego dojdzie.

JSON to skrót od JavaScript Object Notation. Choć wyrósł z JavaScriptu, niemal każdy język programowania ma wbudowaną obsługę odczytu i zapisu JSON, dlatego stał się domyślnym sposobem wymiany ustrukturyzowanych danych w sieci.

Czego nauczysz się, korzystając z niego

• Obiekty używają {} dla nazwanych pól, tablice używają [] dla uporządkowanych list, a jedne i drugie można zagnieżdżać w sobie na dowolną głębokość.
• Sformatowany i zminifikowany JSON to *te same dane*: białe znaki zmieniają czytelność, a nie znaczenie. Serwery zwykle zwracają zminifikowany JSON, aby oszczędzić bajty.
• Wartości JSON mogą mieć tylko sześć typów: string, number, boolean, null, object i array. Nie ma undefined, funkcji ani komentarzy.
• Błędy walidacji zwykle wskazują miejsce w pobliżu problemu, ale prawdziwa pomyłka (niezamknięty nawias, brakujący cudzysłów) może być kilka znaków wcześniej.

Jak sformatować JSON krok po kroku

1. 1

   Wklej JSON do pola wejściowego

   Skopiuj JSON z odpowiedzi API, pliku logów lub konfiguracji i wklej go po lewej stronie. Formatter przyjmuje zarówno zminifikowane, jak i częściowo sformatowane dane.

2. 2

   Wybierz szerokość wcięcia

   Dwie spacje to najpopularniejszy styl; cztery spacje też są często używane. Wybierz to, co pasuje do stylu twojego projektu.

3. 3

   Sprawdź wynik walidacji

   Jeśli JSON jest poprawny, sformatowany wynik pojawi się po prawej stronie. Jeśli nie, komunikat błędu wskaże wiersz i znak, na którym parsowanie się nie powiodło.

4. 4

   Przeglądaj widok drzewa

   Użyj zwijanego drzewa, aby złożyć głęboko zagnieżdżone obiekty i tablice. To najszybszy sposób, by zrozumieć strukturę nieznanej odpowiedzi API.

5. 5

   Skopiuj lub zminifikuj wynik

   Skopiuj sformatowaną wersję do kodu lub dokumentacji albo zminifikuj ją z powrotem do jednego wiersza, aby ją przechowywać lub przesyłać przez sieć.

Składnia JSON w pigułce

Pełny zestaw elementów, z których składa się JSON. Wszystko spoza tej listy nie jest poprawnym JSON. Specyfikacja: RFC 8259 i ECMA-404.

Przykłady JSON do wypróbowania

{"user":{"id":7,"name":"Maya"},"skills":["HTML","JavaScript"]}

{  "user": {    "id": 7,    "name": "Maya"  },  "skills": ["HTML", "JavaScript"]}

{  "name": "Coddy",  "active": true,}

{  "count": 3,  "countText": "3",  "enabled": true}

{  "data": {    "orders": [      { "id": 101, "items": [{ "sku": "A", "qty": 2 }] },      { "id": 102, "items": [] }    ]  }}

Częste błędy w JSON

• Używanie pojedynczych cudzysłowów zamiast podwójnych wokół kluczy lub ciągów znaków: JSON pozwala tylko na podwójne.
• Traktowanie JSON jak obiektu JavaScript: komentarze, funkcje i undefined nie są poprawne w JSON, a przecinki na końcu powodują błąd parsowania.
• Zapominanie, że liczby w JSON nie mogą mieć wiodącego +, zer wiodących (poza samym 0) ani być w cudzysłowach, jeśli naprawdę chcesz typu liczbowego.
• Wklejanie tokenów, danych klientów lub sekretów produkcyjnych do narzędzi, które wysyłają dane na serwer. Formatter Coddy działa lokalnie, więc to bezpieczne, ale zawsze sprawdzaj, zanim użyjesz zewnętrznej strony.

JSON Formatter: najczęstsze pytania