テンプレート¶
FastAPI では、お好きなテンプレートエンジンを使用できます。
一般的な選択肢は、Flaskやその他のツールで使用されているものと同じ Jinja2 です。
FastAPI アプリケーションで直接使用できる(Starletteによって提供される)便利な設定ユーティリティがあります。
依存関係のインストール¶
仮想環境を作成し、それをアクティブにして jinja2 をインストールしてください
$ pip install jinja2
---> 100%
Jinja2Templates の使用¶
Jinja2Templatesをインポートします。- 後で再利用できる
templatesオブジェクトを作成します。 - テンプレートを返すパス操作で
Requestパラメータを宣言します。 - 作成した
templatesを使用してTemplateResponseをレンダリングして返し、テンプレートの名前、リクエストオブジェクト、および Jinja2 テンプレート内で使用するキーと値のペアを含む「コンテキスト」辞書を渡します。
from fastapi import FastAPI, Request
from fastapi.responses import HTMLResponse
from fastapi.staticfiles import StaticFiles
from fastapi.templating import Jinja2Templates
app = FastAPI()
app.mount("/static", StaticFiles(directory="static"), name="static")
templates = Jinja2Templates(directory="templates")
@app.get("/items/{id}", response_class=HTMLResponse)
async def read_item(request: Request, id: str):
return templates.TemplateResponse(
request=request, name="item.html", context={"id": id}
)
Note
FastAPI 0.108.0、Starlette 0.29.0 より前は、name が最初のパラメータでした。
また、それ以前のバージョンでは、request オブジェクトは Jinja2 のコンテキスト内のキーと値のペアの一部として渡されていました。
ヒント
response_class=HTMLResponse を宣言することで、ドキュメント UI はレスポンスが HTML であることを認識できるようになります。
技術的な詳細
from starlette.templating import Jinja2Templates を使用することもできます。
FastAPI は、開発者であるあなたにとって便利なように、starlette.templating と同じものを fastapi.templating として提供しています。しかし、利用可能なレスポンスのほとんどは Starlette から直接提供されています。Request や StaticFiles も同様です。
テンプレートの記述¶
次に、例えば templates/item.html にテンプレートを記述できます
<html>
<head>
<title>Item Details</title>
<link href="{{ url_for('static', path='/styles.css') }}" rel="stylesheet">
</head>
<body>
<h1><a href="{{ url_for('read_item', id=id) }}">Item ID: {{ id }}</a></h1>
</body>
</html>
テンプレートのコンテキスト値¶
HTML には以下が含まれています。
Item ID: {{ id }}
...渡した「コンテキスト」dict から取得した id が表示されます。
{"id": id}
例えば、ID が 42 の場合、これは以下のようにレンダリングされます。
Item ID: 42
テンプレートの url_for 引数¶
テンプレート内でも url_for() を使用できます。これは、パス操作関数が使用するのと同じ引数を取ります。
したがって、以下のセクションでは、
<a href="{{ url_for('read_item', id=id) }}">
... パス操作関数 read_item(id=id) によって処理されるのと同じ URL へのリンクが生成されます。
例えば、ID が 42 の場合、これは以下のようにレンダリングされます。
<a href="/items/42">
テンプレートと静的ファイル¶
テンプレート内で url_for() を使用し、例えば name="static" でマウントした StaticFiles と一緒に使用することもできます。
<html>
<head>
<title>Item Details</title>
<link href="{{ url_for('static', path='/styles.css') }}" rel="stylesheet">
</head>
<body>
<h1><a href="{{ url_for('read_item', id=id) }}">Item ID: {{ id }}</a></h1>
</body>
</html>
この例では、static/styles.css の CSS ファイルに以下のようにリンクします。
h1 {
color: green;
}
そして StaticFiles を使用しているため、その CSS ファイルは FastAPI アプリケーションによって URL /static/styles.css で自動的に提供されます。
詳細¶
テンプレートのテスト方法など、詳細については、Starlette のテンプレートに関するドキュメントをご確認ください。