A Jinja sablonok hatékony nyelvet kínálnak, amellyel könnyedén hozhat létre dinamikus weboldalakat.

A Jinja és a FastAPI integrálása lehetővé teszi dinamikus weboldalak létrehozását, amelyek zökkenőmentesen keverik a Pythont kódot HTML-lel, lehetővé téve az alkalmazás megjelenítési rétegének elkülönítését a logikától réteg. A dinamikus weboldalakkal személyre szabott és adatvezérelt tartalmat hozhat létre, javítva a felhasználói élményt.

Mi az a Jinja?

A Jinja egy robusztus, funkciókban gazdag Python sablonmotor, amely dinamikus weboldalakat hoz létre. A Jinja Templating támogatja az öröklődést, a feltételes utasításokat, a ciklusokat és a dinamikus weboldalak létrehozását leegyszerűsítő szolgáltatásokat.

A FastAPI és a Jinja kombinálásával olyan következetes elrendezésű weboldalakat hozhat létre, amelyek valós idejű adatokat jelenítenek meg és kezelik a felhasználói bevitelt. Azt is elérheti az aggodalmak szétválasztása, így a kód karbantarthatóbbá és könnyebben érthetőbbé válik.

FastAPI projekt beállítása

instagram viewer

A kezdéshez be kell állítania egy FastAPI projektet.

  1. Virtuális környezet létrehozása és aktiválása a következő terminálparancsok használatával:
    python -m venv env
    # Unix/MacOS rendszeren: 
    forrás venv/bin/activate
    # Windows rendszeren:
    .\venv\Scripts\activate
  2. Telepítse a FastAPI-t és a szükséges függőségeket.
    pip install "fastapi[all]"
  3. Hozzon létre egy projektkönyvtárat a blogom.
  4. Hozzon létre egy Python fájlt main.py projektkönyvtárában.
  5. Adja hozzá a következő kódot a main.py fájl:
    tól től fastapi import FastAPI
    fake_posts_db = [{
    'cím': "Első blogbejegyzés",
    'tartalom': "Az első blogbejegyzés tartalma.",
    'szerző': 'Gipsz Jakab',
    'publication_date': '2023-06-20',
    'Hozzászólások': [
     {'szerző': "Alice", 'tartalom': 'Remek poszt!'},
     {'szerző': "Bob", 'tartalom': 'Érdekes olvasmány.'}
     ],
    'állapot': 'közzétett'
    },{
    'cím': "Második blogbejegyzés",
    'tartalom': "A második blogbejegyzés tartalma.",
    'szerző': "Jane Smith",
    'publication_date': Egyik sem,
    'Hozzászólások': [],
    'állapot': 'tervezet'
    }]
    

    alkalmazás = FastAPI()
    @app.get("/about")
    defról ről():
    Visszatérés"Minden, amit a Simple Blogról tudnod kell"
    A fenti kód egy egyszerű FastAPI-alkalmazást hoz létre egyetlen végponttal, amely JSON-választ ad vissza, ha a megfelelő URL-címen keresztül éri el. tudsz használjon Python szótárt így egy tényleges adatbázis helyett; segít csökkenteni a komplexitást, miközben az elsődleges célra összpontosít.
  6. Futtassa a szervert.
    uvicorn main: app --reload

Látogatás http://localhost: 8000/kb böngészőjében a szerver válaszának megtekintéséhez.

A Jinja sablonok integrálása

