Anda dapat dengan mudah menggunakan API sederhana tanpa perlu mengonfigurasi frontend eksternal. Pelajari cara menggunakan templat Django untuk konsumsi API.

Saat menggunakan teknologi atau kerangka kerja backend seperti Django, Laravel, atau Node.js untuk menulis REST API, Anda perlu untuk memiliki keterampilan frontend tambahan menggunakan kerangka kerja seperti React, Angular, dan Vue untuk menggunakan API titik akhir. Tapi itu tidak selalu terjadi, Anda dapat menggunakan API di Django itu sendiri menggunakan templat Django.

Menyiapkan Proyek Django dan Titik Akhir API

Langkah pertama adalah membuat direktori proyek. Buka terminal Anda dan buat direktori untuk proyek Anda.

mkdir payment_wallet_project
cd payment_wallet_project

Untuk tutorial ini, Anda akan membuat API untuk dompet pembayaran.

Kode sumber lengkap tersedia di a Repositori GitHub.

Mulailah dengan menciptakan lingkungan virtual. Dalam hal ini, Anda akan menggunakan perpustakaan Pipenv.

pipenv install django djangorestframework

Perintah ini menginstal perpustakaan yang diperlukan serta menciptakan lingkungan virtual.

instagram viewer

Aktifkan lingkungan virtual menggunakan perintah di bawah ini:

pipenv shell

Buat proyek Django baru bernama Aplikasi Pembayaran.

django-admin startproject PayApp .

Menggunakan tanda titik (.) di akhir django-admin perintah memastikan proyek menghindari pembuatan direktori duplikat dari direktori proyek.

Membuat aplikasi Django baru dalam direktori proyek.

python manage.py startapp wallet

Sekarang, lanjutkan untuk membangun aplikasi API Anda menggunakan langkah-langkah di bawah ini.

Membuat REST API Dompet Pembayaran

Buka dompet/model.py file dan tentukan dompet dan model transaksi.

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)

Dalam dompet direktori, buat file baru serializer.py, dan tulis serializer dompet dan model transaksi.

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

Serializer mempertimbangkan semua bidang dalam dompet dan model transaksi.

Di dalam dompet/views.py, tuliskan pandangan untuk menangani logika penerapan fungsi dompet. Ini termasuk kemampuan deposit dan penarikan.

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

Selanjutnya, tentukan perutean URL untuk API dengan membuat dompet/urls.py mengajukan:

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'),

]

Di proyek Anda urls.py, sertakan URL aplikasi:

from django.contrib import admin
from django.urls import path, include

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

Dalam PayApp/settings.py file, tambahkan dompet Dan aplikasi rest_framwork ke DIINSTALLED_APPS daftar.

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

]

Ini akan mendaftarkan aplikasi wallet dan rest_framework ke aplikasi proyek Django.

Mengonsumsi API Dengan Templat Django

Sekarang, Anda akan menggunakan templat Django untuk membuat antarmuka sederhana untuk menggunakan API. Membuat dompet.html berkas di dompet/templat/ direktori dan tambahkan kode HTML di bawah ini.


"en">

"UTF-8">
"viewport" content="width=device-width, initial-scale=1">
Wallet
"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>

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



File HTML menampilkan API penyetoran dan penarikan dalam antarmuka pengguna cantik yang dirancang menggunakan Bootstrap.

Interaksi Pengguna Dengan Formulir

Dalam file HTML, buat tag skrip dan tambahkan kode berikut ke pendengar acara pengiriman formulir setoran.

Selanjutnya, tambahkan event pendengar untuk pengiriman formulir penarikan menggunakan kode di bawah ini:

Pendengar acara bertanggung jawab untuk menangani penyetoran dan penarikan (#formulir deposito Dan #penarikan-formulir) penyerahan formulir.

URL untuk permintaan pengambilan adalah untuk mencocokkan URL untuk tindakan penyetoran dan penarikan.

Respons JSON untuk penyetoran dan penarikan kemudian diurai untuk mendapatkan saldo yang diperbarui (data.keseimbangan). Mereka kemudian diformat dan ditampilkan di halaman.

Selanjutnya, di dompet/views.py, tambahkan pembaruan berikut untuk merender halaman wallet.html:

from django.shortcuts import render

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

Dalam contoh ini, Anda akan menggunakan Pertama() metode kueri untuk memilih dompet pengguna tunggal untuk tujuan demonstrasi.

Perbarui urls.py file dengan menambahkan path ke tampilan_dompet sebagai berikut:

from .views import wallet_view

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

Akses halaman dompet dari URL: http://127.0.0.1:8000/home/.

Dengan semuanya sudah diatur dan berfungsi seperti yang diharapkan, jalankan melakukan migrasi Dan migrasi perintah. Terakhir, jalankan aplikasi:

python manage.py makemigrations
python manage.py migrate

python manage.py runserver

Untuk mengakses titik akhir API, navigasikan ke http://127.0.0.1:8000/api/.

Hasil yang diharapkan:

Arahkan ke host lokal untuk berinteraksi dengan dompet.

Hasil yang diharapkan:

Dompet menunjukkan saldo dan memberi Anda pilihan untuk menyetor atau menarik.

Memahami Templat Django dan Perannya dalam Konsumsi API

Meskipun sangat baik untuk menyajikan konten statis, templat Django memiliki batasan tertentu ketika menggunakan API:

  • Fleksibilitas terbatas: Templat Django kurang fleksibel dibandingkan yang dibuat menggunakan Jinja2 atau Twig karena digunakan untuk menampilkan struktur tertentu. Misalnya, Anda harus mengurai JSON secara manual dan memasukkan data ke dalam templat jika Anda perlu menggunakan API yang mengembalikan data JSON. Hal ini dapat menjadi tantangan, terutama jika API memberikan struktur data yang rumit.
  • Tidak ada dukungan untuk permintaan asinkron: Templat Django secara asli tidak memiliki kemampuan untuk menangani permintaan asinkron. Templat masih memerlukan pemrosesan sinkron meskipun kerangka web kontemporer async/await seperti Flask dan Django mendukung sintaksis. Ini berarti Anda harus menunggu hingga semua permintaan selesai sebelum membuat templat jika Anda perlu memperoleh data dari berbagai sumber sebelum merender halaman.
  • Penanganan kesalahan terbatas: Kesalahan mungkin sering terjadi saat menggunakan API. Tidak ada mekanisme bawaan untuk penanganan kesalahan yang baik dalam cetakan Django. Anda perlu menangkap pengecualian dan mengelolanya di dalam templat itu sendiri jika panggilan API gagal, yang dapat mengakibatkan kode menjadi kikuk dan sulit dipelihara.

Bangun Aplikasi yang Skalabel

Dengan menyediakan cara untuk memisahkan lapisan presentasi dari logika bisnis, templat Django memungkinkan pengembang untuk fokus pada pembuatan kode yang dapat digunakan kembali dan dipelihara. Namun, karena keterbatasannya, cetakan Django mungkin bukan pilihan terbaik ketika menggunakan API dalam skala besar. Kerangka kerja klien seperti React masih berguna dalam membangun aplikasi yang skalabel.