Tan Phat Media

API Response Formatter - Format API Response Online

Format và phân tích API response

Input
Formatted

Hợp tác ngay với Tấn Phát Digital

Chúng tôi không chỉ thiết kế website, mà còn giúp doanh nghiệp xây dựng thương hiệu số mạnh mẽ. Cung cấp dịch vụ thiết kế website trọn gói từ thiết kế đến tối ưu SEO. Hãy liên hệ ngay với Tấn Phát Digital để cùng tạo nên những giải pháp công nghệ đột phá, hiệu quả và bền vững cho doanh nghiệp của bạn tại Hồ Chí Minh.

Đọc phản hồi API: dàn lại JSON và đo nhanh độ phức tạp của cấu trúc

Công cụ nhận một khối JSON thô từ phản hồi API, kiểm tra cú pháp rồi dàn lại theo thụt lề hai dấu cách. Khác với trình định dạng thông thường, nó còn đếm tổng số khóa, độ sâu lồng nhau, số đối tượng và số mảng, giúp bạn ước lượng ngay mức độ rắc rối của cấu trúc trước khi bắt tay viết mã đọc dữ liệu.

Tính năng nổi bật

  • Kiểm tra cú pháp JSON và báo lỗi khi chuỗi không phân tích được
  • Dàn lại toàn bộ khối theo thụt lề hai dấu cách, mức thụt lề mặc định của phần lớn dự án
  • Đếm tổng số khóa trên toàn bộ cây dữ liệu, kể cả khóa nằm sâu trong các tầng lồng nhau
  • Tính độ sâu lồng nhau lớn nhất, con số cho biết bạn phải đi qua bao nhiêu tầng để chạm dữ liệu
  • Đếm số đối tượng và số mảng riêng biệt để nhận ra ngay dạng bao bọc của phản hồi
  • Nút nạp một khối mẫu có đủ ba tầng trạng thái, dữ liệu và siêu dữ liệu phân trang
  • Nút sao chép toàn bộ kết quả đã dàn để dán vào tài liệu hoặc phiếu báo lỗi
  • Chạy hoàn toàn trong trình duyệt, khối dữ liệu bạn dán không được gửi lên máy chủ

Vì sao khối JSON một dòng là kẻ thù của việc gỡ lỗi

Máy chủ trả về JSON ở dạng nén một dòng vì đó là cách tiết kiệm băng thông nhất, và điều đó hoàn toàn hợp lý với máy. Nhưng khi bạn chép khối đó từ nhật ký hệ thống hay từ thẻ mạng của trình duyệt vào để tìm hiểu vì sao ứng dụng hiển thị sai, con mắt người không có cách nào lần được các cặp ngoặc lồng nhau. Bạn không biết trường mình cần nằm ở tầng thứ mấy, không biết mảng nào chứa mảng nào, và rất dễ đếm nhầm dấu ngoặc khi cấu trúc lồng bốn năm tầng. Dàn lại giải quyết phần nhìn, còn bốn con số thống kê giải quyết phần ước lượng: nhìn độ sâu là biết đường truy cập sẽ dài bao nhiêu, nhìn số mảng là biết mình sẽ phải lặp mấy vòng, nhìn tổng số khóa là biết nên viết kiểu dữ liệu bằng tay hay nên sinh tự động. Đó là thông tin bạn cần trước khi viết dòng mã đầu tiên chứ không phải sau khi đã viết xong.

Lợi ích khi sử dụng

  • Nhìn ra ngay tầng bao bọc của phản hồi thay vì mò từng dấu ngoặc trong một dòng dài
  • Bốn con số thống kê cho biết trước khối lượng công việc khi viết phần đọc dữ liệu
  • Phát hiện sớm chuỗi bị cắt cụt hoặc dính ký tự thừa khi chép từ nhật ký
  • Bản dàn lại dán vào phiếu báo lỗi giúp người đọc hiểu ngay thay vì phải tự dàn lại
  • Dữ liệu không rời khỏi máy nên yên tâm khi khối phản hồi có chứa thông tin khách hàng

