Axios библиотека

Это JavaScript-библиотека для выполнения либо HTTP-запросов в Node.js, либо XMLHttpRequests в браузере. Она поддерживает промисы — новинку ES6. Одна из особенностей, которая делает её лучше fetch() — автоматические преобразования JSON-данных.

CORS (Cross-Origin Resource Sharing)

Это механизм, который позволяет ограничить ресурсы веб-страниц, чтобы они могли запросить ресурсы с других доменов. Поскольку правила безопасности браузеров по умолчанию блокируют такие запросы (из-за политики одинаковых источников), CORS предоставляет способ более безопасного доступа к ресурсам с других источников.

В чём отличие OneToOne от ForeingKey полей ?

Их основным и главным отличием является то, как они относятся к модели на которую они ссылаются. Если отношение между моделью с полем OneToOne и целевой моделью, такие, что может быть только одна такая запись в БД, то ForeignKey допускает не ограниченное количество оных.

Когда использовать поле связи OneToOne в Django моделях ?

Данное поле модели отлично подойдёт, когда необходимо добавить новый функционал к уже существующей модели (или вернее сказать, к записи модели в БД). То есть, тогда, когда менять существующий функционал уже созданных моделей не оправдано тяжело или дорого.

Удалить все

ЗАГРУЗКА ...

Содержание

Базовое внедрение RESTfull API на Django

24.02.2025

08.04.2026

4 минуты

4603

Теги:

Вступление

Доброго времени суток. Сегодня покажу как можно сделать API для вашего сайта и то, как этот API можно будет использовать со стороны клиента. Бэкенд я пишу на Django, а за создание и настройку его API будет заниматься Django REST framework. Клиентская часть(фронтенд) сайта будет описана на Axios.

Работа с API всегда представляет собой отправку некоторых запросов на сервер и обработкой обратных ответов. А то чем оно отправляется Axios, HTMx, fetch или то, чем оно обрабатывается, например ReactJS не столь важно.

Сам процесс подключения REST API я покажу на примере обычной модели Preset в приложении Backend

Процесс внедрения REST API на сайт

Процесс создания или внедрения Django REST API для сайта, можно описать следующими шагами:

Нужно создать или иметь уже готовый Django проект
Настроить и установить необходимые пакеты
Создаём модели, которые хотим использовать на стороне клиента
Создаём сериализаторы к ним.
Создаём представления(обработчики) для них
Подключаем маршруты и пути
Пишем и настраиваем фронтенд сайта для работы с API

Обо всём по порядку, по этому начнём с настройки и установки необходимых пакетов.

Настройка Django REST фреймворка

Нужно установить и подключить следующие python-модули:

django-cors-headers: для активации так называемого Cross-Origin Resource Sharing (CORS) для общения React приложения и Django API.
djangorestframework: это Django приложение, которое позволит нам с лёгкостью построить АПИ для нашего сайта.
django: бэкенд нашего сайта, управление базой данных

Вот так, подключаем ново установленные модули в settings.py:

