n8n RAGエージェントにチャットUIを繋ぐ3つの方法

「n8nでRAGエージェントは作れた。でも、チャット画面が使いにくい…」

Reddit（r/n8n）でも同じ悩みが多く投稿されています。n8nとQdrant（ベクターデータベース）を組み合わせてRAGを構築できても、使いやすいフロントエンドがないと実用性が半減します。

結論、現時点でおすすめの方法は3つ。n8n内蔵のChat Trigger・Open WebUI・Typebotです。目的に合わせて選べば、コードをほぼ書かずにチャットUIが完成します。

初めてn8nを触る方は「基本編」から、すでにワークフローを動かしている方は「応用編」のTypebotから読んでみてください。

この記事では、3つの方法の設定手順・比較表・よくあるトラブル対処を解説します。

n8n＋Qdrant RAGとは？30秒でわかる仕組み

まず前提の整理から。「RAG」「Qdrant」「n8n」という言葉が並んでいますが、それぞれの役割はシンプルです。

RAG（Retrieval-Augmented Generation）：AIが回答する前に、自分で用意したドキュメントを検索して情報を取り出す仕組みです。社内マニュアルや自分のメモをAIに読ませて、「このドキュメントから答えて」という質問応答ができます。

Qdrant：RAG用のデータを保存するベクターデータベースです。Dockerで1コマンド起動できるオープンソースツールで、n8nとの連携が公式にサポートされています。

n8n：ノーコードで自動化ワークフローを作るツールです。AIノードが充実していて、Qdrantとの接続も標準対応しています。

三つを組み合わせると「自分のドキュメントに回答するAIチャット」が作れます。問題は、そのチャット画面をどう用意するかです。

チャットUIが必要な理由と選び方の3基準

n8nには「Chat Trigger」という機能があり、これだけでもチャットUIが使えます。それでも、別のフロントエンドを探す理由は主に3つです。

• 見た目がシンプルすぎる：Chat TriggerのデフォルトUIは機能的ですが、デザインは最低限です
• 会話履歴の管理が弱い：セッションをまたいだ履歴保存には追加設定が必要になります
• 外部公開しにくい：認証なしのエンドポイントをそのままブラウザに貼るのは不安があります

フロントエンドを選ぶときの3基準です。

この3基準で評価すると、Chat Trigger・Open WebUI・Typebotがそれぞれ異なるポジションを持っています。順番に見ていきましょう。

【基本編】方法①：n8n内蔵のChat Triggerを使う

まず最もシンプルな方法から。n8nには標準で「Chat Trigger」ノードが含まれていて、追加インストールは不要です。

設定手順（所要時間：約5分）

1. n8nで新規ワークフローを作成
2. 「Chat Trigger」ノードをキャンバスに配置
3. AIエージェントノード（AI Agent）を繋ぐ
4. Qdrantをベクターストアとして接続
5. ワークフローを「Active」にする
6. Chat Triggerの「Open Chat」ボタンからUIにアクセス

生成されるURLは https://あなたのn8nドメイン/webhook/xxxx/chat という形式です。このURLをブラウザで開くと、シンプルなチャット画面が表示されます。

Chat Triggerが向いている人

• まず動かして確認したい人
• 自分だけが使うプライベートなツール
• 追加のサーバー設定をしたくない人

注意点

デフォルトでは認証がありません。URLを知っている人なら誰でもアクセスできるので、外部公開する場合はn8n側でBasic認証を設定するか、後述のOpen WebUIやTypebotを検討してください。

💡 実際にやってみた

Mac mini M4 Pro（24GB）でn8nをDocker経由で稼働させ、Chat TriggerとOllama（Gemma3 12B）を繋いでみました。

ハマったのはDockerネットワーク内でOllamaに繋ぐURL指定です。localhost:11434では接続できず、host.docker.internal:11434に書き直したら即解決しました。

かかった時間：約15分（Ollama起動済みの前提）
つまずいたポイント：DockerコンテナからOllamaへのURL指定（localhostが解決されない）
結果：Gemma3 12Bが自分のMarkdownドキュメントに回答するRAGチャットが完成。1問あたり3〜8秒のレスポンスで実用レベルでした。

【基本編】方法②：Open WebUIをn8nと連携する

Open WebUIはOllamaやOpenAI互換APIを接続できるChatGPT風のUIです。会話履歴の保存やユーザー管理まで対応していて、見た目も機能も本格的です。

Open WebUIの特徴

• Dockerで1コマンド起動
• 複数モデルの切り替えに対応
• 会話履歴をローカルのDBに保存
• ユーザー登録・認証機能あり
• ダークモード・スマホ対応

Dockerで起動する（1コマンド）

docker run -d \
  -p 3000:8080 \
  -v open-webui:/app/backend/data \
  --name open-webui \
  ghcr.io/open-webui/open-webui:main

http://localhost:3000 でアクセスできます。初回は管理者アカウントを作成するだけです。

