จัดรูปแบบและตกแต่ง JSON

จัดรูปแบบและทำให้ JSON สวยงามพร้อม syntax highlighting

ลองตัวอย่าง

อินพุต

เอาต์พุต

ประมวลผลในเครื่อง · ปลอดภัยในการวางข้อมูลลับ

ลองดูด้วย:ตรวจสอบ JSON เปรียบเทียบ JSON จัดรูปแบบ JSON สวยงาม ย่อขนาด JSON JSON เป็น YAML แปลง JSON เป็น CSV JSON เป็น TypeScript JSON เป็น C# Class แปลง JSON เป็น Go Struct JSON เป็น Python JSON เป็น Java JSON เป็น Dart

อัปเดตล่าสุด: มีนาคม 2569

JSON Formatter คืออะไร?

JSON formatter หรือที่เรียกว่า JSON beautifier — รับ JSON ดิบหรือที่บีบอัดแล้วและแสดงผลเป็นข้อความที่สะอาดและมีโครงสร้างพร้อมการเยื้อง การขึ้นบรรทัดใหม่ และการเน้นสีไวยากรณ์ สิ่งสำคัญคือการจัดรูปแบบยังตรวจสอบ JSON ของคุณด้วย: parser จะตรวจจับวงเล็บที่ไม่ปิด เครื่องหมายจุลภาคที่วางผิดที่ และข้อผิดพลาดทางไวยากรณ์อื่นๆ ทันทีที่คุณวางข้อมูล

อ่านข้อกำหนด JSON →

Before · json

After · json

{"user":"alice","role":"admin","permissions":["read","write","delete"],"meta":{"created":1717200000,"verified":true}}

{
  "user": "alice",
  "role": "admin",
  "permissions": [
    "read",
    "write",
    "delete"
  ],
  "meta": {
    "created": 1717200000,
    "verified": true
  }
}

ทำไมต้องจัดรูปแบบ JSON?

การทำงานกับ JSON ที่ไม่ได้จัดรูปแบบเหมือนกับการอ่านหนังสือที่ไม่มีช่องว่างหรือเครื่องหมายวรรคตอน — ทำได้ในทางเทคนิคแต่เหนื่อยมาก การจัดรูปแบบทำให้มองเห็นโครงสร้างได้ทันทีเพื่อให้คุณสามารถนำทาง ดีบั๊ก และแก้ไขข้อมูลได้อย่างมั่นใจ

🎨

การเน้นสีไวยากรณ์

คีย์ สตริง ตัวเลข ค่าบูลีน และค่า null ที่มีรหัสสีช่วยให้คุณแยกแยะชนิดข้อมูลได้ทันทีและพบความไม่ตรงกันโดยไม่ต้องอ่านทุกตัวอักษร

⚡

ตรวจจับข้อผิดพลาดทันที

Formatter แยกวิเคราะห์ JSON ของคุณก่อนแสดงผล ข้อผิดพลาดทางไวยากรณ์ใดๆ — เครื่องหมายจุลภาคหายไป วงเล็บไม่ปิด หรือคีย์ที่ไม่มีเครื่องหมายอัญประกาศ — จะปรากฏขึ้นทันทีพร้อมข้อความที่ชัดเจน

↔️

จัดรูปแบบและย่อขนาดในที่เดียว

สลับระหว่างเอาต์พุตที่สวยงามและที่บีบอัดโดยไม่ต้องเปลี่ยนเครื่องมือ มีประโยชน์เมื่อเตรียม JSON ทั้งสำหรับการตรวจสอบโดยมนุษย์และการใช้งานในระบบผลิต

🔒

ทำงานฝั่งไคลเอนต์โดยสมบูรณ์

JSON ของคุณจะไม่ออกจากเบราว์เซอร์เลย การแยกวิเคราะห์และแสดงผลทั้งหมดเกิดขึ้นในเครื่องท้องถิ่น ทำให้ข้อมูลที่ละเอียดอ่อน โทเค็น และข้อมูลรับรองตัวตนเป็นส่วนตัว

วิธีใช้ตัวจัดรูปแบบ JSON ออนไลน์นี้

ตัวจัดรูปแบบถูกออกแบบมาสำหรับเวิร์กโฟลว์ที่ไม่มีอุปสรรค ไม่ต้องสมัครบัญชี ไม่ต้องอัปโหลด ไม่ต้องตั้งค่า — แค่วางและจัดรูปแบบ

