TECH BLOG

エルカミーの技術ブログです

【Difyで作るシリーズ 2】会社情報Q&Aチャットボット

はじめに

Difyというサービスを聞いたことがあるけれど、「何ができるかわからない」、「どう使うのかわからない」などの理由で使ったことがない方々は多いのではないでしょうか。

そのような方のために、「Dify で何ができるのか?や Dify を使った活用事例」を紹介する記事をシリーズ化していきます。

今回は第2回目で、会社のWebページをもとに、会社情報について回答するチャットボットを作ります。

この記事の対象者
  • Dify という言葉を聞いたことがあるが、何ができるのかがわからない人
  • Dify を業務に取り入れたいと検討している人
事前準備

こちらを参考に、事前準備をしてください

  • Difyへのサインアップ
  • APIキーの取得
  • APIキーのセットアップ
環境
  • Chrome
  • Dify v0.10.2(2024年10月30日時点)フリープラン

作成するAIアプリの概要

完成イメージ

まずは、今回作成するアプリの完成イメージについてです。

このアプリは、ブラウザからAIアプリにアクセスして使用します。

イメージ

「Talk to Bot」欄に質問したい内容を入力すると、回答が返ってきます。

左側サイドバーに会話履歴を残すことができます。

image block
作成するワークフロー

上記のアプリを構築するためにワークフローを作る説明をします。

💡
ワークフローとは

一つ一つの処理を小さなブロック(ノード)としてつなぎ合わせて、一連のプロレスを自動化する機能です。

今回作成するワークフローのDifyの画面です。

image block

このワークフローは、下記のブロックで構成されます。

flowchart LR
    A[開始] --> B[知識取得]
    B --> C{IF/ELSE}
    C -- IF --> D[LLM]
    C -- ELSE --> E[テンプレート]
    D --> F[変数集約器]
    E --> F
    F --> G[回答]
  1. 開始:ユーザーの質問を受け付けるノードです。
  2. 知識取得:ユーザーの質問に対して,事前に取得したデータから関連する情報を検索します。
  3. IF/ELSEで質問が会社情報に関連しているかどうかを判定します。
    • 関連ありの場合:取得したデータをもとに,LLMが回答を生成します。
    • 関連なしの場合:設定したテンプレートを使用して対応します。
  4. 変数集約器:変数をまとめて、後続の処理を簡素化します。
  5. 回答:最終的な回答をユーザーに出力します。

作業手順

ここからは、ワークフロー構築の手順について説明します。

手順

  1. ワークフローの新規作成
  2. ワークフロー作成画面上での作業
  3. ワークフローの動作確認
1. ワークフローの新規作成
  1. 最初の画面から「最初から作成」を選択してください。
    image block
  2. 「チャットボット」を選択し、「Chatflow」を選択します。

    「アプリのアイコンと名前」を記述してから「作成する」を選択します。

    image block

