ブログ

ViewJSON について

要点

  • API 形式の JSON 内の多くの Base64 を、ツリー上で画像・音声・動画・PDF としてインライン表示します。
  • 閲覧・編集はブラウザ内で実行。共有リンクはクライアントで AES-GCM 暗号化し、サーバーは暗号文のみ保持、鍵は URL のハッシュ断片に残ります。
  • CodeMirror 6 ベースのエディター。大きなペイロード向け。超大容量(目安 100MB)で警告が出る場合があります。
  • AI/API レスポンスのデバッグ、マルチモーダルなリクエスト作成、暗号化ショートリンクによるチーム共有に便利です。

最終更新:

ViewJSON は、無料のオンライン JSON ビューアー兼フォーマッターです。従来のツールはすべての文字列をプレーンテキストとして表示しますが、ViewJSON は Base64 エンコードされた画像・音声・動画・PDF を自動検出し、JSON 構造の中にそのままレンダリングします。すべてのレンダリングはブラウザ内で完結します。共有時はクライアント側で AES-GCM 暗号化を行い、サーバーには暗号文のみが保存され、復号キーはネットワーク上に送信されません。

なぜこのツールを作ったのか

マルチモーダル AI API(OCR、音声合成、画像認識、画像生成など)はリクエストやレスポンスで Base64 を多用します。開発やテスト中に、次のような問題が繰り返し発生します:

出力の確認が面倒

TTS や画像生成 API が返す音声や画像は Base64 エンコードされています。中身を確認するたびに JSON から文字列を抜き出し、オンラインデコーダーに貼り付けてプレビューする必要があり、フィールドごとに同じ作業を繰り返すことになります。AI API の出力をデバッグする開発者にとって、ViewJSON はすべての Base64 メディアをインラインで即座にレンダリングすることで、手動で抽出する手間を完全に省きます。

入力の組み立てでミスしやすい

OCR や画像認識モデルを呼び出すには、まず別のサイトで画像を Base64 に変換し、API ツールのリクエストボディに貼り付けます。この過程でクォートやエスケープが壊れやすく、ロジックの問題よりも JSON の構文修正に時間を取られがちです。Vision API などの入力を作成する際、ViewJSON はエディター内に貼り付けた画像を自動的に Base64 に変換し、正しい JSON 構文を維持します。

履歴の中身がわからない

Postman や Fiddler はリクエスト履歴を保存しますが、Base64 フィールドは長い文字列として表示されるだけで、中身はわかりません。実際に送受信したメディアを確認するには、Base64 を 1 つずつ取り出してデコードする必要があります。API 履歴の振り返りを簡素化するため、ViewJSON は Base64 文字列を視覚的なプレビューとしてレンダリングし、過去に送受信したメディアをいつでも簡単に確認できるようにします。

そこで ViewJSON を作りました。JSON を貼り付けるだけで、画像はそのまま表示、音声はその場で再生、動画もインラインで視聴できます。

ユースケース

AI API レスポンスのデバッグ

Base64 メディアを含む API レスポンスを ViewJSON に貼り付けると、音声・画像・動画が自動検出され、JSON 構造内にインラインでレンダリングされます。手動で抜き出したり外部デコーダーを使う必要はありません。

マルチモーダル API リクエストの作成

画像をエディターに直接貼り付けると、プレビューが表示されると同時に JSON 内に Base64 文字列が格納されます。コピーすれば、そのまま API リクエストに使える Base64 データが得られます。

チームと JSON を共有

ViewJSON はローカルで AES-GCM を使用して JSON と変数を暗号化し、暗号文のみをアップロードして短いリンクを生成します。復号キーは URL のハッシュ(#)にのみ保持され、サーバーには送られません。受信者がリンクを開くと、すべてがブラウザ内で即座に復号されます。

よくあるツールとの違い

一般的なオンライン JSON ツール、API クライアントの流れ、ViewJSON の概要比較
一般的なオンライン JSON ビューアー API クライアント(履歴 / プレビュー) ViewJSON
JSON 内の Base64 メディア 一般的なオンライン JSON ビューアーはツリー内で Base64 をメディアとしてインライン表示しない—値はプレーンテキストのまま。 履歴の Base64 は長い不透明な文字列のままで、文脈上その場で実メディアをプレビューできない。 コンテンツシグネチャ(マジックバイト等)で形式を検出し、ツリー内に画像・音声・動画・PDF をインライン表示。
暗号化されたチーム共有 クライアント側 AES-GCM で密文だけを保存し、復号鍵が URL の # フラグメントにだけ残る短リンクに相当する一般的な製品フローはほぼない。 JSON を手でコピーして共有するのが一般的で、ワンクリックの「密文のみ短リンク」とは別物。 共有リンクはブラウザで AES-GCM、サーバーには暗号文のみ、鍵は # フラグメントに残り当社サーバーへ送られない。
画像貼り付け → JSON 内 Base64 JSON エディターで「画像を貼り付けて文書内に有効な Base64」をワンステップで行えることは稀。 HTTP リクエストの組み立てが中心で、文書全体の JSON+メディア貼り付けワークスペースではない。 画像をエディターに貼り付け、有効な JSON を保ったまま Base64 を挿入。
整形・検証・修復 整形・検証は一般的だが、同一ビューで Base64 をメディアとしてインライン表示する主流製品は実質ない。 リクエスト/レスポンスボディはテスト優先で、マルチモーダルpayloadのリッチなインライン表示はスコープ外。 整形・検証・修復とインラインメディアプレビューを同一ワークスペースで。

技術構成とプライバシー

Astro + React で構築

アイランドアーキテクチャにより JavaScript の読み込みを最小限に抑えます。クライアントサイドコードはインタラクティブなコンポーネントにのみ使用されます。履歴は localStorage ではなく IndexedDB に保存されるため、セッションを越えてデータを保持し、大容量の API ペイロードも安全に処理できます。

CodeMirror 6 エディター

プロフェッショナル向けのコードエディター。シンタックスハイライト、折りたたみ、検索、括弧マッチングに対応し、警告が表示されるまで最大 100 MB のファイルを処理できます。

CodeMirror 6 公式プロジェクト

Cloudflare Pages

Cloudflare のグローバルエッジネットワーク上にデプロイされ、世界中で高速にロードされます。

データプライバシー

すべてのレンダリングはローカルで完結します。共有時はアップロード前にクライアント側で AES-GCM 暗号化が行われ、サーバーには暗号文のみが保存されます。復号キーは URL ハッシュに残り、当社サーバーに送信されることはありません。

MDN: SubtleCrypto (Web Crypto API)

よくある質問

ViewJSON とは何ですか?

多くの API レスポンスに含まれる Base64 エンコードされたメディアを、長い文字列ではなく、画像・音声・動画・PDF として文書内にプレビューする無料のブラウザ上 JSON ビューアー/フォーマッターです。

生の JSON や復号キーはアップロードされますか?

通常の閲覧・編集ではデータはブラウザ内に留まります。共有リンクを作成する場合、AES-GCM で暗号化した暗号文だけがアップロードされ、復号キーは URL フラグメントに留まり、当社のサーバーには送られません。

普通の「整形」表示ツールとどう違いますか?

多くのビューアーは文字列をテキスト表示します。ViewJSON はマルチモーダルや AI 系 API の長い Base64 を、可能な限りメディアとしてインライン表示することを重視します。

ファイルサイズの上限はありますか?

非常に大きなファイルにも対応します。目安 100MB 前後で本ページ他の説明のとおりの警告が出ることがあります。

お問い合わせ

ご質問・ご意見・機能リクエストは support@viewjson.net