🌐 VI

🧾 JSON Formatter

Thụt lề JSON để dễ đọc hoặc rút gọn thành một dòng, và nhận đúng dòng:cột của mọi lỗi cú pháp. Khám phá cấu trúc bằng chế độ xem cây có thể thu gọn.

HƯỚNG DẪN

Tìm hiểu thêm

01

1. In đẹp so với rút gọn

In đẹp thêm thụt lề và ngắt dòng để JSON dễ đọc với con người, còn rút gọn sẽ bỏ mọi khoảng trắng và ký tự xuống dòng không cần thiết để giảm dung lượng tệp. JSON được in đẹp rất hữu ích khi gỡ lỗi trong quá trình phát triển, trong khi JSON rút gọn giúp giảm kích thước tải cho phản hồi API thực tế và triển khai production. Công cụ này cho phép chọn thụt lề 2 khoảng trắng, 4 khoảng trắng hoặc tab để khớp với phong cách mã của dự án bạn.

02

2. Xác định chính xác lỗi JSON

Thông báo lỗi từ JSON.parse() khác nhau đáng kể giữa các trình duyệt, nên thường rất khó biết chính xác vấn đề nằm ở đâu. Công cụ này có bộ quét viết tay riêng đi qua trực tiếp ngữ pháp JSON (object, array, chuỗi, số, literal), vì vậy luôn trả về đúng cùng một "line N, column M" bất kể bạn dùng trình duyệt nào. Nhờ đó bạn dễ dàng phát hiện các lỗi phổ biến như thiếu dấu phẩy, key không đặt trong dấu ngoặc kép, hoặc chuỗi chưa đóng.

03

3. Hiểu JSON lồng nhau sâu bằng chế độ xem cây

JSON lồng nhau sâu rất khó theo dõi dưới dạng văn bản thuần - rất dễ mất dấu ngoặc nào đóng cho ngoặc nào. Chế độ xem cây hiển thị object và array dưới dạng các nút có thể thu gọn/mở rộng, để bạn đi thẳng vào phần mình quan tâm. Nhấp nút sao chép bên cạnh bất kỳ nút nào sẽ sao chép đường dẫn của giá trị đó (ví dụ $.tools[1]) vào clipboard, sẵn sàng dán trực tiếp vào code cần tham chiếu tới nó.

Kết hợp tốt với

Câu hỏi thường gặp

JSON của tôi có được gửi lên máy chủ không?
Không. Việc phân tích, định dạng và kiểm tra hợp lệ đều diễn ra ngay trong trình duyệt của bạn chỉ qua JSON.parse() - không hề gọi backend API nào. Payload API nhạy cảm hoặc giá trị cấu hình sẽ được giữ riêng tư.
Thông báo lỗi rất ngắn - tôi đọc nó thế nào?
Nó hiển thị dòng:cột cùng token được mong đợi, ví dụ "at 3:5 — Expected ',' or '}'". Ô nhập cũng tự động chọn đúng dòng đó để bạn nhảy thẳng tới vị trí lỗi.
Nếu tôi đổi tùy chọn thụt lề, văn bản hiện tại có tự cập nhật không?
Không - lựa chọn thụt lề chỉ có hiệu lực ở lần tiếp theo bạn bấm "Pretty Print". Chỉ đổi danh sách chọn thôi thì sẽ không định dạng lại gì cả.
"keys" và "depth" trong thống kê chế độ xem cây nghĩa là gì?
"Keys" là tổng số thuộc tính của object trên toàn bộ tài liệu JSON, còn "depth" là giá trị nằm sâu nhất ở bao nhiêu cấp - hữu ích như một thước đo gần đúng về độ phức tạp cấu trúc.