LangGraph : Prebuilt エージェント : ユーザインターフェイス

任意の LangGraph エージェントとの相互作用のために Agent Chat UI 経由で事前構築済みチャット UI を使用できます。deployed 版の使用は最も素早く始める方法で、ローカルのグラフと配備されたグラフの両方とやり取りすることを可能にします。

LangGraph : Prebuilt エージェント : ユーザインターフェイス

作成 : クラスキャット・セールスインフォメーション
作成日時 : 06/17/2025

* 本記事は langchain-ai.github.io の以下のページを独自に翻訳した上で、補足説明を加えてまとめ直しています :

* サンプルコードの動作確認はしておりますが、必要な場合には適宜、追加改変しています。
* ご自由にリンクを張って頂いてかまいませんが、sales-info@classcat.com までご一報いただけると嬉しいです。

 

クラスキャット 人工知能 研究開発支援サービス ⭐️ リニューアルしました 😉

クラスキャット は人工知能に関する各種サービスを提供しています。お気軽にご相談ください :

  • 人工知能導入個別相談会(無償)実施中! [詳細]

  • 人工知能研究開発支援 [詳細]
    1. 自社特有情報を含むチャットボット構築支援
    2. 画像認識 (医療系含む) / 画像生成

  • PoC(概念実証)を失敗させないための支援 [詳細]

お問合せ : 下記までお願いします。

  • クラスキャット セールス・インフォメーション
  • sales-info@classcat.com
  • ClassCatJP

 

 

LangGraph : Get started : Prebuilt エージェント : ユーザインターフェイス

任意の LangGraph エージェントとの相互作用のために Agent Chat UI 経由で事前構築済みチャット UI を使用できます。deployed 版 の使用は最も素早く始める方法で、ローカルのグラフと配備されたグラフの両方とやり取りすることを可能にします。

 

UI でエージェントを実行する

まず、LangGraph API サーバを ローカルで セットアップするか、エージェントを LangGraph Platform で配備します。

次に、Agent Chat UI に進むか、レポジトリを複製して dev サーバをローカルで実行します :

 
Tip : UI has out-of-box support for rendering tool calls, and tool result messages. To customize what messages are shown, see the Hiding Messages in the Chat section in the Agent Chat UI documentation.

 

human-in-the-loop を追加する

Agent Chat UI は human-in-the-loop ワークフローを完全にサポートしています。それを試すには、(deployment ガイドの) src/agent/graph.py のエージェントコードをこの エージェント実装 で置き換えます :

 

Generative UI

Agent Chat UI の generative UI を使用することもできます。

Generative UI は React コンポーネントを定義し、LangGraph サーバの UI にそれらを配置することを可能にします。For more documentation on building generative UI LangGraph agents, read these docs.

 

以上