Miután sikeresen beállította projektjét, most hozzáadhat Jinja sablont.

  1. Ban,-ben main.py fájlba, importálja a következő modulokat:
    tól től fastapi.sablon import Jinja2Templates
    tól től fastapi.staticfiles import StaticFiles
  2. Valami alatt kb változó, hozzon létre egy példányt a Jinja2Templates osztályt, és adja át a sablonokat tartalmazó könyvtárat.
    templates = Jinja2Templates (könyvtár="sablonok")
  3. Azután sablonokat változó, adja hozzá a következő kódsort:
    app.mount("/statikus", StaticFiles (könyvtár="statikus"), név="statikus")
    A fenti kód rögzíti a statikus könyvtárat, és utasítja a FastAPI-t, hogy kiszolgálja a könyvtárban található statikus fájlokat, amikor a kérés URL-címe /static.
  4. Ban ben a blogom könyvtár hozzon létre két könyvtárat, sablonokat HTML fájlok tárolására és statikus amely az összes statikus fájlt tartalmazza majd.

Ezen lépések végrehajtásával sikeresen integrálta a Jinja Templating programot a projektjébe.

Dinamikus weboldal készítése Jinja segítségével

A Jinja gazdag szintaxist és funkciókat kínál dinamikus sablonok létrehozásához.

Ebben a részben megtudhatja, hogyan használhatja a Jinja sablonszintaxist dinamikus weboldalak létrehozásához.

A sabloncímkéket a-val zárja be kapcsos zárójel és százalék szimbólum mindkét oldalon. Az ilyen címkék segítségével vezérlési folyamatot és logikai műveleteket hajthat végre a sablonban. Néhány gyakran használt sabloncímke:

  • Feltétel: Futtatja a kódblokkot, ha a feltétel igaz.
    {% ha feltétel %}...{% endif %}
  • Hurok: Iterál egy iterálható elemet, és minden elemhez lefuttatja a kódblokkot.
    {% számára tétel ban ben iterálható %}...{% endfor %}
  • Tartalmazza: Egy másik sablont tartalmaz az aktuális sablonon belül.
    {% tartalmazza 'sablon_neve.html' %}
  • Blokk: Meghatároz egy blokkot, amelyet a gyermeksablonok örökléssel felülírhatnak.
    {% block_name %}...{% endblock %}
  • Kiterjeszt: Lehetővé teszi, hogy a gyermeksablon örökölje és kiterjessze a szülősablont.
    {% extend parent_temp.html %}

Ezek a címkék rugalmas és kifejező módot biztosítanak a dinamikus adatokon alapuló HTML-tartalom létrehozására és az alkalmazás logikájának szabályozására.

Sablon öröklődése

A Jinja Templating támogatja a sablonok öröklését. Ez lehetővé teszi egy alap (szülő) sablon meghatározását, közös elrendezéssel és szakaszokkal, amelyeket az alárendelt sablonok kiterjeszthetnek vagy felülírhatnak. Egy gyermeksablon használhatja a Kiterjeszt címkét a szülősablon örökléséhez és kiterjesztéséhez.

Hozzon létre egy base.html fájl a sablonokat könyvtárat a következő kóddal.

html>
<html>
<fej>
<cím>{% block title %}Egyszerű blog{% endblock %}cím>
fej>
<test>
<h1>{% block heading %}Egyszerű blog{% endblock %}h1>
 {% blokktartalom %}
 {% endblock %}
 {% include "footer.html" %}
test>
html>

Így van egy szülősablonja, amely tartalmazza az összes sablon közös kódját, lehetővé téve az utódsablon öröklését és igény szerinti kiterjesztését.

Ban,-ben sablonokat könyvtár létrehozása a lábléc.html fájl a következő kóddal.

<lábléc>
<p>© 2023-as egyszerű blog. Minden jog fenntartva.p>
<ahref="{{ url_for('about') }}">Ról rőla>
lábléc>

lábléc.html egy olyan sablon, amely a lábléc szakasz HTML-kódját tartalmazza. Több oldalon is felhasználhatja, ha belefoglalja az alapsablonba a Tartalmazza címke.

Ban,-ben sablonokat könyvtár létrehozása a blog.html fájl a következő kóddal.

{% kiterjeszti "base.html" %}
{% block title %}Egyszerű blog – Blogoldal{% endblock %}


{% block heading %}Egyszerű blog - Blogoldal{% endblock %}