Cách dùng công cụ

  1. 1Sao chép khối phản hồi thô từ nhật ký hệ thống, từ thẻ mạng của trình duyệt hoặc từ công cụ gọi API rồi dán vào ô bên trái.
  2. 2Nếu chỉ muốn thử, bấm nút Mẫu để nạp một khối có cấu trúc bao bọc điển hình gồm trạng thái, dữ liệu và siêu dữ liệu phân trang.
  3. 3Bấm Format, nếu chuỗi hợp lệ thì bản dàn lại hiện ngay ở ô bên phải, còn nếu không thì có thông báo lỗi dưới ô nhập.
  4. 4Đọc khối thống kê phía dưới để nắm số khóa, độ sâu, số đối tượng và số mảng trước khi viết mã đọc dữ liệu.
  5. 5Bấm nút sao chép để lấy bản đã dàn, dán vào tài liệu mô tả API hoặc vào phiếu báo lỗi cho đồng nghiệp.

Bốn con số thống kê nói lên điều gì

Tổng số khóa được đếm trên toàn bộ cây chứ không chỉ ở tầng ngoài cùng, nên một phản hồi trả về danh sách một trăm bản ghi mỗi bản ghi mười trường sẽ cho con số quanh một nghìn. Đây là chỉ dấu tốt để quyết định có nên sinh kiểu dữ liệu tự động thay vì gõ tay. Độ sâu là số tầng lớn nhất tính từ gốc tới điểm sâu nhất; với khối mẫu của công cụ, độ sâu là 4 vì phải đi qua trường dữ liệu, tới mảng người dùng, tới một phần tử, rồi mới tới trường tên. Con số này đáng chú ý vì nó tỷ lệ thuận với số lần bạn phải kiểm tra giá trị rỗng trên đường truy cập; độ sâu từ 5 trở lên thường là dấu hiệu nên làm phẳng dữ liệu ngay khi nhận về thay vì để mã nghiệp vụ phải lặn xuống từng tầng. Số đối tượng và số mảng bổ sung cho nhau: nhiều mảng lồng trong mảng báo hiệu vòng lặp lồng nhau, còn nhiều đối tượng mà rất ít mảng thường là phản hồi mô tả một thực thể đơn lẻ với nhiều nhóm thuộc tính.

Những thứ JSON hợp lệ không cho phép mà lập trình viên hay quên

Phần lớn thông báo lỗi ở đây đến từ vài quy tắc rất chặt của định dạng. Không được có dấu phẩy thừa sau phần tử cuối cùng của mảng hay đối tượng, dù nhiều ngôn ngữ lập trình cho phép điều đó. Không có chú thích, nên nếu bạn chép từ tệp cấu hình có ghi chú thì phải xóa hết. Khóa bắt buộc phải đặt trong dấu nháy kép, không được dùng nháy đơn và không được để trần như trong mã JavaScript. Chuỗi cũng chỉ dùng nháy kép. Không chấp nhận các giá trị đặc biệt như vô cùng hay không phải số, dù một số thư viện lại sinh ra chúng khi chuyển đổi. Số không được viết dạng có số 0 ở đầu, và không được kết thúc bằng dấu chấm. Ngoài ra một lỗi rất hay gặp khi chép từ nhật ký là chuỗi đã bị thoát hai lần: toàn bộ khối JSON nằm trong một chuỗi lớn hơn với các dấu nháy được thoát bằng dấu gạch chéo ngược. Trường hợp này bạn phải bỏ một lớp thoát trước khi dán vào, nếu không công cụ chỉ thấy một chuỗi văn bản chứ không thấy cấu trúc.

Hai cái bẫy im lặng: khóa trùng và số quá lớn

