DT Dev Tools

JSON Formatter — Formatowanie, walidacja i widok drzewa JSON

Formatuj, waliduj i minifikuj JSON z rozwijanym widokiem drzewa, dokładną linią i kolumną błędu, sortowaniem kluczy i obsługą JSON5/JSONC. Działa w przeglądarce.

🔒 Działa całkowicie w Twojej przeglądarce — nic nie jest przesyłane

Czy to narzędzie było przydatne? Oceń je:

Co robi JSON Formatter

JSON Formatter waliduje JSON podczas pisania, a następnie zapisuje go z powrotem albo z czytelnymi wcięciami (2 spacje, 4 spacje lub tabulatory), albo jako zwartą wartość w jednym wierszu. Jest przydatny do przeglądania odpowiedzi API, metadanych pakietów, fragmentów konfiguracji, ładunków webhooków, wartości z pamięci przeglądarki i danych testowych. Gdy dane wejściowe są nieprawidłowe, narzędzie podaje dokładną linię i kolumnę, wypisuje problematyczny wiersz ze znakiem ^ pod błędem i potrafi przenieść kursor prosto w to miejsce — dzięki temu końcowe przecinki, brakujące cudzysłowy i niezbalansowane nawiasy znajdziesz w kilka sekund.

Poprawne dokumenty są również pokazywane jako rozwijane drzewo. Obiekty i tablice wyświetlają liczbę kluczy lub elementów, elementy podrzędne są renderowane dopiero po otwarciu węzła, więc duże pliki pozostają responsywne, a kliknięcie klucza kopiuje jego ścieżkę JavaScript, na przykład $.orders[3].total. Posortuj klucze alfabetycznie, aby łatwiej porównać dwa ładunki, i otwieraj lub pobieraj pliki .json bezpośrednio. Pliki konfiguracyjne często używają JSONC lub JSON5 z komentarzami, pojedynczymi cudzysłowami i końcowymi przecinkami; włącz opcję łagodną, aby je odczytać i zamienić na ścisły JSON.

Prywatny przepływ pracy w przeglądarce

Całe przetwarzanie odbywa się za pomocą JavaScriptu w przeglądarce. Narzędzie nie wysyła na serwer Twoich tekstów, tokenów, adresów URL, fragmentów kodu ani wygenerowanych wartości i nie wymaga konta. Ten model prywatności jest ważny, ponieważ małe narzędzia podczas rozwiązywania problemów często otrzymują prawdziwe odpowiedzi API, przykłady konfiguracji, logi, dane uwierzytelniające lub dane przypominające dane klientów. Praca lokalna zmniejsza ryzyko i sprawia, że narzędzie działa natychmiast, bo nie ma komunikacji sieciowej.

Praktyczne wskazówki

Używaj ładnego formatowania podczas czytania zagnieżdżonych danych, a minifikacji, gdy potrzebujesz zwartej wartości do zmiennej środowiskowej, danych testowych lub przykładu w dokumentacji. Sortowanie kluczy zmienia tylko kolejność właściwości obiektów, nigdy kolejność elementów tablic, więc jest bezpieczne dla konfiguracji, ale może mieć znaczenie, jeśli odbiorca polega na kolejności właściwości. Twój szkic jest przechowywany w tej przeglądarce przez kilka dni, więc przypadkowe odświeżenie strony go nie usunie — użyj Clear, gdy pracujesz z danymi wrażliwymi. Bardzo duże liczby poza bezpiecznym zakresem liczb całkowitych JavaScriptu tracą precyzję podczas parsowania, co jest cechą JSON w przeglądarce, a nie tego narzędzia.

Jak używać

  1. Wklej lub otwórz JSONWklej JSON lub otwórz plik .json; jest walidowany podczas pisania.
  2. Wybierz opcjeWybierz 2 spacje, 4 spacje lub tabulatory, sortowanie kluczy oraz w razie potrzeby zezwól na JSON5/JSONC.
  3. Formatuj, przeglądaj i kopiujSformatuj lub zminifikuj, przeglądaj widok drzewa, a następnie skopiuj lub pobierz wynik.

Najczęściej zadawane pytania

Czy obsługuje komentarze i końcowe przecinki?
Tak, opcjonalnie. Zaznacz „Zezwalaj na JSON5 / JSONC”, aby akceptować komentarze, końcowe przecinki, pojedyncze cudzysłowy i klucze bez cudzysłowów (jak w tsconfig.json lub ustawieniach VS Code); wynik to zawsze ścisły JSON.
Jak znaleźć błąd składni?
Status pokazuje linię i kolumnę pierwszego błędu, problematyczny wiersz ze znakiem ^ pod błędem oraz przycisk „Przejdź do błędu”, który zaznacza to miejsce w edytorze.
Czy jest widok drzewa?
Tak. Poprawny JSON jest pokazywany jako rozwijane drzewo z liczbą elementów. Kliknij dowolny klucz, aby skopiować jego ścieżkę, na przykład $.users[0].email.
Czy JSON jest wysyłany?
Nie. Parsowanie i formatowanie odbywają się lokalnie w przeglądarce.