DifyでRAGを使ったチャットボットの作成

## 背景

Dify を使えばローコードで LLM アプリを簡単に作れるようなので、ちょっと遊んでみました。

## やること
~~他意はないですが~~ [株式会社ブレインパッドの IR ニュース](https://www.brainpad.co.jp/ir/news.html) にある [【定性情報のみ】2024年6月期 第2四半期会社紹介および中期経営計画（2024年6月期～2026年6月期）](https://ssl4.eir-parts.net/doc/3655/ir_material_for_fiscal_ym/150706/00.pdf) を学習させて、ブレインパッドについて教えてくれるChatbotを簡易的に作成します。

## 手順
### 準備

https://dify.ai/jp

GoogleかGitHubでログインしてください。
今回は無料お試し版で進めます。

ログインしたら「スタジオ」画面から、「最初から作成」を押しましょう。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/2ef76273-9241-6880-4856-81eb59916a41.png)

今回は「チャットボット」 > 「Chatflow」 を作成します。上級ユーザー向けと書いてありますが気にしない気にしない。
名前は、適当に、ね。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/b777dd17-1479-7064-3b68-1b4f9c2040de.png)

デフォルトはこんな感じです。
入力クエリに対して GPT3.5 Turbo が回答してくれる構成になっています。こだわりがなければこのまま進めましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/d7d007e6-88ec-30b0-28fe-e7c548c1548d.png)

### 知識作成・取得
先ほどの会社紹介資料を学習させたいので、「開始」と「LLM」の間に「知識取得」を追加します。「開始」と「LLM」を結ぶ線の上にカーソルを合わせると「＋」が表示されるのでクリックすればOKです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/d9330078-0fff-eca8-1cae-edcbbfe2c813.png)

次に、RAGするための情報を提供します。画面上の「ナレッジ」を選択し、「新規作成」します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/88e1daa0-e2e4-e87e-f8f8-280d68fe230a.png)

「テキストファイルからインポート」で、先ほどの会社説明資料 (PDF) をアップロードします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/ea03a17f-c05d-5153-4e26-09a2603234fa.png)

ここでチャンクの区切り文字や最大チャンク長を指定することができます。今回はPDFをそのままアップロードしている時点で上手いこと整形するのは諦めてデフォルトのままにします。無料プランなのでインデックスモードだけ「経済的」にする必要があります。この辺は遊びだからいいんです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/7d9f0fe7-d7a9-7d32-4c26-c95dd342f930.png)

「スタジオ」に戻り、先ほどの「知識取得」の「知識」の右にある「＋」を押すと、先ほど作成した知識を追加できます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/79d38ab6-be4c-0630-cd8b-38cdfacd00d1.png)

### プロンプト設定

後はこの知識を参照して回答するようにプロンプトを設定します。
「LLM」のノードを選択し、以下の設定を行います。

 - コンテキスト
     - 「知識取得/result」を指定
 - SYSTEM
     - コンテキストに基づいて回答するよう指示
 - USER
     - 知識取得の結果に基づいて回答するよう念押ししたうえで質問を投げるよう設定

※変数は「/ (スラッシュ)」を入力すると候補が出ます。
今回の場合、「知識取得/result」に会社説明資料の情報が入り、「開始/sys.query」にはチャットに入力される文章が入ります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/adb95bf5-8842-2c23-e272-0f8f3990a5ad.png)

### プレビュー
準備が終わったら画面右上の「デバッグとプレビュー」を押してあげると、チャット画面が現れますので、Liglaについてでも聞いてみましょう。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/f45a69a0-5811-86d9-0e8b-b4e2a9b451f4.png)

いいですね！
ちなみに素のChatGPTさんは Ligla について知らないようなので (残念)、きちんと知識取得できていそうです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/42f12826-933d-c753-d280-cc87932492ae.png)


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/4a0c7819-d1f5-76ec-18f6-ba93d65e7b61.png)

あらら
「ありがとうございましたが」ってww

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/589d744c-3db3-be5d-c70d-84d785709a0b.png)

こっちか。
表記ゆれとかどうやって対策するんですかね。

### 公開

アプリの公開も画面右上の「公開する」から簡単に行えます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/24014f34-d354-8ebd-4d3f-3d99726585b4.png)

公開を押した後に「アプリを実行」を選択すると、ChatGPTの色違いのような画面が現れます。


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3777293/4576a8ac-86ee-1dd2-1207-9ac25a1b8b68.png)

ちゃんと機能してますね！
Web埋め込みやAPI利用も可能なようです。


## まとめ

巷で盛り上がっている (?) Dify で遊んでみました。自分は LLM や RAG に関して特に詳しくないですが、細かい調整はさておきシンプルなアプリなら簡単に作成できますね～
ま、問題はこれを何に使うかですよねぇ。

どうでもいいですが Dify と DeFi がややこしくて混乱します。