マルチユーザー✖️ChatGPTキャラクターのチャットアプリ
はじめに
ChatGPTでキャラクターを作って、会話を楽しんでいたけれど、一人でやっているのはつまらなくなってしまいました。
そこで、Streamlitでマルチユーザーに対応したチャットを作ってみました。
全体説明
ざっくりと技術要素とデモ画面を説明します。
技術要素
- フロントエンド
ユーザー登録画面やキャラクターの設定画面、チャット画面などStreamlitでささっと作成。 - ユーザー認証
ユーザー認証機能はStreamlit-Authenticatorが簡単に使えて便利だったため、こちらを利用。 - Database(DB)
ユーザー情報やチャットログ、キャラクター設定を保存するために、SQLiteを使用。
実装コード
実装したコードは以下になります。
環境構築や実行方法などはこちらのgithubリポジトリを参照して下さい。
画面と中身の処理説明
画面例をお見せしながら、中身を簡単に説明していこうと思います。
1. ユーザー登録
はじめに、register user画面ユーザー登録を実施します。
こちらのユーザー登録ウィジェットはStreamlit-Authenticatorで用意されているデフォルトのものをそのまま使用しています。
ユーザー登録が正常に実施されると、入力されたユーザー情報がローカルのDBに追加されます。
(メールアドレスは今回は使用していないので、適当なものtest@testなどを指定してしまって問題ありません。)
2. ログイン
次にlogin画面から先ほど登録したユーザーでログインを行います。
こちらのログインウィジェットもStreamlit-Authenticatorで用意されているデフォルトのものをそのまま使用しています(便利！)。
ログイン画面では、SQLiteから取得したユーザー情報と入力されたユーザー情報の突合を行っています。
ログインが成功すると以下のような画面に遷移します。
logoutボタンからログアウトすることも可能になります。
3. パスワードリセット
ログインを行うと、reset password画面からパスワードのリセットが可能になります。
こちらもStreamlit-Authenticatorで用意されているデフォルトのものをそのまま使用しているだけになります。
当たり前ですが、パスワードリセットを行うとその内容でローカルDBのユーザー情報も更新しています。
4. アイコン変更
さらにchange icon画面からユーザーのアイコンを変更することができます。
Browse filesボタンから画像ファイルをアップロードすることができます。
アップロードされた画像は指定フォルダ(src/const.pyファイルのIMAGE_DIR_PATHから指定可能)に保存されます。
5. 会話を行うキャラクターの人格を設定
set characterページからキャラクターの情報を設定できます。
人格情報を入力して、Update personaボタンを押下すると人格情報がDBに上書きされます。
6. チャット
chatページから以下のように複数ユーザーとキャラクター間で会話できます。
各ユーザーがメッセージを送信するごとに、キャラクターが回答を行います。
(キャラクターに関しては単純に入力されたキャラクター情報を使って回答を行うだけになりますが。。。)
所感
- Streamlitでフロントエンドが簡単に作れたから、意外と時間がかからずできた。
- マルチユーザー対応したのはいいけれど、結局一人で遊んでいる。。。
その他
Streamlitのチャット作成方法などは以下の私の他の記事もぜひ参考にして下さい。
Discussion