2013.03.05   |   Javascript

最速のJSONビジュアライザー(解析・表示)

JSON形式のAPIを使うとき、構造を把握するのが結構面倒くさいので、
簡単にJSON形式のデータを解析・整形できるツールを作ってみました。

最速のJSONビジュアライザー
http://kimihiro-n.site44.com/json_dump/index.html

※2013/03/12 リンクのミス修正しました。
※2013/05/19 ツール名を「最速のJSONビジュアライザー」に変更しました。

使い方は簡単で、とってきたJSONをコピペして「Dump JSON」を押すだけです。
とりあえず試してみたいという方は右にある「Sample JSON」をポチッと。
フォームに入れたJSON形式のデータが見やすく整形されて表示されます。

入れ子になったJSON配列はなかなか解析しにくいですが、
このツールを利用して解析すればそこまで苦労せず
目的のノードに辿り着けると思います。

APIを使った開発等に是非ご利用ください。
きっと作業が捗ると思います。

JSONビジュアライザーについて

このツールはJavascriptで全部実装しています。
なので一度ロードすればオフラインでも使えますし、
機密なJSONをサーバーに送ったりせず安心して使える仕様になってます。
解析動作も割とサックサクです。
大きなJSONでもブラウザのメモリを食い尽くさない限り解析可能です。
再帰によって解析しているのでメモリ効率は悪いかもしれませんが、
実用上は問題ないです。

このツールの特記すべき特徴は右側の緑色の部分ですね。
これをコピペするだけでJSONから所定の値を一発取得出来ます。
(コピペして直利用できるのはJavascriptに限ります。
他の言語(PHPとか)でも文字列を数値に直したりすればいけるはず)
もういちいち階層を辿って調べてく必要はありません。
正直、これが欲しくてこのツールを開発しました。

また配列の部分はクリックで折りたためるようになってます。
適宜見やすい形にして解析を進めることが出来ます。

あとはコールバックとかが付いてても(JSONP形式)
加工したりせずそのまま貼ってくれれば自動で除去して解析します。