プログラミング

Flaskでのページネーション実装

最終更新： 26/03/2025
1 分の読み

FlaskとSQLAlchemyを使用したPagination（ページネーション）の実装方法について、詳細に解説します。Paginationは、データベースの大量のデータを扱う際に、1ページあたりに表示するアイテム数を制限し、ユーザーがページを切り替えてデータを確認できるようにするために使用されます。これにより、ウェブアプリケーションが大規模なデータセットでも効率的に動作するようになります。

FlaskとSQLAlchemyでのPaginationの基本概念

Flaskは軽量なPythonのWebフレームワークで、SQLAlchemyはPythonのORM（オブジェクトリレーショナルマッピング）ライブラリです。これらを組み合わせることで、Flaskアプリケーションにデータベースアクセスを簡単に組み込むことができます。

関連記事

Paginationは主に以下の2つの操作を含みます：

  1. データベースから必要なデータを取得すること（例えば、1ページに表示するアイテム数に基づいてデータを制限する）

  2. 次のページ、前のページ、または特定のページへのリンクを生成すること（ページ番号や「次へ」「前へ」ボタンを表示する）

Flaskアプリケーションの設定

まず、FlaskとSQLAlchemyをインストールし、基本的な設定を行います。

bash
pip install flask flask-sqlalchemy

次に、Flaskアプリケーションの基本的な構成を作成します。

python
from flask import Flask, render_template
from flask_sqlalchemy import SQLAlchemy

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///example.db'
app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False

db = SQLAlchemy(app)

class Item(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(50), nullable=False)

    def __repr__(self):
        return f'{self.name}>'

上記のコードでは、Itemというモデルを作成し、その中にid（主キー）とname（アイテム名）という2つのフィールドを定義しています。

Paginationの実装

次に、ページネーションを実装します。paginate()メソッドを使用することで、データベースから必要なページのデータを取得できます。

python
@app.route('/items')
def items():
    page = request.args.get('page', 1, type=int)  # URLクエリパラメータからページ番号を取得
    per_page = 10  # 1ページに表示するアイテム数

    items = Item.query.paginate(page, per_page, False)  # ページネーションを適用
    return render_template('items.html', items=items)

このコードでは、request.args.get('page', 1, type=int)でURLのクエリパラメータからページ番号を取得し、paginate()メソッドでそのページに表示するデータを取得しています。per_pageは1ページに表示するアイテム数を指定します。

paginate()メソッドの引数は以下のように設定できます：

  • page: 現在のページ番号

  • per_page: 1ページに表示するアイテム数

  • error_out: Falseに設定すると、存在しないページにアクセスした場合にエラーを発生させません。

Paginationの結果の表示

次に、テンプレート（items.html）で、取得したページネーションの結果を表示します。

html
html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>Itemstitle>
head>
<body>
    <h1>Items Listh1>

    <ul>
        {% for item in items.items %}
            <li>{{ item.name }}li>
        {% endfor %}
    ul>

    <div>
        {% if items.has_prev %}
            <a href="{{ url_for('items', page=items.prev_num) }}">Previousa>
        {% endif %}
        
        <span>Page {{ items.page }} of {{ items.pages }}span>
        
        {% if items.has_next %}
            <a href="{{ url_for('items', page=items.next_num) }}">Nexta>
        {% endif %}
    div>
body>
html>

説明：

  • items.items: 現在のページのアイテムリスト

  • items.has_prev: 前のページがあるかどうか

  • items.has_next: 次のページがあるかどうか

  • items.prev_num: 前のページのページ番号

  • items.next_num: 次のページのページ番号

  • items.page: 現在のページ番号

  • items.pages: 総ページ数

このテンプレートでは、PreviousボタンとNextボタンを表示し、現在のページと総ページ数も表示します。

動作確認

Flaskアプリケーションを実行して、ブラウザで/itemsにアクセスすると、ページネーションされたアイテムリストが表示されます。ページを切り替えながら、データが適切に表示されることを確認してください。

bash
flask run

これで、FlaskとSQLAlchemyを使用してページネーションを実装する基本的な方法が完了しました。

高度なカスタマイズ

  1. 検索機能の追加:
    検索機能を追加することで、ユーザーがアイテムを検索しながらページネーションを利用できるようになります。例えば、検索キーワードを取得し、検索結果に基づいてページネーションを適用することができます。

    python
    @app.route('/items', methods=['GET', 'POST'])
def items():
    page = request.args.get('page', 1, type=int)
    per_page = 10
    search_query = request.args.get('search', '')

    items = Item.query.filter(Item.name.contains(search_query)).paginate(page, per_page, False)
    return render_template('items.html', items=items, search_query=search_query)

  2. ページネーションのスタイリング:
    BootstrapやCSSを使用して、ページネーションのリンクをスタイリングできます。例えば、以下のようにBootstrapを利用することで、見た目を向上させることができます。

    html
    <nav aria-label="Page navigation">
    <ul class="pagination">
        {% if items.has_prev %}
            <li class="page-item"><a class="page-link" href="{{ url_for('items', page=items.prev_num) }}">Previousa>li>
        {% endif %}

        <li class="page-item disabled"><span class="page-link">Page {{ items.page }} of {{ items.pages }}span>li>

        {% if items.has_next %}
            <li class="page-item"><a class="page-link" href="{{ url_for('items', page=items.next_num) }}">Nexta>li>
        {% endif %}
    ul>
nav>

結論

FlaskとSQLAlchemyを使ったページネーションの実装は、非常にシンプルで強力です。paginate()メソッドを使うことで、簡単に大量のデータを効率よく表示できるようになります。必要に応じて、検索機能やスタイリングを追加して、ユーザーにとって使いやすいインターフェースを提供しましょう。

最終更新： 26/03/2025
1 分の読み
Back to top button