サイトアイコン アマチュア無線局JS2IIU

Streamlit応用編 第7回: 認証とセキュリティ

JS2IIU

こんにちは、JS2IIUです。無事7日目の更新ができそうでホッとしています。今回もよろしくお願いします。

はじめに

第7回目の今回は、Streamlitアプリケーションにおける認証とセキュリティについて解説します。アプリケーションがユーザーに公開されると、認証や機密情報の管理が重要になります。この記事では、シンプルなログインフォームの実装方法や、OAuthを利用した認証の導入、さらにAPIキーなどの機密情報を安全に管理する方法を具体的なコード例とともに紹介します。

認証機能の実装

シンプルなログインフォームの作成

Streamlitを使ってシンプルなログインフォームを作成し、ユーザー認証を行う方法を紹介します。以下のコードは、ユーザー名とパスワードを入力して認証する基本的な例です。

import streamlit as st

# ダミーユーザー情報（実際にはデータベースなどで管理）
USER_CREDENTIALS = {"user1": "password1", "user2": "password2"}

# ログインフォームの作成
st.title("ログイン")

username = st.text_input("ユーザー名")
password = st.text_input("パスワード", type="password")
login_button = st.button("ログイン")

# 認証処理
if login_button:
    if USER_CREDENTIALS.get(username) == password:
        st.success(f"ようこそ、{username}さん！")
    else:
        st.error("ユーザー名またはパスワードが間違っています")

このコードでは、ユーザー名とパスワードを入力して「ログイン」ボタンを押すと、事前に定義されたユーザー情報と照合し、認証が成功すれば歓迎メッセージを表示します。

OAuthを利用した認証

OAuthは、GoogleやGitHubなどの外部サービスを利用した認証を可能にするプロトコルです。StreamlitでOAuth認証を導入するには、streamlit-oauthやauthlibといったライブラリを利用します。以下はGoogle OAuthを利用した認証の簡単な例です。

import streamlit as st
from authlib.integrations.requests_client import OAuth2Session

# OAuth 2.0 クライアントの設定
client_id = "YOUR_CLIENT_ID"
client_secret = "YOUR_CLIENT_SECRET"
authorization_endpoint = "https://accounts.google.com/o/oauth2/auth"
token_endpoint = "https://accounts.google.com/o/oauth2/token"
redirect_uri = "http://localhost:8501/"

# OAuth 2.0 セッションの開始
client = OAuth2Session(client_id, client_secret, redirect_uri=redirect_uri)
authorization_url, state = client.create_authorization_url(authorization_endpoint)

# 認証ボタンの表示
st.write(f"[Googleでログイン]({authorization_url})")

# リダイレクト後の処理
if "code" in st.experimental_get_query_params():
    code = st.experimental_get_query_params()["code"]
    token = client.fetch_token(token_endpoint, authorization_response=st.experimental_get_query_params())
    st.success("認証に成功しました！")

このコードでは、Googleアカウントを使ってユーザー認証を行います。client_idとclient_secretは、Google API Consoleでアプリを登録する際に取得します。このままではうまく動作しませんが、概要を示すコードということで参考にしていただければと思います。

Google OAuthについてはこちらのページを参照してください。

OAuth 2.0 を使用して Google API にアクセスする  |  Authorization  |  Google for Developers
developers.google.com

さらにこちらのページも大変参考になります。

Google認証とOAuth2.0で、Googleサービスと連携する例のアレを作る
zenn.dev

APIキーの管理

アプリケーションが外部APIを使用する場合、APIキーやその他の機密情報を適切に管理することが重要です。Streamlitでは、環境変数やStreamlit Secretsを使ってこれらの情報を安全に管理できます。

環境変数の使用

環境変数を使ってAPIキーを管理する方法はシンプルで、セキュリティ面でも推奨される方法です。以下の例では、osモジュールを使って環境変数からAPIキーを取得しています。

import os
import streamlit as st
import requests

API_KEY = os.getenv("API_KEY")

if not API_KEY:
    st.error("APIキーが設定されていません")
