Ha háttértechnológiát vagy keretrendszert (például Django, Laravel vagy Node.js) használ REST API-k írásához, akkor szüksége van hogy további frontend készségekkel rendelkezzen olyan keretrendszerek használatával, mint a React, Angular és Vue az API használatához végpontok. De ez nem mindig van így, a Django-sablonok segítségével magában a Django API-it is felhasználhatja.

Django projekt és API-végpontok beállítása

Az első lépés egy projektkönyvtár létrehozása lesz. Nyissa meg a terminált, és hozzon létre egy könyvtárat a projekthez.

mkdir payment_wallet_project
cd payment_wallet_project

Ebben az oktatóanyagban API-kat fog létrehozni egy fizetési pénztárcához.

A teljes forráskód elérhető a GitHub adattár.

Kezdje ezzel virtuális környezet létrehozása. Ebben az esetben a Pipenv könyvtárat fogja használni.

pipenv install django djangorestframework

Ez a parancs telepíti a szükséges könyvtárakat, valamint létrehoz egy virtuális környezetet.

Aktiválja a virtuális környezetet az alábbi paranccsal:

pipenv shell

Hozzon létre egy új Django projektet nevezett PayApp.

django-admin startproject PayApp .

A pont használata (.) végén django-admin parancs biztosítja, hogy a projekt ne hozzon létre duplikált könyvtárat a projektkönyvtárból.

Hozzon létre egy új Django alkalmazás a projektkönyvtárban.

python manage.py startapp wallet

Most folytassa az API-alkalmazás létrehozásával az alábbi lépésekkel.

Payment Wallet REST API létrehozása

Nyissa meg a wallet/models.py fájlt, és határozza meg a pénztárca és a tranzakciós modelleket.

from django.db import models
classWallet(models.Model):
 user = models.CharField(max_length=100)
 balance = models.DecimalField(max_digits=10, decimal_places=2)
 date_created = models.DateTimeField(auto_now_add=True)
 date_modified = models.DateTimeField(auto_now=True)
def__str__(self):
return self.user
classTransaction(models.Model):
 wallet = models.ForeignKey(Wallet, on_delete=models.CASCADE)
 amount = models.DecimalField(max_digits=10, decimal_places=2)
 timestamp = models.DateTimeField(auto_now_add=True)

Ban,-ben pénztárca könyvtárba, hozzon létre egy új fájlt serializers.py, és írja be a pénztárca és a tranzakciós modell sorosítóit.

from rest_framework import serializers
from .models import Wallet, Transaction
classWalletSerializer(serializers.ModelSerializer):
classMeta:
 model = Wallet
 fields = '__all__'
classTransactionSerializer(serializers.ModelSerializer):
classMeta:
 model = Transaction 
 fields = '__all__'

A szerializálók figyelembe veszik a pénztárca és tranzakciós modellek összes mezőjét.

Ban ben wallet/views.py, írja meg a nézeteket a pénztárca funkció megvalósításának logikájának kezelésére. Ez magában foglalja a befizetési és kifizetési lehetőségeket.

from rest_framework import generics, status
from rest_framework.response import Response
from rest_framework.decorators import action
from decimal import Decimal
from .models import Wallet, Transaction
from .serializers import WalletSerializer, TransactionSerializer
classWalletViewSet(viewsets.ModelViewSet):
 queryset = Wallet.objects.all()
 serializer_class = WalletSerializer
 @action(detail=True, methods=['post'])
defdeposit(self, request, pk=None):
 wallet = self.get_object()
 amount = Decimal(request.data['amount'])
 wallet.balance += amount
 wallet.save() 
 serializer = WalletSerializer(wallet)
return Response(serializer.data)

 @action(detail=True, methods=['post'])
defwithdraw(self, request, pk=None):
 wallet = self.get_object()
 amount = Decimal(request.data['amount'])
if wallet.balance < amount:
return Response({'error': 'Insufficient funds'},
 status=status.HTTP_400_BAD_REQUEST)
 wallet.balance -= amount
 wallet.save()
 serializer = WalletSerializer(wallet)
return Response(serializer.data)'
classTransactionViewSet(viewsets.ModelViewSet):
 queryset = Transaction.objects.all()
 Serializer_class = TransactionSerializer

Ezután határozza meg az API URL-útválasztását az a. létrehozásával wallet/urls.py fájl:

from django.urls import path, include
from rest_framework.routers import DefaultRouter
from .views import WalletViewSet, TransactionViewSet, wallet_view
router = DefaultRouter()
router.register(r'wallets', WalletViewSet, basename='wallets')
router.register(r'transactions', TransactionViewSet, basename='transactions')
urlpatterns = [
 path('api/', include(router.urls)),
 path('wallets//deposit/', WalletViewSet.as_view({'post': 'deposit'}),
 name='wallet-deposit'),
 path('wallets//withdraw/', WalletViewSet.as_view({'post': 'withdraw'}),
 name='wallet-withdraw'),
]

A projektedben urls.py, tartalmazza az alkalmazás URL-címeit:

from django.contrib import admin
from django.urls import path, include
urlpatterns = [
 path('admin/', admin.site.urls),
 path('', include('wallet.urls')),
]

Ban,-ben PayApp/settings.py fájlt, adja hozzá a pénztárca és rest_framwork alkalmazások hoz INSTALLED_APPS lista.

INSTALLED_APPS = [
"django.contrib.admin",
"django.contrib.auth",
"django.contrib.contenttypes",
"django.contrib.sessions",
"django.contrib.messages",
"django.contrib.staticfiles",
"rest_framework", # new
"wallet", # new
]

