The web runs on JSON. If you are building a React, Vue, or Node.js application today, JSON.parse() is the air you breathe.
But the enterprise world runs on XML.
If you work in banking, healthcare, or logistics, you inevitably hit the “Legacy Wall.” You need to fetch data from a 15-year-old SOAP API or an on-premise ERP system that spits out complex, attribute-heavy XML.
Bridging this gap is painful. Frontend developers often write hacky “regex parsers” to extract data, which break the moment the XML schema changes.
In this guide, we’ll look at the “Right Way” to map XML to JSON, preserving data integrity without bloat.
The “Geometry” Problem: Attributes vs. Keys
Why is converting XML to JSON so hard? It’s not just syntax; it’s structure.
JSON is Data-Centric. It has Keys and Values. XML is Document-Centric. It has Elements, Text, and Attributes.
Consider this classic XML snippet from a legacy inventory system:
XML
<item id="99" status="active">
<name>Widget A</name>
</item>
A naive converter might just grab the text content and give you this:
JSON
{
"item": { "name": "Widget A" }
}
You just lost data. The id and status were stored as attributes, not child elements. In legacy systems, metadata is almost always hidden in attributes.
The Solution: The @ Attribute Standard
To convert XML faithfully, we need a standard schema that JSON understands. The industry-standard approach (used by most enterprise libraries) is to map Attributes to keys prefixed with @.
Here is the correct JSON transformation for the XML above:
JSON
{
"item": {
"@id": "99",
"@status": "active",
"name": "Widget A"
}
}
This approach creates a predictable structure. Your code knows that any key starting with @ was originally an XML attribute.
Handling Mixed Content (#text)
What if an element has both text and attributes?
XML
<price currency="USD">49.99</price>
You can’t do {"price": 49.99} because you’d lose the currency. You can’t do {"price": {"@currency": "USD"}} because you’d lose the value.
The Fix: Use a #text key.
JSON
{
"price": {
"@currency": "USD",
"#text": "49.99"
}
}
Tutorial: Modernize Data in 30 Seconds
Writing a parser to handle these edge cases (plus Namespaces, CDATA, and Arrays) takes days. We built a tool to do it instantly.
Our XML ⇄ JSON Converter uses a robust DOM Parsing engine to handle the heavy lifting.
Step 1: Sanitize & Paste
Copy your XML response string.
- Pro Tip: If your XML is one giant line of code, click the Format (Prettify) button in our tool first. It adds proper indentation so you can actually read the data structure.
Step 2: Convert to JSON
Click the Right Arrow (→). The tool instantly generates a JSON object.
- Attributes are safely stored as
@key. - Repeating Tags (e.g., multiple
<order>tags) are automatically detected and converted into a JSON Array[...].
Step 3: Bi-Directional Engineering
Sometimes you need to send data back to the legacy system. This tool is bi-directional. You can edit the JSON (e.g., change "@status": "inactive"), click the Left Arrow (←), and it will reconstruct valid XML, placing the attributes back inside the tags where they belong.
[Try the Enterprise XML ⇄ JSON Converter]
- Preserves Attributes & Metadata
- Smart Array Detection
- 100% Local Processing (Safe for internal SOAP responses)
Don’t let legacy XML slow down your modern application. Convert it, clean it, and ship it.