else:
    # APIを使ったリクエストの例
    response = requests.get(f"https://api.example.com/data?key={API_KEY}")
    st.write(response.json())

この場合、API_KEYはシステムの環境変数として設定されている必要があります。恒久的に設定しておきたい場合は~/.bash_profileにexport API_KEY="あなたのAPIキー"と入力、保存してからsource ~/.bash_profileを実行します。一時的に設定するだけでよければ、ターミナルでexport API_KEY="あなたのAPIキー"を実行してください。

Streamlit Secretsの使用

Streamlitでは、secrets.tomlファイルを使って機密情報を管理する方法もあります。このファイルはアプリケーション内で簡単にアクセスでき、デプロイ時にも安全に取り扱うことができます。なお、このsecrets.tomlを保存する場所ですが、ローカルスコープで利用したい場合はstreamlit runを実行しているフォルダと同じ階層に.streamlit/secrets.tomlを作成してください。config.tomlを保存したのと同じ場所です。

secrets.tomlの例:

[api_keys]
google = "YOUR_GOOGLE_API_KEY"
openai = "YOUR_OPENAI_API_KEY"

これをStreamlitアプリ内で使用する方法:

import streamlit as st

google_api_key = st.secrets["api_keys"]["google"]
openai_api_key = st.secrets["api_keys"]["openai"]

st.write("Google API Key:", google_api_key)
st.write("OpenAI API Key:", openai_api_key)

secrets.tomlはグローバルスコープで適用させたい場合、~/.streamlit/ディレクトリに配置します。また、デプロイ時にはStreamlit Cloudのシークレット管理機能を使用して設定します。

こちらのページが参考になります。

Streamlit Sharingでシークレット情報を扱う - Qiita
StreamlitでAppを作成する際、DBのパスワードやAPI Keyなどのシークレット情報がアクセスに必要になることが多々あります。 今回、AzureのAPIキーをStreamlit Sharingで使いたかったので、StreamlitのSecrets管理機能を試し...
qiita.com

まとめ

第7回目では、Streamlitアプリにおける認証とセキュリティについて解説しました。シンプルなログインフォームやOAuthを利用した認証機能の実装、さらにAPIキーなどの機密情報を安全に管理する方法について学びました。これにより、アプリケーションを公開する際に、セキュリティを強化し、ユーザーの信頼を得ることができます。

次回は、Streamlitアプリとデータベースとの連携について学びます。SQLiteやPostgreSQLとの接続方法や、ORMを使ったデータベース操作について詳しく解説しますので、お楽しみに！

最後まで読んでいただきありがとうございました。73

補足：Streamlit応用編　記事リスト

Streamlit応用編 第1回: キャッシュ機能の活用
https://js2iiu.com/2024/08/28/streamlit-01-cache/

Streamlit応用編 第2回: インタラクティブなウィジェットの応用
https://js2iiu.com/2024/08/29/streamlit-02-widget/

Streamlit応用編 第3回: データのアップロードとダウンロード
https://js2iiu.com/2024/08/29/streamlit-03-download/

Streamlit応用編 第4回: レイアウトのカスタマイズ
https://js2iiu.com/2024/08/30/streamlit-04-layout/

Streamlit応用編 第5回: テーマのカスタマイズ
https://js2iiu.com/2024/08/31/streamlit-05-theme-custom/

Streamlit応用編 第6回: デプロイと共有
https://js2iiu.com/2024/09/01/streamlit-06-deploy/

Streamlit応用編 第7回: 認証とセキュリティ
https://js2iiu.com/2024/09/02/streamlit-07-security/

Streamlit応用編 第8回: データベースとの連携
https://js2iiu.com/2024/09/02/streamlit-08-database/

Streamlit応用編 第9回: 複雑なデータビジュアライゼーション
https://js2iiu.com/2024/09/05/streamlit-09-visualization/

Streamlit応用編 第10回: マルチページアプリの作成
https://js2iiu.com/2024/09/06/streamlit-10-multipage/

Streamlit応用編 第11回: StreamlitでAPIを作成する方法
https://js2iiu.com/2024/09/07/streamlit-11-api/

モバイルバージョンを終了