{% blokktartalom %}
<h2>Bejegyzések teljes száma: {{ hozzászólások|hosszúsága }}h2>


 {% a bejegyzésekhez %}
<divosztály="posta">


 {% if post.status == 'közzétéve' %}
<h3>{{ postai cím }}h3>
<p>{{ post.content|csonkítás }}p>
<p>Közzététel dátuma: {{ post.publication_date }}p>


<h4>Hozzászólások:h4>
<ul>
 {% a hozzászóláshoz a post.commentsben %}
<liosztály="megjegyzés">{{ comment.author }}-: {{ comment.content }}li>
 {% endfor %}
ul>
 {% más %}
<p>Ez a bejegyzés még vázlat módban van.p>
 {% endif %}
div>
<hr>
 {% endfor %}
{% endblock %}

Ez a gyermeksablon innen örökli base.html használni a Kiterjeszt címke. Felülbírálja az alapsablonban meghatározott bizonyos blokkokat, hogy testreszabott tartalmat biztosítson a blogoldal számára. Tartalmazza a bejegyzések és a kapcsolódó megjegyzések megjelenítéséhez szükséges logikát és iterációt is.

Kifejezések

A Jinja kifejezések széles skáláját támogatja, beleértve az aritmetikai műveleteket, az összehasonlításokat és a logikai műveleteket. Például:

{{2 + 2}} // kimenet: 4

Változó helyettesítés

Ha változókat szeretne kiadni a sablonban, tegye őket dupla kapcsos zárójelek közé. Például:

{{post.title}} // output: "Első blogbejegyzés"

Szűrők

A szűrők módosítják egy változó kimenetét. A változó után hozzáadhat egyet a cső szimbólum (|) használatával. Például:

{{post|hosszúság}} // kimenet: 2

A sablonokhoz soron belüli és többsoros megjegyzéseket is hozzáadhat. A Jinja figyelmen kívül hagyja ezeket a megjegyzéseket a sablon megjelenítése során, így hasznosak lehetnek magyarázatok hozzáadásához a sablonon belül.

