【Streamlit】st.switch_page 徹底解説:モダンなマルチページアプリの構築

Streamlit
この記事は約15分で読めます。

こんにちは、JS2IIUです。
Pythonを用いたWebアプリケーション開発において、Streamlitは不動の地位を築いています。データサイエンティストやAIエンジニアにとって、複雑なセットアップなしに数行のコードでダッシュボードを構築できる点は最大の魅力です。しかし、アプリケーションが大規模になるにつれ、単一のページでは情報が整理しきれなくなることがあります。

そこで重要になるのが「マルチページ構成」です。Streamlitでは、サイドバーから手動でページを切り替えるだけでなく、プログラム内のロジックに基づいて動的にページを遷移させる st.switch_page という関数が提供されています。

2025年後半から2026年にかけてのアップデートにより、Streamlitのページ管理システムは大きく進化しました。本記事では、基本的な st.switch_page の使い方はもちろん、バージョン 1.52.0 で追加された「st.Page オブジェクトの直接指定」という強力な新機能に焦点を当て、その実装方法を詳しく解説します。今回もよろしくお願いします。

1. st.switch_page の基本概念

st.switch_page は、その名の通り、アプリケーションの実行中にプログラムから別のページへ強制的に遷移させるための関数です。例えば、「ログインに成功した後にダッシュボードへ移動する」「学習開始ボタンを押した後にモニタリングページへ移動する」といったワークフローを実現する際に不可欠です。

これまでのバージョン(1.51.0以前)では、遷移先の指定は「ファイルパスの文字列」で行うのが一般的でした。

Python
import streamlit as st

st.title("メインメニュー")

if st.button("モデルの学習を開始する"):
    # pages/training.py へ遷移する
    st.switch_page("pages/training.py")

この方法は直感的ですが、ファイル名を変更した際にリンク切れが発生しやすく、特に大規模なプロジェクトでは管理が煩雑になるという課題がありました。

2. バージョン 1.52.0 の主な変更点:st.Page オブジェクトのサポート

最新の Streamlit (1.52.0) では、st.switch_page が大きく強化されました。最大の違いは、遷移先として文字列のパスだけでなく、st.Page オブジェクトを直接渡せるようになったことです。

これは、同じく最近導入された st.navigation APIとの親和性を極限まで高めるアップデートです。st.Page オブジェクトを変数として保持しておくことで、ファイルパスをハードコードすることなく、オブジェクト参照による安全かつ柔軟なページ遷移が可能になりました。

1.51.0 と 1.52.0 の違い

  • 1.51.0: 引数は page: str(ファイルパスのみ)。
  • 1.52.0: 引数が page: str | st.Page に拡張。st.navigation で定義したページオブジェクトをそのまま利用可能。

この変更により、タイポによるエラーを防げるだけでなく、エディタの補完機能を活用したスマートな開発が可能になります。

3. 実践:st.Page を活用したマルチページ・AIアプリの実装

それでは、具体的なコードを見ていきましょう。ここでは、PyTorchを用いた簡易的な画像分類モデルの学習フローを想定したアプリケーションを作成します。

構造としては、以下の3つのページで構成します。

  1. Home: アプリの概要説明。
  2. Training: 学習パラメータの設定と実行。
  3. Results: 学習結果の可視化。

まずは、メインとなる app.py(エントリポイント)の構成です。

Python
import streamlit as st

# 各ページの設定を st.Page オブジェクトとして定義
# これにより、ファイルパスを一箇所で管理できる
home_page = st.Page("views/home.py", title="ホーム", icon="🏠")
train_page = st.Page("views/training.py", title="モデル学習", icon="🧪")
result_page = st.Page("views/学習結果", title="結果確認", icon="📊")

# st.navigation にページリストを渡す
# ここで定義したオブジェクトを、後で st.switch_page に利用する
pg = st.navigation([home_page, train_page, result_page])

# セッション状態にページオブジェクトを保存しておくと、
# 他のファイルからも参照しやすくなる
st.session_state.pages = {
    "home": home_page,
    "train": train_page,
    "result": result_page
}

# 共通のサイドバー設定やナビゲーションの実行
pg.run()

次に、views/training.py の内容を実装します。ここでは PyTorch を用いた計算をシミュレートし、完了後に st.switch_page を使って結果ページへ自動遷移させます。

Python
import streamlit as st
import torch
import torch.nn as nn
import time

st.title("モデル学習セクション")
st.write("ニューラルネットワークの学習パラメータを設定してください。")

# シンプルなネットワーク定義(PyTorch)
class SimpleNet(nn.Module):
    def __init__(self):
        super(SimpleNet, self).__init__()
        self.fc = nn.Linear(10, 1)

    def forward(self, x):
        return self.fc(x)

# ユーザー入力
learning_rate = st.slider("学習率", 0.001, 0.1, 0.01)
epochs = st.number_input("エポック数", min_value=1, max_value=100, value=10)

