連載「3分プロトタイピング」
- Streamlitを用いたAIチャットアプリ(この記事です)
- RAGを使ってAIチャットアプリケーションに知識を与える
- ベクトルデータベース超入門
大規模言語モデル(LLM: Large Language Model)を用いたアプリケーションを作る際、まずはChatGPTのようなチャットUIを再現して、独自コードであったり、独自データを組み合わせたいことは多いと思います。
ただ、チャットUIを0から作るのは結構時間がかかります。そこで、この記事ではStreamlitというフレームワークを使ってよくあるAIとチャットするアプリケーションの雛形を3分*1で用意したいと思います。
Streamlitとは
Streamlitは、PythonでWebアプリケーションを簡単に作成できるフレームワークです。GUIの作成が簡単で、コード量も少なくて済むため、AIとチャットするアプリケーションの雛形を作成するのにも適しています。
Pythonの実行環境の準備
asdfを使っている場合の手順を示します。他の方法で実行環境を用意している場合は、適宜読み替えてください。
asdf plugin-add python asdf install python 3.12.1 echo 'python 3.12.1' >> ~/.tool-versions
以下のコマンドを実行してPython 3.12.1
と表示されればOKです。
python -V
ここから3分です!
検証用のディレクトリを作って仮想環境を作る
Pythonの仮想環境を作成する方法は色々あるのですが、今回はvenv((https://docs.python.org/3/library/venv.html))
を使って仮想環境を作成します。
以下のように検証用のディレクトリを作り、そこに仮想環境を作成してみましょう。
mkdir hello-streamlit cd hello-streamlit python3 -m venv .venv source .venv/bin/activate
StreamlitとOpenAIのライブラリをインストール
以下のコマンドを実行してください。
pip install streamlit openai
Streamlitのアプリを作成
hello.py
ファイルを作成します。
# hello.pyファイルの作成 touch hello.py
エディタでhellp.py
を開き、以下のコードを貼り付けてください。
from openai import OpenAI import streamlit as st with st.sidebar: openai_api_key = st.text_input( "OpenAI API Key", key="chatbot_api_key", type="password" ) st.write("[Get an OpenAI API key](https://platform.openai.com/account/api-keys)") st.title("Hello Streamlit!") if "messages" not in st.session_state: st.session_state["messages"] = [{"role": "assistant", "content": "何か気になることはありますか?"}] for msg in st.session_state.messages: st.chat_message(msg["role"]).write(msg["content"]) if prompt := st.chat_input(): if not openai_api_key: st.info("Please add your OpenAI API key to continue.") st.stop() client = OpenAI( # This is the default and can be omitted api_key=openai_api_key, ) st.session_state.messages.append({"role": "user", "content": prompt}) st.chat_message("user").write(prompt) response = client.chat.completions.create( messages=st.session_state.messages, model="gpt-3.5-turbo", ) msg = response.choices[0].message st.session_state.messages.append({"role": "assistant", "content": msg.content}) st.chat_message("assistant").write(msg.content)
Streamlitのアプリを起動
以下のコマンドを実行して、Streamlitのアプリを起動してみましょう。
streamlit run hello.py
以下のような画面が表示されればOKです。
左側にOpenAIのAPI KEYの入力欄が表示されているので、OpenAIのAPI KEYを入力してください。 OpenAIのAPI KEYは、こちらのページから取得できます。
右側のチャット欄に何か入力してみましょう。すると、AIが返答してくれます。
いったん、まとめ
Streamlitを使って、3分でAIとチャットするアプリケーションの雛形を用意する方法を紹介しました。この雛形をカスタマイズすることで、独自のAIチャットアプリケーションを作成することができます。 次回は、この雛形とブログやSNSの投稿データを組み合わせて、自分の分身のようなアプリケーションを作る方法を紹介しますのでお楽しみに。
以下は、先ほど貼り付けたコードの解説です。
解説
- ライブラリのインポート
from openai import OpenAI import streamlit as st
このセクションでは、OpenAI の API にアクセスするための OpenAI ライブラリと、Streamlit で Web アプリケーションを作成するための streamlit ライブラリをインポートしています。
- Streamlit サイドバーの設定
with st.sidebar: openai_api_key = st.text_input("OpenAI API Key", key="chatbot_api_key", type="password") st.write("[Get an OpenAI API key](https://platform.openai.com/account/api-keys)")
このセクションでは、Streamlit アプリのサイドバーに、ユーザーが OpenAI の API キーを安全に入力できるテキスト入力ボックスを作成しています。また、API キーが必要な場合は、API キーを取得するためのリンクも提供しています。
- アプリケーションのタイトルの作成
st.title("Hello Streamlit!")
このセクションでは、Streamlit アプリのタイトルを設定しています。
- チャット履歴の初期化(必要に応じて)
if "messages" not in st.session_state: st.session_state["messages"] = [{"role": "assistant", "content": "何か気になることはありますか?"}]
このセクションでは、セッション ステートにチャット履歴が保存されているかどうかを確認しています。保存されていない場合は、アシスタントからの歓迎メッセージで会話を初期化します。
- チャット履歴の表示
for msg in st.session_state.messages: st.chat_message(msg["role"]).write(msg["content"])
このセクションでは、チャット履歴を反復処理し、ユーザーまたはアシスタントからの各メッセージを、Streamlit のチャットメッセージコンポーネントを使用して表示しています。
- ユーザー入力の処理
if prompt := st.chat_input(): if not openai_api_key: st.info("Please add your OpenAI API key to continue.") st.stop() client = OpenAI(api_key=openai_api_key) st.session_state.messages.append({"role": "user", "content": prompt}) st.chat_message("user").write(prompt) response = client.chat.completions.create( messages=st.session_state.messages, model="gpt-3.5-turbo", ) msg = response.choices[0].message st.session_state.messages.append(msg) st.chat_message("assistant").write(msg.content)
このセクションでは、ユーザー入力をチャット入力ボックスからキャプチャしています。
- 有効な OpenAI API キーが存在しない場合は、API キーが提供されていない場合はアプリを停止します。
- API キーを使用して OpenAI クライアントを作成します。
- ユーザー入力をチャット履歴に追加して表示します。
- 会話履歴を OpenAI の Chat Completions API に送信し、GPT-3.5-turbo モデルを使用して応答を生成します。
- アシスタントの応答をチャット履歴に追加して表示します。
*1:Pythonの実行環境が用意できてから3分で計算しています