{# #} // Sorban
{% megjegyzés %}... {% end comment %} // többsoros

URL-ek

Az alkalmazáson belüli más oldalakra mutató megfelelő hiperhivatkozások létrehozásához a Jinja sablonkontextus tartalmazza a url_for funkció. Például:

<ahref="{{ url_for('about') }}">Ról rőla>

A fenti kód lesz http://localhost: 8000/kb. Azt is látni fogja, hogyan kell használni a url_for funkciót, hogy később statikus fájl elérési utat kapjon.

Ez csak néhány a Jinja Templating szintaxis alapvető szempontjai közül. A Jinja Templating számos további szolgáltatást és funkcionalitást biztosít, például makrókat, sablonkontextust és még sok mást, hogy a sablonok létrehozását és testreszabását hatékonyan és rugalmassá tegye.

Adatok továbbítása sablonokhoz

Most, hogy készen vannak a sablonok, át kell adnia a FastAPI-végpontjaiból származó adatokat a sablonokba a megjelenítéshez.

Adja hozzá a következő kódot a main.py fájl:

tól től fastapi import FastAPI, kérés
tól től fastapi.válaszokat import HTMLResponse
@app.get("/", response_class=HTMLResponse)
asyncdefread_posts(kérés: kérés):
Visszatérés sablonokat. TemplateResponse("blog.html", {"kérés": kérés, 
"bejegyzések": fake_posts_db})

A kód meghatároz egy FastAPI végpontot, amely kezeli a gyökér URL-hez ("/") küldött GET kérést, és visszaad egy HTMLResponse keletkezett a blog.html sablon. Átad egy kontextusszótárt, amely tartalmazza az aktuálisat kérési objektum és fake_posts_db, a sablonba. Így a Jinja pontos és dinamikus adatokat tud megjeleníteni.

Látogatás http://localhost: 8000/ a böngészőben, és valami ilyesmit kell látnia:

Sikeresen átadta az adatokat a sablonokba a megjelenítéshez.

Statikus fájlok kiszolgálása

A dinamikus sablonok megjelenítése mellett a FastAPI statikus fájlok, például CSS-fájlok, JavaScript-fájlok és képek kiszolgálására is alkalmas.

A CSS segítségével javíthatja az oldal megjelenését és hangulatát.

Ban,-ben statikus könyvtárat, hozzon létre a stílusok.css fájl a következő kóddal.

test {
betűtípus család: Arial, sans-serif;
árrés: 0;
párnázás: 20px;
háttérszín: #f5f5f5;
}
h1, h2, h3, h4 {
szín: #333;
}


.post {
háttérszín: #fff;
párnázás: 20px;
margó-alsó: 20px;
határ-sugár: 5px;
doboz-árnyék: 0 2px 4pxrgba(0, 0, 0, 0.1);
}


.posth3 {
margin-top: 0;
}


.postp {
margó-alsó: 10px;
}


.postul {
lista-stílusú: egyik sem;
padding-bal: 0;
}


.megjegyzés {
margó-alsó: 10px;
párnázás: 10px;
háttérszín: #f9f9f9;
határ-sugár: 5px;
}
lábléc {
háttérszín: #f2f2f2;
párnázás: 10px;
szöveg igazítás: központ;
}

Módosítsa a fej eleme a base.html sablon az alábbiak szerint:

<fej>
<cím>{% block title %}Egyszerű blog{% endblock %}cím>
<linkhref="{{ url_for('static', path='/styles.css') }}"rel="stíluslap">
fej>

Az url_for() függvény létrehoz egy URL-t (elérési utat) a stílusok.css (/static/styles.css) fájlt a statikus könyvtárat, amelyet ezután a FastAPI automatikusan kiszolgál.

Látogatás http://localhost: 8000/ a böngészőjében.

Ugyanezek az eljárások vonatkoznak a kép- és JavaScript-fájlok kiszolgálására is.

Ne felejtse el követni a legjobb gyakorlatokat

A FastAPI Jinja Templating használatával végzett munka során fontos bizonyos bevált gyakorlatok követése a jól szervezett és hatékony kódbázis biztosítása érdekében.

  • Rendszerezze a sablonokat egy dedikált könyvtárba, és fontolja meg alkönyvtárak használatát a kapcsolódó sablonokhoz.
  • Használja a sablon öröklődését, hogy újrafelhasználható alapsablonokat hozzon létre, és bővítse ki azokat adott tartalomra.
  • Gondosan válassza ki a sablonoknak továbbítandó adatokat, a hasznos teher könnyű súlyának megtartásával, és használjon kontextusfeldolgozókat vagy köztes szoftvert a gyakran használt adatokhoz.
  • Használja ki a Jinja Templating funkcióit, például makrókat, szűrőket és vezérlőstruktúrákat a kódok jobb újrafelhasználhatósága és olvashatósága érdekében.
  • Optimalizálja a teljesítményt azáltal, hogy gyorsítótárazási stratégiákat alkalmaz statikus sablonokhoz, HTTP-gyorsítótárazási fejléceket használ, és profilalkotást készít a teljesítmény szűk keresztmetszete miatt.

Ezen bevált gyakorlatok követésével fenntarthatja a strukturált projektet, optimalizálhatja a renderelési teljesítményt, és hatékonyan használhatja ki a Jinja Templating szolgáltatásait a FastAPI-alkalmazásokban.

FastAPI használata RestAPI-k létrehozásához

Eltekintve a megjelenítési sablonokat igénylő alkalmazások létrehozásától. A FastAPI kiváló teljesítményt, könnyen használható szintaxist, automatikus dokumentáció-generálást és méretezhetőséget biztosít a RestAPI-k létrehozásában. Ezek a funkciók ideálissá teszik a FastAPI-t robusztus webes API-k hatékony fejlesztéséhez.