Có hai trường hợp công cụ báo hợp lệ nhưng dữ liệu ra khác dữ liệu vào, và bạn cần biết để không kết luận nhầm. Thứ nhất là khóa trùng: nếu một đối tượng có hai khóa cùng tên, bộ phân tích của JavaScript giữ lại giá trị xuất hiện sau và bỏ lặng lẽ giá trị trước, nên bản dàn lại sẽ ít hơn một khóa so với bản gốc mà không có cảnh báo nào. Bản thân đặc tả không cấm khóa trùng nhưng cũng không quy định cách xử lý, nên mỗi ngôn ngữ làm một kiểu; đây là nguồn lỗi thật khi hai hệ thống đọc cùng một phản hồi ra hai kết quả khác nhau. Thứ hai là số nguyên rất lớn: JavaScript biểu diễn mọi số bằng kiểu dấu phẩy động, nên số nguyên vượt quá khoảng chín triệu tỷ sẽ bị làm tròn. Định danh bản ghi dạng số dài mười chín chữ số, thứ khá phổ biến trong các hệ thống phân tán, sẽ bị đổi vài chữ số cuối sau khi đi qua bước phân tích và dựng lại. Nếu phản hồi của bạn có loại định danh này, hãy đối chiếu chuỗi gốc chứ đừng tin bản dàn lại, và về lâu dài nên đề nghị bên cung cấp API trả định danh dưới dạng chuỗi.

Đọc cấu trúc bao bọc của một phản hồi API

Khối mẫu trong công cụ phản ánh khuôn dạng rất phổ biến: một trường trạng thái ở ngoài cùng, một trường dữ liệu chứa nội dung thật, và một trường siêu dữ liệu chứa thông tin phân trang. Nhìn được cấu trúc này giúp bạn tránh hai lỗi kinh điển. Lỗi thứ nhất là lấy nhầm tầng: viết mã đọc thẳng danh sách ở gốc trong khi danh sách nằm trong trường dữ liệu, khiến ứng dụng luôn nhận về giá trị rỗng. Lỗi thứ hai là bỏ qua phần phân trang: ứng dụng chỉ hiển thị mười bản ghi đầu và mọi người tưởng cơ sở dữ liệu thiếu dữ liệu, trong khi trường tổng số đã ghi rõ con số lớn hơn nhiều. Với phản hồi lỗi, khuôn dạng thường khác hẳn khuôn dạng thành công: trường dữ liệu biến mất và thay bằng một đối tượng lỗi chứa mã lỗi cùng thông điệp. Vì vậy khi dựng phần đọc dữ liệu, hãy dán cả một phản hồi thành công lẫn một phản hồi lỗi vào đây để so hai cấu trúc, thay vì chỉ nhìn trường hợp thuận lợi rồi để ứng dụng vỡ khi gặp lỗi thật.

Giới hạn của công cụ và khi nào cần thứ khác

Cần nói rõ vài điều để bạn không mất thời gian tìm chức năng không có. Mức thụt lề cố định ở hai dấu cách, không có tùy chọn bốn dấu cách hay dùng ký tự tab. Không có chức năng nén ngược lại thành một dòng, không có tô màu cú pháp vì kết quả hiển thị trong một ô văn bản thuần, và không có chức năng thu gọn từng nhánh để duyệt cây. Thông báo lỗi cũng chỉ cho biết chuỗi không hợp lệ chứ không chỉ ra vị trí dòng và cột, nên với khối rất dài bạn nên cắt đôi rồi thử từng nửa để khoanh vùng, hoặc dùng trình soạn thảo mã có kiểm tra cú pháp trực tiếp. Về kích thước, mọi thao tác chạy đồng bộ trên luồng giao diện nên khối vài megabyte có thể làm trang đứng vài giây; với tệp xuất dữ liệu lớn thì công cụ dòng lệnh chuyên dụng phù hợp hơn. Cuối cùng, khối thống kê chỉ hiện khi đếm được ít nhất một khóa, nên một phản hồi là mảng các giá trị đơn thuần sẽ được dàn lại bình thường nhưng không kèm bảng số liệu.

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