1
วาง JSON ของคุณ
คลิกที่ตัวแก้ไขด้านซ้ายและวางค่า JSON ใดก็ได้ — ออบเจกต์, อาร์เรย์, สตริง, ตัวเลข, บูลีน หรือ null ตัวจัดรูปแบบรับ JSON แบบย่อที่เป็นบรรทัดเดียว, JSON ที่จัดรูปแบบบางส่วน หรือโครงสร้างใดก็ตามที่ถูกต้องทางไวยากรณ์
2
ตรวจสอบความถูกต้องทันที
ตัวแปลง syntax ทำงานทันทีที่ตรวจพบข้อมูลที่ป้อนเข้า หาก JSON ถูกต้อง ผลลัพธ์ที่มีโครงสร้างจะปรากฏทางด้านขวาทันที หากมีข้อผิดพลาดทางไวยากรณ์ ข้อความจะระบุปัญหาที่แน่ชัด — ขาดคอมมา, วงเล็บไม่ปิด หรือประเภทค่าไม่ถูกต้อง
3
คัดลอกหรือย่อ
คลิก คัดลอก เพื่อส่งผลลัพธ์ที่จัดรูปแบบแล้วไปยังคลิปบอร์ด คลิก ย่อ เพื่อลบช่องว่างทั้งหมดและบีบอัด JSON ให้เป็นบรรทัดเดียว — มีประโยชน์สำหรับ payload ในโปรดักชัน, คำขอ API และการจัดเก็บที่จำนวน byte มีความสำคัญ
4
แก้ไขและปรับปรุงซ้ำ
แก้ไขข้อมูลที่ป้อนโดยตรงและผลลัพธ์จะอัปเดตแบบเรียลไทม์ ใช้ตัวจัดรูปแบบเป็นกระดาษฉบับร่างสดขณะสร้าง request body ของ API, ออกแบบโครงสร้างไฟล์ config หรือตรวจสอบ data schema

กฎไวยากรณ์ JSON

JSON มีข้อกำหนดที่เข้มงวด นี่คือกฎสี่ข้อที่ทำให้เกิดข้อผิดพลาดทางไวยากรณ์มากที่สุดในทางปฏิบัติ:

สตริงต้องใช้เครื่องหมายอัญประกาศคู่

สตริงที่ใช้เครื่องหมายอัญประกาศเดี่ยวไม่ใช่ JSON ที่ถูกต้อง สตริงทุกตัว — ทั้งคีย์และค่า — ต้องอยู่ในเครื่องหมายอัญประกาศคู่

"key": "value"

ไม่มีเครื่องหมายจุลภาคท้าย

เครื่องหมายจุลภาคหลังรายการสุดท้ายในออบเจกต์หรืออาร์เรย์เป็นข้อผิดพลาดทางไวยากรณ์ นี่คือความผิดพลาดที่พบบ่อยที่สุดเมื่อแก้ไข JSON ด้วยมือ

{ "a": 1, "b": 2 }

ไม่มีความคิดเห็น

JSON มาตรฐานไม่รองรับความคิดเห็น // หรือ /* */ หากคุณต้องการความคิดเห็นในไฟล์คอนฟิก ให้ใช้ JSONC หรือ JSON5 และแปลงก่อนใช้ในการผลิต

{ "debug": false }

จำนวนเต็มขนาดใหญ่สูญเสียความแม่นยำ

JavaScript สามารถแสดงจำนวนเต็มได้อย่างปลอดภัยเพียงถึง 2^53 − 1 สำหรับ ID และ timestamp ที่เกินขีดจำกัดนั้น ให้เก็บเป็นสตริงเพื่อหลีกเลี่ยงการเสียหายของข้อมูลโดยไม่ทราบ

{ "id": "9007199254740993" }

ใส่ Escape ให้อักขระควบคุมในสตริง

อักขระ tab, ขึ้นบรรทัดใหม่ และ carriage return แบบดิบไม่สามารถใส่ในสตริง JSON ได้ ให้ใช้ escape sequence แทน — \n สำหรับขึ้นบรรทัดใหม่, \t สำหรับ tab ตัวจัดรูปแบบจะแจ้งข้อผิดพลาดทางไวยากรณ์สำหรับอักขระควบคุมที่ไม่ได้ใส่ escape

{"text": "Hello\nWorld\tindented"}

NaN และ Infinity ไม่ถูกต้อง

JavaScript อนุญาตให้ NaN และ Infinity เป็นค่าตัวเลข แต่ข้อกำหนด JSON อนุญาตเฉพาะตัวเลขจำกัดเท่านั้น หาก serializer ของคุณส่งออก NaN หรือ Infinity ให้แทนที่ด้วย null ก่อนแปลงข้อมูล

{"score": null}

กรณีการใช้งานทั่วไป

การตรวจสอบ payload API

จัดรูปแบบและตรวจสอบการตอบสนอง API เพื่อตรวจจับโครงสร้างที่ไม่คาดคิด ความไม่ตรงกันของชนิดข้อมูล และ JSON ที่ผิดพลาด ก่อนที่จะกลายเป็น bug ในโค้ดของคุณ

