Konverter XML ke JSON

Apa Itu Konversi XML-ke-JSON dan Bagaimana Cara Kerjanya?

// Convert XML to JSON in Node.js using fast-xml-parser
import { XMLParser } from 'fast-xml-parser';

const xml = `<catalog>
  <product id="P01">
    <name>Wireless Headphones</name>
    <price currency="USD">79.99</price>
  </product>
</catalog>`;

const parser = new XMLParser({
  ignoreAttributes: false,      // preserve attributes
  attributeNamePrefix: '@_',    // @_ prefix for attributes
  textNodeName: '#text',        // #text for mixed element content
  parseAttributeValue: false,   // no type coercion on attributes
  parseTagValue: false,         // no type coercion on element text
});

const result = parser.parse(xml);
console.log(JSON.stringify(result, null, 2));
// {
//   "catalog": {
//     "product": {
//       "@_id": "P01",
//       "name": "Wireless Headphones",
//       "price": {
//         "@_currency": "USD",
//         "#text": "79.99"
//       }
//     }
//   }
// }

Fitur Utama

Contoh

<?xml version="1.0" encoding="UTF-8"?>
<appConfig version="2.1" env="production">
  <database>
    <host>db.example.com</host>
    <port>5432</port>
    <name>myapp_prod</name>
    <pool max="10" min="2"/>
  </database>
  <cache enabled="true">
    <ttl>3600</ttl>
    <driver>redis</driver>
  </cache>
</appConfig>

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://go-tools.org/tools/xml-to-json</loc>
    <lastmod>2026-05-29</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.8</priority>
  </url>
  <url>
    <loc>https://go-tools.org/tools/json-to-xml</loc>
    <lastmod>2026-05-29</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.8</priority>
  </url>
</urlset>

<item>
  <title>XML to JSON: A Practical Guide</title>
  <link>https://go-tools.org/blog/xml-to-json-guide</link>
  <pubDate>Thu, 29 May 2026 00:00:00 GMT</pubDate>
  <category>Developer Tools</category>
  <description>Learn how XML attributes map to @_ keys, how repeated elements become arrays, and why values stay strings in any XML-to-JSON conversion.</description>
  <guid isPermaLink="true">https://go-tools.org/blog/xml-to-json-guide</guid>
</item>

Cara Menggunakan

1. 1

   Tempel XML Anda

   Masukkan atau tempel XML ke kolom input di atas. Anda juga dapat klik 'Muat contoh' untuk mencoba sampel — file konfigurasi, fragmen sitemap, atau item RSS.

2. 2

   Lihat Output JSON Langsung

   JSON muncul seketika di panel output. Atribut menjadi kunci berprefix @_, konten teks elemen campuran menjadi #text, dan elemen saudara berulang menjadi array. Sesuaikan indent (2 atau 4 spasi) sesuai kebutuhan.

3. 3

   Salin atau Unduh

   Klik Copy untuk mengambil JSON ke clipboard, atau Download untuk menyimpannya sebagai file .json yang siap untuk aplikasi, API, atau pipeline data Anda.

Jebakan Konversi Umum

// XML: <timeout>30</timeout>
// JSON output: { "timeout": "30" }  ← string, not number
// Dangerous: comparing as-is
if (config.timeout > 25) { ... }  // "30" > 25 coerces, but fragile

// XML: <timeout>30</timeout>
// JSON output: { "timeout": "30" }
// Safe: explicit coercion where you know the type
if (parseInt(config.timeout, 10) > 25) { ... }

// XML with one item: <root><item>a</item></root>
// JSON: { "root": { "item": "a" } }  ← string, not array
result.root.item.forEach(i => console.log(i));  // TypeError: not a function

// Normalize to array regardless of count
const items = [].concat(result.root?.item ?? []);
items.forEach(i => console.log(i));  // safe for 0, 1, or many

// XML: <price currency="USD">29.99</price>
// JSON: { "price": { "@_currency": "USD", "#text": "29.99" } }
const amount = result.price;  // { "@_currency": "USD", "#text": "29.99" }, not "29.99"

// Handle both plain string and @_/#text object
const raw = result.price;
const amount = typeof raw === 'object' ? raw['#text'] : raw;  // "29.99"

<!-- Unescaped & — well-formedness error -->
<query>name = 'Alice' & role = 'admin'</query>

<!-- Escaped & — valid XML -->
<query>name = 'Alice' &amp; role = 'admin'</query>

// XML: <zipCode>01234</zipCode>
// This tool outputs: { "zipCode": "01234" }  ← correct
// But if a downstream schema coerces:
// { zipCode: z.number() }  → 1234  ← leading zero lost

// Declare ZIP codes and other padded identifiers as strings
// { zipCode: z.string() }  → "01234"  ← correct

Kasus Penggunaan Umum

Mengonsumsi API SOAP / XML Lama

Layanan enterprise lama (perbankan, asuransi, logistik) sering mengekspos API SOAP yang mengembalikan XML. Konversi respons ke JSON untuk bekerja dengan data menggunakan tooling JavaScript modern, menyimpannya di database dokumen, atau meneruskannya ke konsumen REST API.

Memproses Feed RSS dan Atom

Feed RSS 2.0 dan Atom 1.0 adalah XML. Konversi XML feed ke JSON untuk mengekstrak judul, tautan, tanggal publikasi, dan deskripsi untuk agregator feed, pipeline konten, dan sistem notifikasi tanpa ketergantungan library parsing XML.

