Django Rest Framework 最流行的应用之一是在 Django 模板中显示 API 数据。您可能需要在项目的某个时刻使用 API 数据。在这篇博客中，我们将学习如何使用 Django 模板在 HTML 中显示 API 响应。
在这里我会给你我们会帮助你举个例子 django 搜索自动完成输入字段的例子。那么让我们看看下面的例子：
第 1 步：创建项目
在这一步中，我们将使用 django-admin 创建一个新的 django 项目。返回命令行界面并运行以下命令：
django-admin startproject example
第 2 步：创建应用
cd example django-admin startapp core
第 3 步：更新 settings.py
接下来需要在settings.py文件中添加如下：
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'core',
]
第 4 步：创建模型
现在去我们将要使用的模型 我们将调用我们的单一模型 Post 并且它只有两个字段：url和slug。最后设置__str__以在管理界面中显示帖子的名称。 core/models.py
from django.db import models
# Create your models here.
class Url(models.Model):
url = models.CharField(max_length=200)
slug = models.CharField(max_length=15)
def __str__(self):
return f"Short Url for: {self.url} is {self.slug}"
好的，一切就绪。我们可以为此更改生成一个迁移文件，然后通过迁移将其集成到我们的数据库中。
python manage.py makemigrations python manage.py migrate
第 5 步：创建表单
在这一步中，我们需要创建一个将要使用的表单。 core/forms.py
from django import forms
class UrlForm(forms.Form):
url = forms.CharField(label="URL")
第 6 步：创建视图
在这一步中，我们需要创建用于执行从 jsonplaceholder post api 记录中获取数据的视图。打开 core/views.py 文件并添加：
core/views.py
from django.shortcuts import render, redirect
from .models import Url
from .forms import UrlForm
from django.contrib import messages
import random
import string
# Create your views here.
def urlShort(request):
if request.method == 'POST':
form = UrlForm(request.POST)
if form.is_valid():
slug = ''.join(random.choice(string.ascii_letters)
for x in range(10))
url = form.cleaned_data["url"]
new_url = Url(url=url, slug=slug)
new_url.save()
# request.user.urlshort.add(new_url)
return redirect('/')
else:
form = Url()
data = Url.objects.all()
context = {
'form': form,
'data': data
}
return render(request, 'url.html', context)
def urlRedirect(request, slugs):
data = Url.objects.get(slug=slugs)
return redirect(data.url)
第 7 步：创建模板
接下来，打开 core/templates/url.html 文件并添加：
/core/templates/url.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Tuts-Station.com</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css">
<style type="text/css">
body{
background-color: #f7fcff;
}
</style>
</head>
<body>
<div class="container mt-5 pt-5">
<div class="row d-flex justify-content-center">
<div class="col-md-9">
<div class="card">
<div class="card-header">
<h3>How to Create URL Shortener in Django? - <span class="text-primary">Tuts-Station.com</span></h3>
</div>
<div class="card-body">
<form action="{% url 'urlShort' %}" method="POST">
{% csrf_token %}
<div class="row">
<div class="col-md-12">
<label>URL</label>
<input type="text" class="form-control" name="url">
</div>
</div>
<div class="row mt-2">
<div class="col-md-12">
<button type="submit" class="btn btn-success">Submit</button>
</div>
</div>
</form>
<table class="table mt-4">
<thead>
<tr>
<th>Old url</th>
<th>New url</th>
</tr>
</thead>
{% for i in data %}
<tbody>
<tr>
<td>{{i.url}}</td>
<td>{{i.slug}}</td>
</tr>
</tbody>
{% endfor %}
</table>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
第 8 步：创建网址
在本节中，我们将创建 url 来访问我们的视图。转到 urls.py core/urls.py 文件并按如下方式更新它： core/urls.py
from django.urls import path
from core import views
urlpatterns = [
path("", views.urlShort, name="urlShort"),
path("<str:slugs>", views.urlRedirect, name="redirect")
]
接下来，我们将要求修改 urls.py 您的根 preoject 文件夹让更新文件。
example/urls.py
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('core.urls')),
]
第 8 步：运行服务器
在此步骤中，我们将运行本地开发服务器来使用我们的应用程序，而无需将其部署到 Web。
python manage.py runserver
接下来，使用 Web 浏览器转到 http://localhost:8000 地址。
我希望它能帮助你……