INSTALLED_APPS = [ ... # Django REST framework 'corsheaders', 'rest_framework', ... ] MIDDLEWARE = [ ... 'django.middleware.csrf.CsrfViewMiddleware', # REST framework 'corsheaders.middleware.CorsMiddleware', ... ]

Создаём модели

Следующим шагом будет определиться с тем, с какими моделями мы хотим работать. Вот полный код модели, на примере которой мы и будем заниматься сериализацией. В файле models.py, вашего приложения создай модель:

class Preset(models.Model): name = models.CharField(max_length=120) user = models.ForeignKey(get_user_model(), null=True, on_delete=models.CASCADE) timeCreated = models.DateTimeField(auto_now=True, auto_created=True) queries = models.ManyToManyField(Query) def __str__(self): return self.name

Это всего лишь пример и ты волен создать свою собственную модель, со своими полями и методами.

Создаём классы сериализаторы

После создания необходимых моделей, нам потребуются Сереализаторы. Для этого импортируем модуль serializers из rest_framework и записываем, те поля что хотим сериализовать. Создай файл serializers.py в своём приложении и запиши следующее:

from rest_framework import serializers from .models import Preset class PresetSerializer(serializers.ModelSerializer): class Meta: model = Preset fields = ('id', 'name', 'user', 'queries')

Django сериализатор - это класс или метод в python, преобразующий сложные структуры данных или модели в последовательность байтов или строку (JSON, XML, YAML) или другой формат, пригодный для сохранения в файл, базу данных или передачи по сети.

Ничего особенного в этих сериализаторах нет. Создаём класс посредством наследования. Потом выбираем модель и поля, которые хотим сериализовать. Двигаемся дальше к представлениям.

Создаём представления для сериализаторов

Теперь, нам бы видеть что мы добавляем, удаляем или изменяем. Нужно создать представления в файле views.py:

from rest_framework import viewsets from .serializers import PresetSerializer from .models import Preset class PresetModelView(viewsets.ModelViewSet): serializer_class = PresetSerializer queryset = Preset.objects.all() # Фильтруем пресеты в зависимости от пользователя # запросившего их def get_queryset(self): if self.request.user.is_authenticated: return self.queryset.filter(user=self.request.user) return Preset.objects.none()

Настраиваем маршруты для представлений

И последний штрих. Чтобы наконец увидеть в действии REST API, нужно подключить созданный ранее класс-представление - PresetModelView. Для этого в файле urls.py, твоего приложения, подключим новый роутер:

from django.urls import path, include from rest_framework import routers from Backend import views router = routers.DefaultRouter() router.register(r'presets', views.PresetModelView, 'preset') urlpatterns = [ ... path('api/', include(router.urls)), ... ]

Всё, готово. Давай посмотрим что получилось. Перейди по адресу localhost:8000/api/ , ты увидишь, что-то вроде этого:

Как видно из картинки мы успешно подключили и настроили наш маршрут. Перейдём по любой из представленных ссылок, например localhost:8000/api/preset/. Итак, у меня есть две учётные записи dima и some и у каждой свои пресеты. Посмотрим как работает фильтрация по пользователю:

Пользователь some

Пользователь dima

Как видно, у первого пользователя только один пресет с id=3. А у второго 2 пресета с id=1 и 2.

Работа с API со стороны клиента

Работать с API со стороны клиента, очень просто. Необходимо сделать соответствующий AJAX запрос и обработать ответ. Например, так я получу все доступные записи в Preset модели.

axios.get("/api/preset/", { headers: { "accept": "application/json", "Content-Type": "application/json", }}) .then( resp => { // Your code }) .catch( error => { // Your error code }

Дополнительная настройка REST фреймворка

У тебя наверняка возник вопрос, что всё это красиво, но хочется просто получить JSON файл на стороне клиента и сделать то что должно. У меня так же зудело и я нашёл довольно элегантное решение для данной проблемы.

Смотри, в режиме разработки нам будут показываться предыдущие страницы на картинках, но если мы поменяем режим (т.е. сделаем debug=False в settings.py) мы будем получать вот такие вот ответы:

У меня в firefox стоит специальное расширение которое делает вот такую вот красоту. Расширение называется, если что, JSONView и доступно для Chrome тоже.

Чтобы добиться такого результата, достаточно добавить в конце файла settings.py следующие строчки:

if not DEBUG: REST_FRAMEWORK = { # Need to be specified explicitly, otherwise for everyone will be available HTML version of REST framework 'DEFAULT_RENDERER_CLASSES': [ 'rest_framework.renderers.JSONRenderer', ] }

Мы просто меняем рендер по умолчанию и получаем то, что получаем ... JSON файл.

Заключение

Вот мы и закончили настройку API нашего сайта при помощи Django REST фреймворка. Конечно, по началу может показаться что, всё это как-то запутанно и чересчур сложно, но поверь, когда твой проект станет чуть-чуть сложней, чем одностраничный лендинг, ты сразу вспомнишь про REST фреймворк и про то, что он не такой уж и запутанный ( •̀ ω •́ )y

Попало много страниц в индекс? Что делать и надо ли?

Следующая статья

Собственный парсер поисковой выдачи гугл

Предыдущая статья

Не забудь поделиться, лайкнуть и оставить комментарий)

помогите, пож-та, как посмотреть как будет выглядеть сайт для конечного пользователя??? http://127.0.0.1:8000/api/categories/ - вот например я получаю json данные, но как же посмотреть как будет видеть их конечный пользователь вместе с js статикой и прочей красотой???

Все ответы (1)

Ответить

ЗАГРУЗКА ...

Внешние ссылки

Другое

Использованные термины

Axios библиотека ⟶ Это JavaScript-библиотека для выполнения либо HTTP-запросов в Node.js, либо XMLHttpRequests в браузере. Она поддерживает промисы — новинку ES6. Одна из особенностей, которая делает её лучше fetch() — автоматические преобразования JSON-данных.
CORS (Cross-Origin Resource Sharing) ⟶ Это механизм, который позволяет ограничить ресурсы веб-страниц, чтобы они могли запросить ресурсы с других доменов. Поскольку правила безопасности браузеров по умолчанию блокируют такие запросы (из-за политики одинаковых источников), CORS предоставляет способ более безопасного доступа к ресурсам с других источников.

Релевантные вопросы

В чём отличие OneToOne от ForeingKey полей ? Их основным и главным отличием является то, как они относятся к модели на которую они ссылаются. Если отношение между моделью с полем OneToOne и целевой моделью, такие, что может быть только одна такая запись в БД, то ForeignKey допускает не ограниченное количество оных.
Когда использовать поле связи OneToOne в Django моделях ? Данное поле модели отлично подойдёт, когда необходимо добавить новый функционал к уже существующей модели (или вернее сказать, к записи модели в БД). То есть, тогда, когда менять существующий функционал уже созданных моделей не оправдано тяжело или дорого.