การตรวจสอบก่อน commit

ก่อน commit คอนฟิก JSON ให้วางลงใน formatter เพื่อตรวจสอบไวยากรณ์และตรวจจับเครื่องหมายจุลภาคท้ายหรือวงเล็บที่หายไปซึ่งจะทำให้แอปพลิเคชันของคุณพัง

การดีบักการซีเรียลไลเซชัน

เมื่อออบเจกต์ที่ซีเรียลไลซ์แล้วดูไม่ถูกต้อง การจัดรูปแบบจะเผยให้เห็นข้อผิดพลาดของชนิด ฟิลด์ที่หายไป และการซ้อนที่ไม่คาดคิดที่เกิดจากตรรกะการซีเรียลไลเซชัน

การวินิจฉัยข้อผิดพลาด

เมื่อ JSON ของคุณเกิดข้อผิดพลาดการแยกวิเคราะห์แต่คุณไม่เห็นสาเหตุ การจัดรูปแบบจะระบุตำแหน่งที่แน่นอนทันที — วงเล็บที่ไม่ปิด เครื่องหมายจุลภาคที่หายไป หรือค่าที่ไม่ถูกต้อง

การออกแบบสคีมา

ออกแบบและวนซ้ำรูปแบบสคีมา JSON โดยการจัดรูปแบบ payload ตัวอย่าง — ลำดับชั้นภาพช่วยให้ตรวจพบความซ้ำซ้อนและฟิลด์ที่หายไปได้ง่าย

การทดสอบและ Fixtures

เก็บไฟล์ JSON ของ fixture การทดสอบไว้ในรูปแบบที่จัดรูปแบบแล้วเพื่อให้ diff ใน version control มีความหมาย — ค่าที่เปลี่ยนแปลงหนึ่งค่าจะแสดงเป็นหนึ่งบรรทัดที่เปลี่ยนแปลง ไม่ใช่กำแพงข้อความ

ตัวจัดรูปแบบ JSON ออนไลน์ เทียบกับเครื่องมืออื่น

มีตัวจัดรูปแบบ JSON ออนไลน์หลายตัว ปัจจัยความแตกต่างหลักสำหรับการใช้งานในชีวิตประจำวันของนักพัฒนาคือความเป็นส่วนตัว, ความเร็ว และการผสานกับเวิร์กโฟลว์

ส่วนตัวอย่างสมบูรณ์ — ประมวลผลในเบราว์เซอร์เท่านั้น

เครื่องมือ JSON ออนไลน์ส่วนใหญ่ส่งข้อมูลที่คุณป้อนไปยังเซิร์ฟเวอร์ระยะไกล ตัวจัดรูปแบบ JSON ออนไลน์นี้ทำงานในเบราว์เซอร์ทั้งหมด — ไม่มีการส่งข้อมูลออกไป คุณสามารถวางข้อมูลประจำตัวในโปรดักชัน, การส่งออกฐานข้อมูล, token การยืนยันตัวตน และข้อมูลใดก็ตามที่ต้องรักษาความลับได้อย่างปลอดภัย

ไม่มีบัญชี, ไม่มีโฆษณา, ไม่มีอุปสรรค

เปิดเครื่องมือแล้วเริ่มจัดรูปแบบได้เลย ไม่ต้องสมัคร, ไม่ต้องยืนยันอีเมล, ไม่มีสิ่งใดขวางกั้นระหว่างคุณกับ JSON ของคุณ ตัวจัดรูปแบบพร้อมใช้งานทันทีและทำงานออฟไลน์ได้เมื่อหน้าเว็บโหลดแล้ว

จัดรูปแบบและย่อในเครื่องมือเดียว

ตัวจัดรูปแบบ JSON หลายตัวทำได้เพียง pretty-print เครื่องมือนี้มีสวิตช์ ย่อ เพื่อให้คุณสลับจาก JSON ที่มนุษย์อ่านได้ไปเป็น JSON แบบกระชับด้วยคลิกเดียว — ครอบคลุมทั้งสองด้านของเวิร์กโฟลว์จากการพัฒนาจนถึงโปรดักชันโดยไม่ต้องเปลี่ยนแท็บ

คำถามที่พบบ่อย

ความแตกต่างระหว่าง formatter และ validator คืออะไร?

Validator ตรวจสอบเพียงว่า JSON ถูกต้องทางไวยากรณ์หรือไม่และตอบใช่หรือไม่ Formatter ทำสิ่งนั้นและยังแสดงผลลัพธ์ในรูปแบบที่มีโครงสร้างและอ่านง่าย Formatter ของเราแจ้งข้อผิดพลาดเหมือน validator

การจัดรูปแบบเปลี่ยนข้อมูลหรือไม่?

