シンプルなエージェントの作成 〜 その9 : Webアプリの検討(Streamlitのセットアップ) - Azure AI Agent
前回は、ナレッジに「AI Search」を追加したときの補足を紹介しました。
これまで試してきたナレッジを活用すれば、イベントの情報は提供できそうです。
そのため、今回は、UI側を考えてみたいと思います。
AI エージェントのUI
プレイグラウンドでの利用はAzure AI Foundryで十分ですが、外部顧客向けとなるとWeb UIが求められます。
AIエージェントのUIについて、いくつかのサイトを見ましたが、以下の説明がわかりやすかったです。
GitHub CopilotのUIが例として紹介されていました。
PythonのWebフレームワーク「Streamlit」
今回は、シンプルなチャット機能を実装します。
これまでPythonで検証してきたため、Pythonで人気のあるStreamlit(ストリームリット)を利用することにします。
↓Streamlit公式サイト。
↓導入方法の紹介
Streamlitの導入(Mac)
Streamlitの導入を行います。
# venvの有効化 / 3.12.x系を使用 # $ python -m venv .venv $ python3.12 -m venv .venv $ source ./.venv/bin/activate # streamlitのインストール $ pip install streamlit
メインフォルダにapp.pyというファイルを作成します。
import streamlit as st st.title('Streamlitで作成したアプリ') st.write('こんにちは。Streamlit で作成しました。')
テスト起動します。
# ローカルで、起動 $streamlit run app.py You can now view your Streamlit app in your browser. Local URL: http://localhost:8501 Network URL: http://192.168.11.11:8501 For better performance, install the Watchdog module:
ブラウザで動作を確認します。

非常に簡単です。
Azure App Service へのPythonアプリのデプロイ
次に、デプロイを行います。
ここでは、GitHubにPushして、GitHubから自動連携(CI/CD)します。
その前に、以下のコマンドで依存するパッケージをrequirements.txtに出力します。
$ pip freeze > requirements.txt
VS CodeでGitHubへプッシュします。

PythonアプリケーションをAzure Web Appへデプロイする方法は、こちらをご覧ください。
今回は、Learnドキュメントよりも簡易的なサンプルなので、以下の手順でWeb App Serviceを作成します。

デプロイセンターで、GitHubと接続します。

ログを確認し、正しくデプロイできたか検証します。

Pythonサーバーを起動するため、構成で起動コマンドを設定します。
python -m streamlit run app.py --server.port 8000 --server.address 0.0.0.0

Azure上で動作することを確認できました。

以上、Web側のUIの準備として、Streamlitのセットアップを行いました。
--
次回は、StreamlitでのUI変更と、Azure AI Agentと連携できるか試していきたいと思います。