n8nとの連携方法

Open WebUI単体ではn8nと直接繋がりません。「Open WebUI Functions」という機能で、n8nのWebhookを「ツール」として呼び出す設定ができます。

手順の大まかな流れはこうです。

1. n8nでChat Triggerを使ったワークフローを作成し、WebhookのURLを控える
2. Open WebUIの管理画面→「Functions」で新しいFunctionを作成
3. FunctionのコードにnのWebhook URLを指定してHTTPリクエストで呼び出す
4. チャット時に「Tools」からFunctionを有効化する

少しPythonコードが必要になりますが、ChatGPTのカスタムツール設定と同じ感覚で操作できます。

VPSで常時稼働させる方法

Open WebUIをチームで使うなら、VPS上でDockerコンテナを常時稼働させるのが現実的です。XServer VPSはDockerが標準対応していて、n8n＋Qdrant＋Open WebUIをまとめてセルフホストするのに使いやすい構成です（月額1,569円〜）。

Open WebUIが向いている人

• Ollamaをすでに使っている人
• ChatGPTに近い使い勝手が欲しい人
• 複数人でチャットUIを共有したい人

【応用編】方法③：Typebotで会話フローを作りn8nに繋ぐ

Typebotは「チャットボット形式の会話UI」を作れるオープンソースツールです。n8nとの相性がよく、Typebotが会話フローを担当してAI処理をn8nに投げる構成が作れます。

Typebotの特徴

• ノーコードで会話フロー設計（ブロックをドラッグ＆ドロップ）
• HTTP Requestブロックが標準搭載（Webhook送信に使う）
• n8nからのレスポンスを変数として受け取れる
• スマホ対応・WordPressへの埋め込み対応
• Dockerでセルフホスト可能（無料）

n8nとの連携手順

1. Typebotのエディタで「Text Input（ユーザー入力）」ブロックを配置
2. 「HTTP Request」ブロックを追加し、n8nのWebhook URLを送信先に設定
3. ユーザーの入力値を変数としてBodyに含める（例：{"message": "{{Input}}"}）
4. n8nからのレスポンス（JSON）を「Set Variable」で変数に格納
5. 「Text Bubble」ブロックで変数の内容をチャットに表示する

一度設定すれば、ユーザーが質問→n8nでRAG処理→Typebotに返答、というフローが自動で動きます。

セルフホストの注意点

Typebotのセルフホストにはデータベース（PostgreSQL）が必要で、Open WebUIより設定が少し複雑です。ConoHa VPSの2GBプランなら、PostgreSQL＋Typebot＋n8nをまとめて動かせるスペックがあります（月額1,000円前後）。

Typebotが向いている人

• 見た目にこだわってブランドカラーを設定したい人
• 最初に話題を分類してからAIに渡したい人
• WordPressや自社サイトにチャットを埋め込みたい人

3つの方法を一覧で比較

よくあるトラブルと対処法

Q. Chat TriggerのURLを外部から叩くとCORSエラーになる

外部ドメインからn8nのWebhookを呼ぶとき、CORSエラーが出ることがあります。n8nを起動するdocker-compose.ymlの環境変数に以下を追加してください。

N8N_CORS_ENABLED=true
N8N_CORS_ALLOWED_ORIGINS=*

本番環境では * の代わりに、許可するドメインを具体的に指定することをおすすめします。

Q. Qdrantへの接続でタイムアウトエラーが出る

Docker Compose構成の場合、QdrantのURLは http://qdrant:6333（サービス名）で指定します。localhost:6333 はDockerコンテナ内では解決できないため、必ずコンテナ名で指定してください。

Q. Open WebUIからOllamaに繋がらない

Open WebUIとOllamaが別コンテナの場合、Ollamaの環境変数を設定します。

OLLAMA_HOST=0.0.0.0

設定後にOllamaを再起動し、Open WebUIのOllama URLには http://host.docker.internal:11434 を指定してください。

Q. Typebotのセルフホストでメール認証がうまくいかない

Typebotはデフォルトでメール認証が必要です。まず動作確認だけしたい場合は、環境変数 NEXTAUTH_URL の設定と、メール送信なしでログインできる「magic link」設定を省略する方法を公式ドキュメントで確認してみてください。

まとめ

• まず試すなら Chat Trigger（n8n内蔵、設定5分・追加費用ゼロ）
• Ollamaユーザーには Open WebUI（会話履歴・ユーザー管理・ChatGPT風UI）
• 外部公開・埋め込みなら Typebot（デザイン自由・WordPressに埋め込める）
• Docker環境でのURL指定は localhost ではなくコンテナ名か host.docker.internal
• 外部公開時は認証設定を必ず追加する

n8nをDockerで構築する手順について詳しく知りたい方は、こちらの記事も参考にしてみてください。

→ n8nをMac miniのDockerで動かす手順｜ヘッドレス常時稼働まで