Vì sao dán vào lại báo JSON không hợp lệ dù trông vẫn đúng?

Ba nguyên nhân hay gặp nhất là dấu phẩy thừa sau phần tử cuối cùng, khóa hoặc chuỗi dùng nháy đơn thay vì nháy kép, và chú thích còn sót lại khi chép từ tệp cấu hình. Ngoài ra chuỗi chép từ nhật ký thường bị thoát hai lần, khi đó bạn phải bỏ bớt một lớp dấu gạch chéo ngược trước khi dán.

Công cụ có chỉ ra lỗi nằm ở dòng nào không?

Không, thông báo chỉ cho biết chuỗi không phân tích được. Với khối dài, cách khoanh vùng nhanh là cắt đôi rồi thử từng nửa cho tới khi tìm ra đoạn gây lỗi. Nếu bạn cần chỉ báo vị trí chính xác, một trình soạn thảo mã có kiểm tra cú pháp trực tiếp sẽ phù hợp hơn cho công đoạn đó.

Con số độ sâu được tính thế nào?

Đó là số tầng lồng nhau lớn nhất tính từ gốc xuống điểm sâu nhất của cây dữ liệu. Với khối mẫu, độ sâu bằng 4 vì phải đi qua trường dữ liệu, mảng người dùng, một phần tử trong mảng, rồi mới tới trường bên trong. Con số này càng lớn thì đường truy cập trong mã càng dài và càng cần nhiều bước kiểm tra giá trị rỗng.

Vì sao bản kết quả thiếu mất một khóa so với bản tôi dán vào?

Nhiều khả năng đối tượng của bạn có hai khóa trùng tên. Bộ phân tích giữ giá trị xuất hiện sau và bỏ giá trị trước mà không cảnh báo. Đặc tả không quy định cách xử lý trường hợp này nên mỗi ngôn ngữ làm một kiểu, và đó là lý do hai hệ thống có thể đọc cùng một phản hồi ra hai kết quả khác nhau.

Vì sao mã định danh dạng số dài lại bị đổi vài chữ số cuối?

Vì JavaScript biểu diễn mọi số bằng kiểu dấu phẩy động, nên số nguyên vượt quá khoảng chín triệu tỷ không giữ được chính xác. Định danh mười chín chữ số của các hệ thống phân tán rơi đúng vào vùng này. Hãy đối chiếu với chuỗi gốc, và tốt nhất là đề nghị bên cung cấp API trả loại định danh đó dưới dạng chuỗi.

Có đổi được mức thụt lề sang bốn dấu cách không?

Không, công cụ cố định ở hai dấu cách. Đây là mức thụt lề mặc định của phần lớn dự án hiện nay và cũng là mức tiết kiệm chiều ngang nhất khi cấu trúc lồng sâu. Nếu dự án của bạn quy định bốn dấu cách, hãy dán kết quả vào trình soạn thảo rồi dùng chức năng định dạng lại theo cấu hình của dự án.

Có nén ngược JSON về một dòng được không?

Không, công cụ chỉ làm chiều dàn ra cho dễ đọc. Việc nén lại thường được lo bởi chính máy chủ hoặc lớp truyền tải, và với dữ liệu gửi đi thì thư viện gọi API tự chuyển đổi nên bạn hiếm khi cần nén thủ công. Nếu vẫn cần, trình soạn thảo mã hoặc công cụ dòng lệnh xử lý việc này nhanh hơn.

Khối JSON tôi dán vào có bị gửi đi đâu không?

Không. Việc phân tích, dàn lại và đếm thống kê đều chạy bằng JavaScript trong trình duyệt của bạn, không có yêu cầu mạng nào mang theo nội dung. Bạn có thể dán phản hồi chứa dữ liệu khách hàng hay khóa truy cập, nhưng vẫn nên xóa những trường nhạy cảm trước khi chia sẻ kết quả cho người khác.