if st.button("学習を開始する"):
    # 学習のシミュレーション
    progress_bar = st.progress(0)
    status_text = st.empty()

    model = SimpleNet()
    criterion = nn.MSELoss()
    optimizer = torch.optim.SGD(model.parameters(), lr=learning_rate)

    for epoch in range(epochs):
        # ダミーデータの生成と学習ステップ
        inputs = torch.randn(64, 10)
        targets = torch.randn(64, 1)

        optimizer.zero_grad()
        outputs = model(inputs)
        loss = criterion(outputs, targets)
        loss.backward()
        optimizer.step()

        # 進捗の更新
        progress = (epoch + 1) / epochs
        progress_bar.progress(progress)
        status_text.text(f"Epoch {epoch+1}/{epochs} - Loss: {loss.item():.4f}")
        time.sleep(0.1)

    st.success("学習が完了しました!結果ページへ移動します。")
    time.sleep(1)

    # 【重要】1.52.0 の新機能:st.Page オブジェクトを直接指定して遷移
    # 以前のように "views/result.py" という文字列を書かなくて良い
    st.switch_page(st.session_state.pages["result"])

このコードのポイントは、st.switch_page の引数に st.session_state.pages["result"] という st.Page オブジェクトを渡している点です。もしファイル構成が変わっても、app.py の定義を修正するだけで、各ページ内の遷移ロジックを書き換える必要がありません。

4. 直感的な理解を助ける概念解説

st.switch_page の動作を、現実世界の「ホテルのコンシェルジュ」に例えてみましょう。

以前の方式(文字列による指定)は、コンシェルジュに「2階の東側にある205号室へ連れて行ってください」と住所で指示するようなものでした。もし部屋の番号が変わったり、改装で場所が移動したりすると、指示が通らなくなってしまいます。

一方、1.52.0 以降の st.Page オブジェクトによる指定は、「『レストラン』へ連れて行ってください」と、その役割(オブジェクト)を指定するようなものです。レストランが何階にあろうと、コンシェルジュ(Streamlit)はその実体を知っているため、迷わず案内してくれます。

この抽象化により、開発者は「どこにあるか」ではなく「どこへ行きたいか」という意図に集中できるようになります。

5. 高度な応用:状態管理と遷移の組み合わせ

マルチページアプリにおいて、遷移前後の状態(State)の維持は非常に重要です。例えば、学習済みモデルの重みを結果ページに引き継ぎたい場合、st.session_state を活用します。

学習ページで計算された損失関数の推移 \( L = \{l_1, l_2, \dots, l_n\} \) を、遷移後のページでグラフ表示する例を考えてみましょう。

Python
# training.py 内
loss_history = [0.5, 0.4, 0.35, 0.28] # シミュレーション値
st.session_state.last_loss_history = loss_history

# 遷移
st.switch_page(st.session_state.pages["result"])

遷移先の results.py では、以下のようにデータを取得します。

Python
# results.py 内
import streamlit as st
import matplotlib.pyplot as plt

st.title("学習結果分析")

if "last_loss_history" in st.session_state:
    history = st.session_state.last_loss_history

    fig, ax = plt.subplots()
    ax.plot(history)
    ax.set_title("Loss Curve")
    ax.set_xlabel("Epoch")
    ax.set_ylabel("Loss")

    st.pyplot(fig)

    final_loss = history[-1]
    st.metric("最終 Loss", f"{final_loss:.4f}")
else:
    st.warning("学習データが見つかりません。学習ページから実行してください。")
    if st.button("学習ページへ戻る"):
        st.switch_page(st.session_state.pages["train"])

このように、st.switch_pagest.session_state を組み合わせることで、ユーザー体験を損なうことなく、ページを跨いだ複雑なAIアプリケーションを構築できます。

6. 注意点とベストプラクティス

st.switch_page を使用する際には、いくつか留意すべき点があります。

  1. 実行のタイミング: st.switch_page が呼び出されると、その時点で現在のスクリプトの実行は停止し、即座に新しいページがロードされます。そのため、遷移前に行いたい処理(データの保存など)は必ず関数の呼び出し前に記述してください。
  2. パスの整合性: st.Page オブジェクトを使わない従来の方法(文字列指定)の場合、パスは常に「アプリのメインエントリポイントからの相対パス」である必要があります。
  3. 無限ループの回避: 条件分岐が不適切だと、ページAとページBの間で無限に遷移し続けてしまう可能性があります。遷移条件(例:ボタン押下、特定の変数の更新)を明確に定義しましょう。

特にバージョン 1.52.0 を利用できる環境であれば、文字列指定よりも st.Page オブジェクトの使用を強く推奨します。コードの堅牢性が飛躍的に高まります。

まとめ

Streamlit 1.52.0 における st.switch_page のアップデートは、一見小さな変更に見えますが、モダンなマルチページアプリを開発する上では非常に大きな意味を持ちます。

  • 型安全性の向上: st.Page オブジェクトを扱うことで、パスの記述ミスを排除できる。
  • 構造の整理: st.navigation と組み合わせることで、アプリ全体の構成を一つのファイルで集中管理できる。
  • 柔軟な動的遷移: プログラムの計算結果やユーザーの状態に応じて、最適なページへスマートに誘導できる。

機械学習モデルのデモサイトや、社内向けのデータ分析ツールなど、遷移ロジックが複雑になりがちなシーンで、この新機能は間違いなく威力を発揮します。ぜひ、最新の Streamlit をインストールして、洗練されたマルチページアプリ開発に挑戦してみてください。

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

コメント

タイトルとURLをコピーしました