Templates¶

AI coding agents

Use the official FastAPI skill for your installed version. Install it from your project directory:

uvx library-skills

See Develop with AI.

🌐 एआई और मनुष्यों द्वारा किया गया अनुवाद

यह अनुवाद मनुष्यों के मार्गदर्शन में एआई द्वारा किया गया है। 🤝

इसमें मूल अर्थ को गलत समझने या अप्राकृतिक लगने आदि जैसी गलतियाँ हो सकती हैं। 🤖

आप हमें एआई LLM को बेहतर मार्गदर्शन करने में मदद करके इस अनुवाद को बेहतर बना सकते हैं।

अंग्रेज़ी संस्करण

आप FastAPI के साथ अपनी पसंद का कोई भी template engine उपयोग कर सकते हैं।

एक आम विकल्प Jinja2 है, वही जिसे Flask और अन्य tools उपयोग करते हैं।

इसे आसानी से configure करने के लिए utilities उपलब्ध हैं जिन्हें आप सीधे अपने FastAPI application में उपयोग कर सकते हैं (Starlette द्वारा प्रदान की गई)।

Dependencies install करें¶

अपने project में jinja2 जोड़ें:

$ uv add jinja2

---> 100%

`Jinja2Templates` का उपयोग करना¶

Jinja2Templates import करें।
एक templates object बनाएँ जिसे आप बाद में फिर से उपयोग कर सकें।
उस path operation में एक Request parameter declare करें जो एक template return करेगा।
आपने जो templates बनाया है, उसका उपयोग करके एक TemplateResponse render और return करें; template का नाम, request object, और key-value pairs वाली एक "context" dictionary pass करें, जिनका उपयोग Jinja2 template के अंदर किया जाएगा।

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}
    )

नोट

FastAPI 0.108.0, Starlette 0.29.0 से पहले, name पहला parameter था।

साथ ही, उससे पहले के versions में, request object को Jinja2 के context में key-value pairs के हिस्से के रूप में pass किया जाता था।

सुझाव

response_class=HTMLResponse declare करने से docs UI यह जान पाएगा कि response HTML होगा।

तकनीकी विवरण

आप from starlette.templating import Jinja2Templates भी उपयोग कर सकते हैं।

FastAPI आपकी सुविधा के लिए, developer के रूप में, वही starlette.templating fastapi.templating के रूप में प्रदान करता है। लेकिन उपलब्ध अधिकांश responses सीधे Starlette से आते हैं। Request और StaticFiles के साथ भी यही है।

Templates लिखना¶

फिर आप templates/item.html पर एक template लिख सकते हैं, उदाहरण के लिए:

<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>

Template Context Values¶

उस HTML में जिसमें यह शामिल है:

Item ID: {{ id }}

...यह आपके द्वारा pass किए गए "context" dict से लिया गया id दिखाएगा:

{"id": id}

उदाहरण के लिए, 42 की ID के साथ, यह render होगा:

Item ID: 42

Template `url_for` Arguments¶

आप template के अंदर url_for() का भी उपयोग कर सकते हैं, यह arguments के रूप में वही arguments लेता है जो आपके path operation function द्वारा उपयोग किए जाते।

इसलिए, इस section के साथ:

<a href="{{ url_for('read_item', id=id) }}">

...यह उसी URL का link generate करेगा जिसे path operation function read_item(id=id) handle करेगा।

url_for() वर्तमान request के आधार पर scheme और host सहित एक absolute URL return करता है।

उदाहरण के लिए, यदि आपका application https://example.com पर serve किया जाता है, तो 42 की ID के साथ, यह render होगा:

<a href="https://example.com/items/42">

Templates में URL paths¶

उसी साइट के links के लिए, आप केवल URL path प्राप्त करने के लिए .path attribute का उपयोग कर सकते हैं, उदाहरण के लिए, templates/item_path.html में:

<html>
<head>
    <title>Item Details</title>
    <link href="{{ url_for('static', path='/styles.css').path }}" rel="stylesheet">
</head>
<body>
    <h1><a href="{{ url_for('read_item', id=id).path }}">Item ID: {{ id }}</a></h1>
</body>
</html>

Template का नाम TemplateResponse को pass करें:

# Code above omitted 👆

@app.get("/items/{id}", response_class=HTMLResponse)
async def read_item(request: Request, id: str):
    return templates.TemplateResponse(
        request=request, name="item_path.html", context={"id": id}
    )

👀 Full file preview

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_path.html", context={"id": id}
    )

उसी उदाहरण में, item का link इस तरह render होगा:

<a href="/items/42">

शुरुआती / इस path को वर्तमान साइट के root के सापेक्ष बनाता है।

.path attribute में scheme, host, query parameters और fragment शामिल नहीं होते। किसी अन्य host के links के लिए पूरे URL का उपयोग करें।

सुझाव

यदि आपका application किसी proxy के पीछे है, तो Proxy के पीछे में बताए अनुसार forwarded headers और root_path configure करें।

Templates और static files¶

आप template के अंदर url_for() का भी उपयोग कर सकते हैं, और इसे, उदाहरण के लिए, उन StaticFiles के साथ उपयोग कर सकते हैं जिन्हें आपने name="static" के साथ mount किया है।

<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 file से link करेगा:

h1 {
    color: green;
}

और क्योंकि आप StaticFiles उपयोग कर रहे हैं, वह CSS file आपके FastAPI application द्वारा URL /static/styles.css पर automatic रूप से serve की जाएगी।

अधिक विवरण¶

अधिक विवरण के लिए, जिसमें templates को test करना भी शामिल है, templates पर Starlette के docs देखें।