APIレスポンスを整える
貼り付けたJSONを整形し、パスを確認して型やスキーマ確認へ進みます。
- 1. JSON
ペイロードを検証、整形し、コンパクトなAPIレスポンスレポートをコピーします。
- 2. JSONPath
コードや文書に必要な正確なフィールドパスを取り出します。
- 3. JSON TS
サンプル構造をTypeScript interfaceの下書きに変えます。
JSON TSコードプライバシー: ブラウザ内処理
JSON to TypeScript
サンプル JSON から TypeScript interface を推測し、API レスポンスや設定型の下書きを素早く作ります。
入力 / 出力
まずツールを使う
入力、出力、コピー操作をこの領域にまとめています。例と確認項目は下に分けています。
ローカルセッション
入力状態はこのブラウザだけに保存され、アカウントなしで前回の作業を復元できます。
結果のあとに確認
基本の入力/出力が終わってから、必要な例、確認リスト、関連ツールだけを開きます。
3 ツール
JSONフィールドを抽出
payloadを整形し、wildcardやrecursive keyのパスを試して、コードで使う形を残します。
- 1. JSON
フィールド選択前に貼り付けたレスポンスを整形して検証します。
- 2. JSONPath
dot path、bracket key、wildcard、recursive key検索を試します。
- 3. JSON TS
フィールド構造が明確になったらTypeScript型の下書きを作ります。
コピー前の確認
- 元の入力と出力の形をもう一度比較します。
- 対象ランタイム、文字コード、タイムゾーン、セキュリティ方針の差を確認します。
- JSON to TypeScript の結果が次の作業に合うか関連ツールで続けて確認します。
よくある失敗例
- サンプル JSON から TypeScript interface を推測し、API レスポンスや設定型の下書きを素早く作ります。
- ブラウザ内処理の処理方式と実際の入力構造が合わない場合、出力をそのまま信頼できません。
関連ツール
JSONAPI レスポンス、設定ファイル、ログ内の JSON を読みやすく整形し、構文エラーを素早く見つけます。次の手順: API レスポンス、設定ファイル、ログ内の JSON を読みやすく整形し、構文エラーを素早く見つけます。SchemaJSON 値を簡単な JSON Schema ルールと照合し、required field や type mismatch を確認します。次の手順: JSON 値を簡単な JSON Schema ルールと照合し、required field や type mismatch を確認します。JSONPathJSONPath 風の selector でネストした配列やオブジェクト値を抽出し、API レスポンス構造を確認します。次の手順: JSONPath 風の selector でネストした配列やオブジェクト値を抽出し、API レスポンス構造を確認します。
ガイド
結果のあとに確認
基本の入力/出力が終わってから、必要な例、確認リスト、関連ツールだけを開きます。
例
このツールを始めるための入力例{"id":1,"name":"Bob"}利用シーン
コード- サンプル JSON から TypeScript interface を推測し、API レスポンスや設定型の下書きを素早く作ります。
- ブラウザ内処理で入力を扱い、コピー前に結果を確認します。
- JSON to TypeScript と関連ツールを続けて使い、作業フローを短くします。
- 元の入力と出力の形をもう一度比較します。
- 対象ランタイム、文字コード、タイムゾーン、セキュリティ方針の差を確認します。
- JSON to TypeScript の結果が次の作業に合うか関連ツールで続けて確認します。