ไม่ การจัดรูปแบบ JSON หมายถึงการแยกวิเคราะห์ การตรวจสอบ และการแสดงผล — ไม่ใช่แค่การเพิ่มช่องว่าง JSON ที่ออกมาจะมีความหมายเหมือนกันกับอินพุต แต่ตอนนี้คุณรู้ว่ามันถูกต้องทางไวยากรณ์ด้วย

ตัวจัดรูปแบบรองรับ JSON5 หรือ JSONC หรือไม่?

ไม่ — ตัวจัดรูปแบบนี้ตรวจสอบตามข้อกำหนด JSON มาตรฐาน (RFC 8259) JSON5 และ JSONC อนุญาตให้มีคอมเมนต์และคอมมาท้าย ซึ่งไม่ถูกต้องใน JSON มาตรฐาน หากไฟล์ของคุณใช้รูปแบบเหล่านี้ ให้ลบไวยากรณ์ที่ไม่ได้มาตรฐานออกก่อนวาง

JSON ของฉันถูกต้อง แต่ formatter แสดงข้อผิดพลาด — ทำไม?

สาเหตุที่เป็นไปได้มากที่สุดคือ: เครื่องหมายจุลภาคต่อท้ายหลังคู่คีย์-ค่าสุดท้าย สตริงที่มีเครื่องหมายอัญประกาศเดี่ยว หรือความคิดเห็น JavaScript (// หรือ /* */) สิ่งเหล่านี้ถูกต้องใน JS แต่ไม่ถูกต้องใน JSON มาตรฐาน

ฉันสามารถจัดรูปแบบไฟล์ JSON ขนาดใหญ่มากได้หรือไม่?

ได้ — เนื่องจากทุกอย่างทำงานในเบราว์เซอร์ของคุณ จึงไม่มีขีดจำกัดขนาดฝั่งเซิร์ฟเวอร์ ไฟล์ขนาดใหญ่มาก (10 MB+) อาจแสดงผลช้ากับการเน้นสีไวยากรณ์ แต่การจัดรูปแบบเองจะเสร็จสมบูรณ์

ปลอดภัยหรือไม่ที่จะวางข้อมูลที่ละเอียดอ่อนในตัวจัดรูปแบบนี้?

ใช่ ตัวจัดรูปแบบ JSON ออนไลน์นี้ประมวลผลทุกอย่างในเบราว์เซอร์ของคุณในเครื่อง — ไม่มีข้อมูลถูกส่งไปยังเซิร์ฟเวอร์ใดๆ คุณสามารถวาง API key, access token, ผลลัพธ์การสืบค้นฐานข้อมูล และ JSON payload ที่ละเอียดอ่อนอื่นๆ ได้อย่างปลอดภัย

ฉันสามารถย่อ JSON ด้วยเครื่องมือนี้ได้หรือไม่?

ได้ — ตัวจัดรูปแบบมีโหมดย่อ คลิกปุ่ม ย่อ เพื่อลบช่องว่างทั้งหมดและสร้าง JSON แบบกระชับบรรทัดเดียว ซึ่งมีประโยชน์เมื่อเตรียม payload สำหรับ API โปรดักชัน, การถ่ายโอนข้อมูลบนมือถือ หรือบริบทใดก็ตามที่ขนาด byte มีความสำคัญ

คู่มือภาษา

JSON Formatter Python — คู่มือ json.dumps()JSON Formatter Go — คู่มือ MarshalIndent()JSON Formatter JavaScript — JSON.stringify()จัดรูปแบบ JSON ใน Bash: คู่มือ jq และ python3

เครื่องมือที่เกี่ยวข้อง

ตรวจสอบ JSONตรวจสอบไวยากรณ์และโครงสร้าง JSON เปรียบเทียบ JSONเปรียบเทียบ JSON สองตัวและไฮไลต์ความแตกต่าง จัดรูปแบบ JSON สวยงามจัดรูปแบบ JSON ด้วยการเยื้องที่ปรับแต่งได้เพื่อความอ่านง่าย ย่อขนาด JSONย่อขนาด JSON โดยลบช่องว่าง JSON เป็น YAMLแปลง JSON เป็นรูปแบบ YAML แปลง JSON เป็น CSVแปลง JSON array เป็นรูปแบบ CSV JSON เป็น TypeScriptสร้าง TypeScript interfaces จาก JSON JSON เป็น C# Classสร้าง C# classes จาก JSON แปลง JSON เป็น Go Structสร้าง Go structs จาก JSON JSON เป็น Pythonสร้าง Python dataclasses จาก JSON JSON เป็น Javaสร้าง Java POJO classes จาก JSON JSON เป็น Dartสร้าง Dart class จาก JSON พร้อม fromJson และ toJson