2. ワークフロー作成画面上での作業
  1. 「ナレッジ」の登録をします。

    「ナレッジ」を選択し、「ナレッジを作成」を選択します。

    image block

  2. 「ウェブサイトから同期」を選択し、「Firecrawl」を選択後、「設定」を選択します。
    image block
  3. 「設定」を選択します。
    image block
  4. 「firecrawl.devからAPIキーを取得する」を選択します。
    image block
  5. 遷移先ページでサインアップした後、「API Keys」ページのAPI Keyを取得します。
    image block
  6. Difyのページに戻り「API Key」を入力、「保存」を選択します。
    image block
  7. 「ナレッジ」ページに戻り、参照したいWebページのURLを入力し、「実行」を選択します。

    今回は、https://elcamy.comを入力します。

    image block
  8. 完了したら、「次へ」を選択します。
    image block
  9. 「保存して処理」を選択します。

    ナレッジデータのチューニングができますが、今回はデフォルトのままにします。

    image block

    ワークフローの画面に戻って、ワークフローを作成します。

  10. 「開始」ノードと「LLM」ノードの間の「+」ボタンを押します。

    「知識取得」を選択します。

    image block
    💡
    「知識取得」ノードとは

    ユーザーの質問に関連する情報を、「ナレッジ」で取得してきたデータ検索し、それを元にAIが回答を生成できるようにする機能です。

  11. 「ナレッジ」ノードの「+」ボタンを押した後、先程追加した知識(画面では「elcamy」)を選択し、「追加」を選択します。
    image block
  12. 「LLM」ノードを選択し、「コンテキスト」中の「知識取得」の「result」を選択します。
    💡
    「LLM」ノードとは

    AIがユーザーの質問に基づいて会話や生成、分類など多様なタスクを処理するための機能を持つ機能です。

  13. 「SYSTEM」欄の「{x}」ボタンをクリックし、「コンテキスト」を選択します。
    image block
  14. 確認のため一度実行します。

    「プレビュー」を選択し、任意の文章を記述します。

    image block

    回答が返ってきました。

    このままでもチャットボットとして機能しますが、以下のように、取得した情報と関係のない質問にも回答してしまいます。

    image block

    そこで、取得した会社情報に関することのみ回答するよう設定します。

  15. 「知識取得」ノードを選択し、赤枠のボタンをクリックします。
    image block
  16. 「ナレッジの設定」が開きますので、「スコア閾値」を有効にし、値を「0.3」に設定して、「保存」を選択してください。
    image block
  17. 「知識取得」ノードと「LLM」ノードの間の「+」ボタンをクリックし、「IF/ELSE」を選択します。
    💡
    「IF/ElSE」ノードとは

    特定の条件に応じてチャットフローやワークフローを分岐させ、異なる処理を実行できる機能です。

    image block
  18. 「条件を追加」を選択後、「知識取得」の「{x}result」を選択します。
    image block
  19. 「空でない」を選択します。
    image block
  20. 「ELSE」の「+」ボタンをクリックし、「テンプレート」を選択します。
    💡
    「テンプレート」ノードとは

    データやテキストを加工・変換して好きな形に整えるための機能です。

    image block
  21. デフォルトで設定してある「入力変数」を削除します。「コード」欄に以下のように文章を入力します。
    申し訳ありませんが、その内容に関する情報がありません。
    image block
  22. 「IF/ELSE」ノードの「IF」と「LLM」ノードをつなぎます。

    「LLM」ノードと「回答」ノードの間の「+」をクリックし、「変数集約器」を選択します。

    💡
    「変数集約」ノードとは

    複数ブランチの変数を一つにまとめて下流ノードで統一して利用できるようにする機能です。

    image block
  23. 「テンプレート」ノードと「変数集約器」ノードをつなぎます。

    「変数を代入する」の「+」ボタンを押し、「テンプレート」の「{x}output」と、「LLM」の「{x}test」を選択します。

    image block

  24. 「回答」ノードを選択し、既存の値を削除します。

    「回答」の「{x}」ボタンをクリックし、「変数集約器」の「{x}output」を選択します。

    image block

  25. 「プレビュー」を選択し、実行して確認します。
    image block

    以下のように、会社情報と関係ないことには回答しないようにすることもできました。

    image block
3. ワークフローの 動作確認
  1. 「公開する」を選択し、「アプリを実行」選択します。
    image block
  2. アプリで質問します

    無事に外部の情報を使った回答が返ってきました。

    image block

    以上です。

応用

今回の記事では、弊社のホームページを使用しましたが、外部ナレッジのURLを変更すると、そのサイトに関するQ&Aチャットボットを作成することができます。例えば、自社のFAQページのURLを指定すれば、顧客対応ができるカスタマーサポートのチャットボットを作成することができます。

おわりに

今回の記事では、Difyを使ってホームページの情報をもとにユーザーの質問に回答するチャットボットのワークフローの作成手順を紹介しました。Difyのチャットボットを利用することで、用途に応じたAIチャットボットを作ることができます。

今後もDifyを活用したさまざまなユースケースを紹介していく予定です。ぜひ引き続きご覧ください。