[JavaScript] xml-jsを使ってJSONデータとXMLデータを相互変換する方法

今回は JavaScriptを利用して JSONデータをXMLデータに、XMLデータをJSONデータに相互変換するための方法をまとめます。

本処理で利用するライブラリは「xml-js」となります。

xml-js ライブラリをインストール

npmを利用してxml-jsをインストールします。

$ npm install xml-js

次に、インストールしたxml-jsを利用できるようにimportします。

import { json2xml, xml2json } from 'xml-js';

ここでは、json → xml だけでなく xml → jsonも実施するため2つのメソッドを利用できるようにしておきます。

これで準備が整いました。

(github) xml-js

XMLデータをJSONデータに変換する

まずは XMLデータをJSONデータに変換します。

import { json2xml, xml2json } from 'xml-js';

const xmlData =
'<?xml version="1.0" encoding="utf-8"?>' +
'<root>' +
'<name>foo</name>' +
'<cars>' +
'  <color>red</color>' +
'  <price>3000000</price>' +
'  <age>2</age>' +
'</cars>' +
'<cars>' +
'  <color>green</color>' +
'  <price>4000000</price>' +
'  <age>3</age>' +
'</cars>' +
'<cars>' +
'  <color>blue</color>' +
'  <price>5000000</price>' +
'  <age>2</age>' +
'</cars>' +
'</root>';

const resultJson = xml2json(xmlData, { compact: true, spaces: 2 });
console.log(resultJson);

ここでは、xml2jsonを利用して xmlデータをjsonデータに変換しています。第２引数にはオプションを指定することができます。

出力結果は下記の通りです

{
  "_declaration": {
    "_attributes": {
      "version": "1.0",
      "encoding": "utf-8"
    }
  },
  "root": {
    "name": {
      "_text": "foo"
    },
    "cars": [
      {
        "color": {
          "_text": "red"
        },
        "price": {
          "_text": "3000000"
        },
        "age": {
          "_text": "2"
        }
      },
      {
        "color": {
          "_text": "green"
        },
        "price": {
          "_text": "4000000"
        },
        "age": {
          "_text": "3"
        }
      },
      {
        "color": {
          "_text": "blue"
        },
        "price": {
          "_text": "5000000"
        },
        "age": {
          "_text": "2"
        }
      }
    ]
  }
}

JSONデータをXMLデータに変換する

次はJSONデータをXMLデータに変換する方法となります。

import { json2xml, xml2json } from 'xml-js';

const jsonObj = {
  name: 'foo',
  cars: [
    { color: 'red', price: 3000000, age: 2 },
    { color: 'green', price: 4000000, age: 3 },
    { color: 'blue', price: 5000000, age: 2 },
  ],
};

const jsonData = JSON.stringify(jsonObj);
const resultXml = json2xml(jsonData, { compact: true, spaces: 2 });
console.log(resultXml);

jsonデータをxmlデータに変換する場合は json2xmlを利用します。ここでも第２引数にはオプションを指定することができます。

出力結果は下記の通りです。

<name>foo</name>
<cars>
  <color>red</color>
  <price>3000000</price>
  <age>2</age>
</cars>
<cars>
  <color>green</color>
  <price>4000000</price>
  <age>3</age>
</cars>
<cars>
  <color>blue</color>
  <price>5000000</price>
  <age>2</age>
</cars>

問題なくXMLに変換できました

最後に

今回は xml-jsというライブラリを使ったJSON/XMLの相互変換の方法を紹介しました。
是非利用してみてください。