Ezzel regisztrálja a pénztárca és a rest_framework alkalmazásokat a Django projektalkalmazásba.

Az API használata Django sablonokkal

Mostantól a Django-sablonokat használhatja egy egyszerű frontend létrehozására az API használatához. Hozzon létre egy pénztárca.html fájl a pénztárca/sablonok/ könyvtárat, és adja hozzá az alábbi HTML-kódot.

"en">

"UTF-8">
"viewport" content="width=device-width, initial-scale=1">


"stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/
 css/bootstrap.min.css">



class="container">
Wallets

class="table">

















User
Balance
Actions






{{ wallet.user }}
"balance">{{ wallet.balance }}


"loading-indicator"class="d-none">

class="spinner-bordertext-primary" role="status">
class="sr-only">Loading...span>



Please wait while the deposit is being processed.




"deposit-form" method="post">
 {% csrf_token %}
"number" name="amount" step="0.01" min="0" required>
"submit"class="btnbtn-success">Depositbutton>



"post" id="withdraw-form">
 {% csrf_token %}
"number" name="amount" step="0.01" min="0" required>
"submit"class="btnbtn-danger">Withdrawbutton>

A HTML-fájl a befizetési és kifizetési API-kat egy gyönyörű, Bootstrap használatával tervezett felhasználói felületen jeleníti meg.

Felhasználói interakció az űrlapokkal

A HTML-fájlban hozzon létre egy szkriptcímkét, és adja hozzá a következő kódot a befizetési űrlap benyújtási eseményfigyelőjéhez.

Ezután adja hozzá az eseményfigyelőt az elállási űrlap benyújtásához az alábbi kóddal:

Az eseményfigyelő felelős a be- és kifizetés kezeléséért (#befizetési űrlap és #kivonási űrlap) űrlap benyújtása.

A lekérési kérelem URL-je a befizetési és kifizetési műveletek URL-címeinek egyezését szolgálja.

A befizetésekre és kifizetésekre vonatkozó JSON-válaszokat a rendszer ezután elemzi, hogy megkapja a frissített egyenleget (adatok.egyenleg). Ezután formázásra kerülnek és megjelennek az oldalon.

Következő, a wallet/views.py, adja hozzá a következő frissítést a wallet.html oldal megjelenítéséhez:

from django.shortcuts import render
defwallet_view(request):
# Retrieve the wallet to display
 wallet = Wallet.objects.first() 
return render(request, 'wallet.html', {'wallet': wallet})

Ebben a példában a első() lekérdezési módszer egyetlen felhasználó pénztárcájának kiválasztásához bemutató célból.

Frissítse a urls.py fájl elérési út hozzáadásával a wallet_view alábbiak szerint:

from .views import wallet_view
urlpatterns = [
 ...
 path('home/', wallet_view, name='wallet-page'),
]

A pénztárca oldalát a következő URL-ről érheti el: http://127.0.0.1:8000/home/.

Ha minden be van állítva és az elvárásoknak megfelelően működik, hajtsa végre a vándorlásokat tesznek és vándorol parancsokat. Végül futtassa az alkalmazást:

python manage.py makemigrations
python manage.py migrate
python manage.py runserver

Az API-végpontok eléréséhez navigáljon ide http://127.0.0.1:8000/api/.

Várható kimenet:

Navigáljon a helyi kiszolgáló interakcióba lépni a pénztárcával.

Várható kimenet:

A pénztárca mutatja az egyenleget, és lehetőséget ad befizetésre vagy kifizetésre.

A Django-sablonok és az API-felhasználásban betöltött szerepük megértése

Annak ellenére, hogy kiválóan alkalmas statikus tartalom megjelenítésére, a Django-sablonok bizonyos korlátozásokkal rendelkeznek az API-k használatakor:

• Korlátozott rugalmasság: A Django sablonok kevésbé rugalmasak, mint a Jinja2 vagy Twig segítségével létrehozott sablonok, mivel meghatározott struktúrák megjelenítésére használják őket. Például manuálisan kell elemeznie a JSON-t, és be kell illesztenie az adatokat a sablonba, ha olyan API-t kell használnia, amely JSON-adatokat adott vissza. Ez kihívást jelenthet, főleg akkor, ha az API bonyolult adatstruktúrákat biztosít.
• Nem támogatja az aszinkron kéréseket: A Django-sablonok natív módon nem képesek kezelni az aszinkron kéréseket. A sablonok továbbra is szinkron feldolgozásra szorulnak, annak ellenére, hogy az aszinkron/várakozó kortárs webes keretrendszerek, például a Flask és a Django támogatják a szintaxist. Ez azt jelenti, hogy meg kell várnia az összes kérés befejezését, mielőtt létrehozná a sablont, ha számos forrásból kell adatokat beszereznie az oldal megjelenítése előtt.
• Korlátozott hibakezelés: Az API-k használatakor rendszeresen előfordulhatnak hibák. A Django-sablonokban nincsenek beépített mechanizmusok a kecses hibakezeléshez. Ha egy API-hívás meghiúsul, el kell fognia a kivételt, és magán a sablonon belül kell kezelnie, ami ügyetlen és kihívást jelentő kódot eredményezhet.

Skálázható alkalmazások létrehozása

Azáltal, hogy a prezentációs réteget az üzleti logikától elválasztják, a Django sablonok lehetővé teszik a fejlesztők számára, hogy az újrafelhasználható és karbantartható kód létrehozására összpontosítsanak. Korlátaik miatt azonban a Django-sablonok nem feltétlenül a legjobb választás az API-k nagymértékű felhasználásához. Az olyan ügyfél-keretrendszerek, mint a React, továbbra is hasznosak a méretezhető alkalmazások felépítésében.