Feel Physics Backyard

HoloLensの出張授業をする会社で、教材を開発しています

Difyアプリを埋め込むと「Please check if your app mode matches the right API route.」と言われて動作しないときの対処法

私が直面したちょっとした技術的なトラブルとその解決法をご紹介します。

生成AIを活用したサービスを手軽に導入できる「Dify」を使って自社のホームページにAIチャットボットを埋め込もうとしたところ、予想外の壁にぶつかりました。しかし、その解決策は意外にシンプルでした。

エラー発生と原因

Difyを使ってテキスト生成AIアプリを作成し、提供されたHTMLコードをそのままホームページに貼り付けたところ、「Please check if your app mode matches the right API route.」というエラーメッセージが表示されて動作しませんでした。これは一見難解なメッセージに思えますが、実はiframeのURLパスが間違っているという単純な問題でした。

解決方法

問題の根本は、Difyから提供されるデフォルトのiframeコードが、アプリのモードと一致していなかったことです。具体的には以下のように修正することで解決しました。

修正前:

<iframe
 src="https://udify.app/chatbot/xxxxxxxxxxxxxxxx"
 style="width: 100%; height: 100%; min-height: 700px"
 frameborder="0"
 allow="microphone">
</iframe>

修正後:

<iframe
 src="https://udify.app/completion/xxxxxxxxxxxxxxxx"
 style="width: 100%; height: 100%; min-height: 700px"
 frameborder="0"
 allow="microphone">
</iframe>

URLの「chatbot」部分を「completion」に変更するだけで、エラーは解消されました。

重要ポイント

Difyでは「チャットモード」と「テキスト生成モード」の二種類があり、それぞれ異なるAPIルートを使用します。テキスト生成モードのアプリを埋め込む場合は「completion」のパスを、チャットモードのアプリには「chatbot」のパスを使用する必要があります。アプリ作成時に選択したモードと一致するように、iframe URLを確認することがトラブル防止のカギとなります。