はじめまして！ジェネラティブエージェンツの清水れみおです！
今流行りのLLMアプリ開発プラットフォーム『Dify』についてユースケースや実装方法をみなさんに提供していきます！
今回はJSON Parse(整形)についてです！
※2024年8月時点の環境です。Dify Ver.0.6.16
Dify で HTTP ブロックをよく使いますよね？ API からデータを取得して色々処理したい時に便利なんですが、返ってくる result の整形がちょっと面倒に感じることはありませんか？
特に複雑な JSON データだと、必要な情報を取り出すのにコードを結構書かないといけなかったり…。
そこで今回は、Dify の JSON Parse ツール を使って、JSON データの整形を劇的に楽にする方法をご紹介します！
例えば、画像のように GCP Vision API から返ってきた結果からテキストデータだけを抽出したいとします。
一般的な方法としては、コードブロックのJavaScript でHTTPの結果の{body}を選択し、バックスラッシュ付きの引用符と改行文字を削除します。
そして JSON.parse() を使って JSON データをパースし、必要な要素にアクセスするコードを書く必要があります (画像1)。
function main(args) { const cleaned = args.replace(/\r/g, "").replace(/\n/g, ""); const result = JSON.parse(cleaned); const description = result.responses[0].textAnnotations[0].description; return { ocr_result: description }; }
HTTPブロックを使うたびに毎回このコードを書くのは面倒ですよね
Dify の JSON Parse ツールを使ってみよう！
Dify の JSON Parse ツールを使えば、こんな面倒な JSON 処理をノーコードで 実行できます。
1. ツールの選択
ブロックを追加から、ツール一覧の JSON Parseツールを探してワークフローに追加します (画像2)。
JSON Parse ツールをクリックして設定画面を開き、以下のパラメータを設定します (画像3)。
{body}を指定します。
JSON filter: 抽出したいデータのパス。responses[0].textAnnotations[0].description のように、JSON の構造に従ってパスを記述します。
3. 実行結果の確認
設定が完了したらワークフローをテスト実行します。
JSON Parse ツールは、指定した JSON filter に基づいてデータを抽出し、出力変数{text}に格納します (画像3)。
これで、複雑な JSON データから必要な情報だけを簡単に抽出できました！
JavaScript のコードを書く必要もなく、視覚的に分かりやすいインターフェースで操作できるので、作業効率が大幅に向上します。
Dify の JSON Parse ツールを活用して、HTTPブロックでAPIをいっぱい使っていきましょう！
