Table of Contents
*Автор выбрал фонд FreeBSD Foundation для получения пожертвования в рамках программы Write for DOnations.*
Введение
По мере роста спроса на развитие full-stack разработки появляются структуры веб-приложений, делающие разработку менее обременительной и более эффективной. Django является одной из таких структур. Django используется на крупных сайтах, в том числе Mozilla, Pinterest и Instagram. В отличие от нейтральной микроинфраструктуры Flask, пакет Django PyPI содержит все, что требуется для разработки полного цикла, и не требует настраивать для разработки базу данных или панель управления.
Django часто используется для вывода информации с API (например, посты Instagram или репозитории GitHub) на ваших сайтах и в веб-приложениях. Хотя это можно сделать и с помощью других структур веб-приложений, политика Django «батарейки в комплекте» означает, что для достижения того же результата потребуется меньше работы и меньше пакетов.
В этом обучающем модуле мы создадим проект Django, который будет отображать информацию дроплетов вашей учетной записи the cloud provider с помощью API the cloud provider v2. В частности, мы создадим сайт, который будет отображать таблицу дроплетов с указанием каждого IP-адреса, идентификатора, региона хостинга и ресурса. Для стилизации страницы на вашем сайте будет использоваться BulmaCSS, чтобы вы могли сосредоточиться на разработке и получить красивый результат.
После прохождения этого обучающего модуля у вас будет проект Django, который сможет создать веб-страницу следующего вида:
Предварительные требования
Для прохождения этого обучающего руководства вам потребуется следующее:
- Учетная запись the cloud provider с не менее чем одним дроплетом и персональным токеном доступа. Обязательно запишите токен в безопасном месте, он потребуется позднее в этом обучающем модуле.
- Умение делать запросы в API. Подробный обучающий модуль по работе с API можно найти в документе Использование веб-API для Python3.
- Локальная виртуальная среда для Python для поддержания зависимостей. В этом обучающем модуле мы будем использовать имя
<^>do_django_api<^>для нашего каталога проекта и<^>env<^>для нашей виртуальной среды.
- Знакомство с логикой шаблонов Django для отображения страниц с помощью данных API.
- Знакомство с логикой представления данных Django для обработки данных, полученных в API, и их передачи в шаблон для отображения.
Шаг 1 — Создание базового проекта Django
Установите Django из виртуальной среды <^>env<^>:
pip install Django
Теперь вы можете запустить проект Django и выполнить некоторые первоначальные команды по настройке.
Используйте django-admin startproject <^><name><^> для создания подкаталога в папке проекта с именем вашего проекта Django, затем переключитесь на этот каталог.
django-admin startproject do_django_project
cd do_django_project
После создания подкаталога вы найдете в нем файл manage.py, который обычно используется для взаимодействия с Django и работы вашего проекта. Используйте migrate для обновления базы данных по разработке Django:
python3 manage.py migrate
Вы увидите результат, который будет выглядеть следующим образом, по мере обновления базы данных:
[secondary_label Output]
Operations to perform:
Apply all migrations: admin, auth, contenttypes, sessions
Running migrations:
Applying contenttypes.0001_initial... OK
Applying auth.0001_initial... OK
Applying admin.0001_initial... OK
Applying admin.0002_logentry_remove_auto_add... OK
Applying admin.0003_logentry_add_action_flag_choices... OK
Applying contenttypes.0002_remove_content_type_name... OK
Applying auth.0002_alter_permission_name_max_length... OK
Applying auth.0003_alter_user_email_max_length... OK
Applying auth.0004_alter_user_username_opts... OK
Applying auth.0005_alter_user_last_login_null... OK
Applying auth.0006_require_contenttypes_0002... OK
Applying auth.0007_alter_validators_add_error_messages... OK
Applying auth.0008_alter_user_username_max_length... OK
Applying auth.0009_alter_user_last_name_max_length... OK
Applying auth.0010_alter_group_name_max_length... OK
Applying auth.0011_update_proxy_permissions... OK
Applying sessions.0001_initial... OK
Далее воспользуйтесь командой runserver для запуска проекта, чтобы протестировать его:
python3 manage.py runserver
Когда запустится сервер, результат будет выглядеть следующим образом:
[secondary_label Output]
Watching for file changes with StatReloader
Performing system checks...
System check identified no issues (0 silenced).
September 22, 2019 - 22:57:07
Django version 2.2.5, using settings 'do_django_project.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.
Теперь у нас есть базовый проект Django и работающий сервер разработки. Чтобы просмотреть работающий сервер разработки, откройте в браузере адрес 127.0.0.1:8000. В результате откроется стартовая страница Django:
Далее вы создадите приложение Django и настроите ваш проект для представления в этом приложении, чтобы увидеть нечто более интересное, чем страницу по умолчанию.
Шаг 2 — Создание базового приложения Django
На этом шаге вы создадите скелет приложения, который будет хранить ваши результаты дроплета. Вы вернетесь к этому приложению позже, когда настроите вызов API, чтобы наполнить его данными.
Убедитесь, что находитесь в каталоге do_django_project, и создайте приложение Django с помощью следующей команды:
python3 manage.py startapp display_droplets
Теперь вам нужно добавить новое приложение в INSTALLED_APPS в файле settings.py, чтобы Django распознавал его. settings.py — файл конфигурации Django, расположенный в другом подкаталоге проекта Django; у него такое же имя, как у папки проекта (do_django_project). Django создал для вас обе папки. Перейдите в каталог do_django_project:
cd do_django_project
Отредактируйте файл settings.py в редакторе на ваш выбор:
nano settings.py
Добавьте ваше новое приложение в раздел INSTALLED_APPS файла:
[label do_django_api/do_django_project/do_django_project/settings.py]
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
# The new app
<^>'display_droplets',<^>
]
Сохраните и закройте файл после завершения.
Функция просмотра GetDroplets
Далее вы создадите функцию GetDroplets в файле views.py приложения display_droplets2. Эта функция отобразит шаблон, который вы будете использовать для показа данных дроплета как context из API. context — словарь, используемый для передачи данных из кода Python и отправки их в шаблон HTML для показа на веб-странице.
Перейдите в каталог display_droplets:
cd ..
cd display_droplets
Откройте файл views.py для редактирования:
nano views.py
Добавьте в файл следующий код:
[label do_django_api/do_django_project/display_droplets/views.py]
from django.views.generic import TemplateView
class GetDroplets(TemplateView):
template_name = 'droplets.html'
def get_context_data(self, *args, **kwargs):
pass
Сохраните и закройте файл.
Позже вы заполните эту функцию и создадите файл droplets.html, но сначала давайте настроим файл urls.py для вызова этой функции при посещении корневого каталога сервера разработки (127.0.0.1:8000).
Перейдите обратно в каталог do_django_project:
cd ..
cd do_django_project
Откройте файл urls.py для редактирования:
nano urls.py
Добавьте заявление import для GetDroplets, затем добавьте дополнительный путь к urlpatterns, который будет указывать на новое представление.
[label do_django_api/do_django_project/do_django_project/urls.py]
from django.contrib import admin
from django.urls import path
<^>from display_droplets.views import GetDroplets<^>
urlpatterns = [
path('admin/', admin.site.urls),
<^>path('', GetDroplets.as_view(template_name='droplets.html'), name='Droplet View'),<^>
]
Если хотите создать собственные настраиваемые пути, первый параметр — URL (например, example.com/admin), второй параметр — функция для вызова создания веб-страницы, а третий — только имя пути.
Сохраните и закройте файл.
Шаблон дроплетов
Далее вы будете работать с _шаблонами_. Шаблоны — файлы HTML, которые Django использует для создания веб-страниц. В этом случае вы будете использовать шаблон для создания страницы HTML, которая отображает данные API.
Перейдите обратно в каталог display_droplets:
cd ..
cd display_droplets
В этом каталоге создайте папку template и перейдите в нее:
mkdir templates
cd templates
Создайте файл droplets.html и откройте его для редактирования:
nano droplets.html
Во избежание необходимости писать какой-либо CSS для этого проекта, будем использовать Bulma CSS, так как он является бесплатным и компактным CSS-каркасом, позволяющим создавать готовые веб-страницы простым добавлением нескольких атрибутов классов в HTML.
Теперь создадим шаблон с базовой навигационной панелью. Добавьте в файл droplets.html следующий код:
[label do_django_api/do_django_project/display_droplets/templates/droplets.html]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>cloud servers</title>
<link crossorigin="anonymous"
href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.min.css"
integrity="sha256-8B1OaG0zT7uYA572S2xOxWACq9NXYPQ+U5kHPV1bJN4="
rel="stylesheet"/>
<link rel="shortcut icon" type="image/png" href="https://www.progressiverobot.com/images/how-to-display-data-from-the-cloud-provider-api-with-django-ru-section-1.png"/>
</head>
<body>
<nav aria-label="main navigation" class="navbar is-light" role="navigation">
<div class="navbar-brand">
<div class="navbar-item">
<img atl="the cloud provider" src="https://www.progressiverobot.com/images/how-to-display-data-from-the-cloud-provider-api-with-django-ru-section-1.png"
style="margin-right: 0.5em;">Droplets
</div>
</div>
</nav>
</body>
</html>
Сохраните и закройте файл.
Этот код импортирует команду Bulma в стандартный HTML и создает панель nav, показывающую «Droplets».
Обновите вкладку браузера, чтобы просмотреть изменения, внесенные в шаблон.
До сих пор вы не касались ничего, связанного с API; вы создали основу для проекта. Далее вы найдете применение этой странице, создав вызов API и представив данные дроплета.
Шаг 3 — Создание вызова API
На этом шаге вы выполните настройку вызова API и отправите данные дроплета как контекст в шаблон для показа в таблице.
Получение данных дроплета
Перейдите обратно в каталог display_droplets:
cd ..
Установите библиотеку requests, чтобы связываться с API:
pip install requests
Библиотека requests позволяет коду запрашивать данные в API и добавлять заголовки (дополнительные данные, отправленные вместе с нашим запросом).
Далее вы создадите файл services.py, в котором будете совершать вызов API. Эта функция будет использовать запросы для связи с https://developer.mozilla.org/en-US/docs/Web/HTTP и наращивать каждый дроплет в файле JSON, возвращаемом в список.
Откройте файл services.py для редактирования:
nano services.py
Добавьте в файл следующий код:
[label do_django_api/do_django_project/display_droplets/services.py]
import os
import requests
def get_droplets():
url = 'https://developer.mozilla.org/en-US/docs/Web/HTTP'
r = requests.get(url, headers={'Authorization':'Bearer %s' % '<^>access_token<^>'})
droplets = r.json()
droplet_list = []
for i in range(len(droplets['droplets'])):
droplet_list.append(droplets['droplets'][i])
return droplet_list
Внутри функции get_droplets происходит два события: делается запрос и разбираются данные. url содержит URL, запрашивающий данные дроплета из API the cloud provider. r хранит запрошенные данные.
requests в этом случае принимает два параметра: url и headers. Если вам нужны данные из другого API, вы можете заменить значение url на соответствующий URL. headers отправляет в the cloud provider ваш токен доступа, чтобы они знали, что вы можете сделать запрос, а также для какой учетной записи делается запрос.
droplets содержит информацию из переменной r, но теперь она преобразована из JSON — формата, в котором API направляет информацию — в словарь, который легко использовать в цикле for.
Следующие три строки создают массив droplet_list[]. После этого цикл for перебирает информацию в дроплетах и добавляет каждый элемент в список. Вся информация, полученная от API и хранимая в дроплетах, находится в документации разработчиков the cloud provider.
Примечание. Не забудьте заменить access_token на свой токен доступа. Также не забывайте о безопасности и никогда не публикуйте этот токен онлайн.
Сохраните и закройте файл.
Защита вашего токена доступа
Вы всегда должны скрывать токен доступа, но если кто-то когда-нибудь захочет запустить ваш проект, у вас должен быть простой способ дать им возможность добавлять собственный токен доступа без необходимости редактировать код Python. Для этого подойдет решение DotENV, поскольку переменные хранятся в файле .env, который можно легко отредактировать.
Перейдите обратно в каталог do_django_project:
cd ..
Для начала работы с переменными среды установите python-dotenv:
pip install python-dotenv
После установки вам нужно будет настроить Django для обработки переменных среды, чтобы вы могли указывать их в коде. Для этого нужно добавить несколько строк кода в файлы manage.py и wsgi.py.
Откройте файл manage.py для редактирования:
nano manage.py
Добавьте следующий код:
[label do_django_api/do_django_project/manage.py]
"""Django's command-line utility for administrative tasks."""
import os
import sys
<^>import dotenv<^>
def main():
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'do_django_project.settings')
try:
from django.core.management import execute_from_command_line
except ImportError as exc:
raise ImportError(
"Couldn't import Django. Are you sure it's installed and "
"available on your PYTHONPATH environment variable? Did you "
"forget to activate a virtual environment?"
) from exc
execute_from_command_line(sys.argv)
if __name__ == '__main__':
main()
<^>dotenv.load_dotenv(<^>
<^>os.path.join(os.path.dirname(__file__), '.env')<^>
<^>)<^>
Если вы добавляете это в manage.py, это означает, что при подаче команд в Django при разработке он будет обрабатывать переменные среды из вашего файла .env.
Сохраните и закройте файл.
Если вам когда-либо потребуется обрабатывать переменные среды в своих производственных проектах, вы можете сделать это из файла wsgi.py. Перейдите в каталог do_django_project:
cd do_django_project
Откройте файл wsgi.py для редактирования:
nano wsgi.py
Добавьте следующий код в wsgi.py:
[label do_django_api/do_django_project/do_django_project/wsgi.py]
import os
<^>import dotenv<^>
from django.core.wsgi import get_wsgi_application
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'do_django_project.settings')
<^>dotenv.load_dotenv(<^>
<^>os.path.join(os.path.dirname(os.path.dirname(__file__)), '.env')<^>
<^>)<^>
application = get_wsgi_application()
В этом фрагменте кода есть дополнительный элемент os.path.dirname(), поскольку wsgi.py должен просмотреть два каталога, чтобы найти файл .env. Этот фрагмент — не тот же, что используется для manage.py.
Сохраните и закройте файл.
Теперь вы можете использовать переменную среды в файле services.py вместо токена доступа. Перейдите обратно в каталог display_droplets:
cd ..
cd display_droplets
Откройте файл services.py для редактирования:
nano services.py
Теперь замените свой токен доступа на переменную среды:
[label do_django_api/display_droplets/services.py]
import os
import requests
def get_droplets():
url = "https://developer.mozilla.org/en-US/docs/Web/HTTP"
r = requests.get(url, headers={'Authorization':'Bearer %s' % <^>os.getenv('DO_ACCESS_TOKEN')<^>})
droplets = r.json()
droplet_list = []
for i in range(len(droplets['droplets'])):
droplet_list.append(droplets['droplets'][i])
return droplet_list
Сохраните и закройте файл.
Следующий шаг — создать файл .env. Перейдите обратно в каталог do_django_project:
cd ..
Создайте файл .env и откройте его для редактирования:
nano .env
В .env добавьте свой токен в качестве переменной DO_ACCESS_TOKEN:
[label do_django_api/do_django_project/.env]
DO_ACCESS_TOKEN=<^>access_token<^>
Сохраните и закройте файл.
Примечание: Добавьте .env в ваш файл .gitignore, чтобы он никогда не включался в ваши операции подтверждения.
Теперь подключение API настроено и сконфигурировано, и вы также защитили свой токен доступа. Теперь пришло время предоставить пользователю информацию, которую вы нашли.
Шаг 4 — Обработка данных дроплета в представлениях и шаблонах
Теперь, когда вы можете делать вызовы API, вам нужно направить данные дроплета в шаблон для рендеринга. Давайте вернемся к заготовке функции GetDroplets, созданной вами ранее в файле views.py. В данной функции вы отправите droplet_list в качестве контекста в шаблон droplets.html.
Перейдите в каталог display_droplets:
cd display_droplets
Откройте файл views.py для редактирования:
nano views.py
Добавьте следующий код в views.py:
[label do_django_api/do_django_project/display_droplets/views.py]
from django.shortcuts import render
from django.views.generic import TemplateView
<^>from .services import get_droplets<^>
class GetDroplets(TemplateView):
template_name = 'droplets.html'
def get_context_data(self, *args, **kwargs):
<^>context = {<^>
<^>'droplets' : get_droplets(),<^>
<^>}<^>
<^>return context<^>
Информация, отправленная в шаблон droplets.html, обрабатывается через словарь context. Поэтому droplets действует как ключ, а массив,возвращаемый от get_droplets(), действует как значение.
Сохраните и закройте файл.
Представление данных в шаблоне
В шаблоне droplets.html вы будете создавать таблицу и заполнять ее с помощью данных дроплета.
Перейдите в каталог templates:
cd templates
Откройте файл droplets.html для редактирования:
nano droplets.html
Добавьте следующий код после элемента nav в droplets.html:
[label do_django_api/do_django_project/display_droplets/templates/droplets.html]
<table class="table is-fullwidth is-striped is-bordered">
<thead>
<tr>
<th>Name</th>
<th>IPv4 Address(es)</th>
<th>Id</th>
<th>Region</th>
<th>Memory</th>
<th>CPUs</th>
<th>Disk Size</th>
</tr>
</thead>
<tbody>
{% for droplet in droplets %}
<tr>
<th>{{ droplet.name }}</th>
{% for ip in droplet.networks.v4 %}
<td>{{ ip.ip_address }}</td>
{% endfor %}
<td>{{ droplet.id }}</td>
<td>{{ droplet.region.name }}</td>
<td>{{ droplet.memory }}</td>
<td>{{ droplet.vcpus }}</td>
<td>{{ droplet.disk }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% for droplet in droplets %} ... {% endfor %} — цикл итераций через массив дроплетов, полученный из views.py. Каждый дроплет вставляется в строку таблицы. Различные строки {{ droplet.<attribute> }} получают этот атрибут для каждого дроплета в цикле и вставляют его в ячейку таблицы
Сохраните и закройте файл.
Обновите браузер и увидите список дроплетов.
Теперь вы можете обрабатывать API the cloud provider внутри ваших проектов Django. Вы взяли данные, извлеченные из API, и вставили их в созданный вами ранее шаблон, чтобы отобразить информацию с обеспечением читаемости и гибкости.
Заключение
В этой статье вы создали проект Django, который может отображать информацию дроплета из API the cloud provider со стилями Bulma CSS. Выполнив этот обучающий модуль, вы научились трем важным навыкам:
- Как обрабатывать запросы API в Python при помощи
запросови модулейjson.
- Как отображать данные API в проекте Django с использованием логики
просмотраишаблона.
- Как безопасно обрабатывать ваши токены API при помощи
dotenvв Django.
Теперь, когда вы получили представление об обработке API в Django, вы можете создать собственный проект — либо с использованием другой функции из API the cloud provider, либо с другим API. Также вы можете ознакомиться с другими обучающими руководствами Django или с аналогичным руководством по микроструктуре веб-приложений React.