Dán được khối bao nhiêu megabyte?

Không có giới hạn cứng nhưng có giới hạn thực tế. Mọi thao tác chạy trên luồng giao diện nên khối vài megabyte có thể làm trang đứng vài giây, và khối rất lớn có thể khiến thẻ trình duyệt hết bộ nhớ. Với tệp xuất dữ liệu lớn, công cụ dòng lệnh xử lý theo luồng sẽ phù hợp hơn nhiều.

Vì sao dán vào mà bảng thống kê không hiện ra?

Vì bảng chỉ hiện khi đếm được ít nhất một khóa. Một phản hồi là mảng các giá trị đơn thuần, chẳng hạn danh sách số hay danh sách chuỗi, vẫn được dàn lại bình thường nhưng không có khóa nào để đếm nên bảng số liệu bị ẩn. Đây là hành vi bình thường chứ không phải lỗi.

Thứ tự các khóa có được giữ nguyên không?

Gần như luôn giữ nguyên, trừ một trường hợp: những khóa trông giống số nguyên sẽ bị đẩy lên đầu và sắp theo thứ tự tăng dần, do cách JavaScript tổ chức thuộc tính của đối tượng. Nếu bạn đang dùng khóa là số, chẳng hạn ánh xạ theo mã sản phẩm, hãy lưu ý điểm này khi so sánh hai bản với nhau.

Nên dùng công cụ này ở bước nào khi gỡ lỗi tích hợp API?

Ngay sau khi lấy được phản hồi thô và trước khi viết phần đọc dữ liệu. Hãy dán cả một phản hồi thành công lẫn một phản hồi lỗi để so hai cấu trúc, vì chúng thường khác hẳn nhau. Nắm được điều đó sớm giúp bạn viết nhánh xử lý lỗi ngay từ đầu thay vì vá sau khi ứng dụng đã vỡ ở môi trường thật.

Từ khóa liên quan

  • format json api online
  • api response formatter
  • làm đẹp json online
  • kiểm tra json hợp lệ
  • json không hợp lệ lỗi gì
  • đọc cấu trúc api response
  • json độ sâu lồng nhau
  • đếm số key trong json
  • json khóa trùng lặp
  • số lớn trong json bị sai
  • phân trang trong api response
  • cấu trúc response thành công và lỗi
  • beautify json miễn phí
  • json escape hai lần
  • dấu phẩy thừa trong json
  • công cụ debug api
  • json formatter online free
  • xem json dễ đọc
  • phân tích json response
  • format json không cần cài đặt

Công cụ Developer Tools liên quan

Dịch vụ của Tấn Phát Digital

Đang xây sản phẩm và cần thêm người làm phần nặng?

Gói giải pháp doanh nghiệp

Nền tảng custom cho ngân hàng, y tế và sàn B2B, chuẩn ISO 27001, GDPR, PCI-DSS, SLA 99.99%.

Từ 50.000.000đXem chi tiết →

Dịch vụ phát triển Blockchain & Web3

Smart contract, dApp và NFT marketplace đa chuỗi, audit bảo mật đầy đủ trước khi lên mainnet.

Từ 50.000.000đXem chi tiết →

Dịch vụ thiết kế website tại Hồ Chí Minh

Website doanh nghiệp, bán hàng và đặt lịch, chuẩn SEO ngay từ cấu trúc, tốc độ tải dưới 3 giây.

Từ 5.000.000đXem chi tiết →

Dịch vụ thiết kế landing page

Trang đích riêng cho từng chiến dịch quảng cáo, tỷ lệ chuyển đổi 3–8%, bàn giao trong 5–21 ngày.

Từ 3.000.000đXem chi tiết →

Tư vấn và báo giá miễn phí trong 24 giờ. Xem toàn bộ dịch vụ

Zalo
Facebook
Tấn Phát Digital
Zalo
Facebook