Parsing File Sitemap

File sitemap.xml mencantumkan URL situs dengan metadata. Konversi sitemap ke JSON untuk menganalisis cakupan URL, membangun antrean crawl, membandingkan sitemap di berbagai lingkungan, atau memasukkan URL ke pemeriksa tautan atau alat audit SEO.

Transformasi File Konfigurasi

Banyak sistem enterprise (Spring, Maven, Ant, JBoss, Tomcat) menggunakan file konfigurasi XML. Konversi ke JSON untuk analisis, scripting migrasi, pembuatan dokumentasi, atau impor ke alat yang natively berbicara JSON.

Pengembangan Mobile dan Android

Resource Android, file layout, dan AndroidManifest.xml semuanya adalah XML. Konversi ke JSON untuk skrip analisis, audit otomatis, atau menghasilkan dokumentasi tentang izin yang dideklarasikan, aktivitas, dan nilai resource.

Migrasi Data dan ETL

Ekspor data dari sistem enterprise (ERP, CRM, penggajian) sering tiba sebagai XML. Konversi ke JSON sebagai langkah pertama dalam pipeline ETL untuk memuat data ke penyimpan data native JSON seperti MongoDB, Firestore, atau REST API.

Detail Teknis

Browser DOMParser untuk Parsing XML

Input XML di-parse menggunakan DOMParser bawaan browser dengan tipe MIME 'text/xml' — mesin yang sama yang digunakan untuk merender SVG dan XHTML. Sepenuhnya sesuai XML 1.0 dan melaporkan error well-formedness dengan informasi baris dan kolom. Pendekatan ini menangani namespace, bagian CDATA, instruksi pemrosesan, dan referensi entitas dengan benar tanpa ketergantungan pihak ketiga.

Serialisasi DOM-ke-JSON Rekursif

Setelah di-parse, alat menelusuri pohon DOM secara rekursif. Node elemen menjadi objek JSON; atributnya menjadi kunci berprefix @_; elemen hanya-teks menjadi nilai string biasa; elemen dengan atribut dan konten teks mendapat kunci #text untuk konten teks. Elemen saudara dengan nama yang sama dikumpulkan dan dikeluarkan sebagai array JSON. Node teks hanya-spasi di antara elemen dibuang.

Tanpa Konversi Tipe — Pemeliharaan String

Semua nilai atribut dan konten teks ditulis ke output JSON sebagai string. Tidak ada parseInt, parseFloat, atau parsing boolean yang diterapkan. Ini adalah pilihan desain yang disengaja untuk mencegah kerusakan data diam-diam untuk nilai berawalan nol, desimal yang sensitif presisi, dan string yang tampak boolean. Konversi tipe, jika diperlukan, harus diterapkan secara eksplisit dalam kode hilir.

100% Berbasis Browser — Tanpa Upload, Tanpa Server

Semua pemrosesan berjalan di JavaScript engine browser Anda. Tidak ada data yang ditransmisikan melalui jaringan kapan pun. Input yang lebih besar dari 200KB secara otomatis beralih dari mode langsung ke mode manual (memerlukan klik Convert eksplisit) untuk menjaga browser tetap responsif dan mencegah pemblokiran thread utama selama traversal DOM yang berat.

Praktik Terbaik

Validasi Well-Formedness XML Terlebih Dahulu

Jika sumber XML Anda ditulis tangan atau dihasilkan oleh sistem yang kadang menghasilkan output tidak valid, validasikan sebelum mengonversi. Gunakan tombol Validate di XML Formatter untuk mengonfirmasi XML well-formed dan mendapatkan lokasi error yang tepat untuk setiap masalah.

Normalisasi Field Satu-atau-Banyak ke Array

Ketika skema XML Anda mengizinkan satu atau banyak elemen anak dengan nama yang sama, output JSON akan berupa objek untuk satu elemen dan array untuk banyak. Selalu normalisasi field ini dalam kode konsumen Anda: const items = [].concat(result.items ?? []) — ini aman untuk nol, satu, atau banyak dan mencegah TypeError.

Terapkan Konversi Tipe Secara Eksplisit dan Selektif

Karena alat ini mempertahankan semua nilai sebagai string, terapkan konversi tipe secara sengaja dalam kode Anda untuk field spesifik yang memerlukannya. Menggunakan parseInt(val, 10) untuk field bilangan bulat yang diketahui adalah aman. Menerapkan konversi secara luas dengan Number(val) berisiko merusak nilai berawalan nol, string kosong, dan desimal yang sensitif presisi.

Periksa #text Saat Mengakses Nilai Elemen

Jika sebuah elemen dapat memiliki atribut dalam beberapa payload dan tidak dalam payload lain, nilai JSON-nya akan berupa string biasa (tanpa atribut) atau objek dengan kunci @_ dan kunci #text (dengan atribut). Tulis accessor yang tangguh: const val = typeof node === 'object' ? node['#text'] : node. Pola ini menangani kedua bentuk dan menghindari nilai undefined yang diam-diam.

Untuk Pekerjaan XML Lossless, Gunakan XML Formatter

Konversi XML-ke-JSON membuang komentar, instruksi pemrosesan, dan semantik namespace. Jika Anda perlu mempertahankan semua konten XML dengan tepat, gunakan XML Formatter untuk beautify, minify, dan validasi tanpa kehilangan apa pun. Konversi ke JSON hanya ketika Anda perlu bekerja dengan data dalam konteks native JSON.

Pertanyaan yang Sering Diajukan