Как создать статус доставки сообщения в Django

1656684488 kak sozdat status dostavki soobshheniya v django

от Ogundipe Samuel

Сегодня мы создадим структуру статуса доставки сообщений в реальном времени с помощью Django и Pusher.

0*iF8r7xsxvctowLcc

Чтобы следовать этому учебнику, необходимо базовое понимание Django и Vue.

Настройки Django

Во-первых, нам нужно установить библиотеку Python Django, если у нас ее нет.
Чтобы установить Django, запускаем:

После установки Django пора создать наш проект. Откройте терминал и создайте новый проект с помощью такой команды:

https://gist.github.com/4896cf41463ff83e191949a02bbead23

В вышеприведенной команде мы создали новый проект под названием pusher_message. Следующим шагом станет создание программы в нашем новом проекте. Для этого запустим следующие команды:

Когда мы завершим настройки новой программы, нам нужно сообщить Django о нашей новой программе, поэтому мы перейдем к нашей pusher_message\settings.py и добавьте программу для сообщений в наши установленные программы, как показано ниже:

После того, как мы выполним вышеизложенное, пора запустить программу и проверить, все ли прошло хорошо.

В нашей терминальной оболочке мы запускаем:

Если мы перейдем к браузеру http://localhost:8000мы должны увидеть следующее:

Настройте приложение на Pusher

На этом этапе Django готов и сконфигурирован. Теперь нам нужно настроить Pusher, а также получить учётные данные нашей программы.

Нам нужно зарегистрироваться на Pusher, создать новое приложение, а также скопировать секретный ключ программы и идентификатор программы.

Следующим шагом является установка необходимых библиотек:

В вышеприведенной команде bash мы установили один пакет, pusher. Это официальная библиотека Pusher для Python, которую мы будем использовать для запуска и отправки сообщений Pusher.

Создание нашей программы

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

В вышеприведенном блоке кода мы определили модель под названием Conversation. Таблица разговора состоит из следующих полей:

  • Поле для связи с пользователем, который его создал
  • Поле для сохранения сообщения
  • Поле для сохранения статуса сообщения
  • Поле для хранения даты и времени создания сообщения

Выполнение миграций

Нам нужно выполнить миграции и запустить их, чтобы можно было создать нашу таблицу базы данных. Чтобы сделать это, давайте запустим следующее в нашем терминале:

Создание наших взглядов

В Django просмотры не обязательно касаются HTML-структур нашей программы. Фактически мы можем воспринимать это как свое Controllerкак упоминается в некоторых других структурах.

Давайте откроем наш views.py в нашем message и замените содержимое следующим образом:

В приведенном выше коде мы определили четыре основные функции, а именно:

  • index
  • broadcast
  • conversation
  • delivered

В index мы добавили декоратор, необходимый для входа, а также передали аргумент еще не существующего URL-адреса входа, поскольку нам нужно будет создать его в urls.py файл. Кроме того, мы воспроизвели стандартный шаблон под названием chat.html что мы тоже скоро создадим.

В broadcast мы получили содержимое сообщения, которое было отправлено, сохранили его в нашей базе данных и, наконец, инициировали запрос Pusher, который передал в наш словарь сообщений, а также название канала и событие.
В conversations мы просто увлекаем все разговоры и возвращаем их как ответ JSON.

Наконец-то мы имеем delivered функция, заботящаяся о состоянии доставки наших сообщений.

В этой функции мы получаем разговор по предоставленному нам идентификатору. Затем мы проверяем, что пользователь, желающий инициировать доставленное событие, не является пользователем, который сначала послал сообщение. Также проходим в socket_id чтобы Pusher не транслировал событие тому, кто его инициировал.

The socket_id выступает как идентификатор для соединения сокета, вызвавшего событие.

Заполнение URL-адреса.py

Давайте откроем наш pusher_message\urls.py файл и замените следующим:

Что изменилось в этом файле? Мы добавили шесть новых маршрутов в файл.
Мы определили точку входа и назначили ее нашему index функция. Далее мы определили URL входа, который login_required декоратор попытается получить доступ к аутентификации пользователей.

Мы использовали значение по умолчанию auth функция для обработки, но переданная в наш собственный шаблон входа, который мы вскоре создадим.

Далее мы определили маршруты для conversation триггер сообщения, все conversationsи наконец delivered разговор.

Создание файлов HTML

Теперь нам нужно будет создать две HTML-страницы, чтобы наша программа могла работать бесперебойно. При создании программы мы ссылались на две страницы HTML.

Давайте создадим новую папку в нашем messages папка называется templates.

Далее мы создаем файл под названием login.html в нашем templates и замените ее следующим:

Компоненты Vue и привязки Pusher

Это! Теперь, когда приходит новое сообщение, оно будет транслироваться, и мы можем прослушивать его с помощью нашего канала, чтобы обновлять статус в реальном времени. Ниже представлен наш пример компонента, написанного с помощью Vue.js.

Пожалуйста, запиши: В компоненте Vue ниже вызвана новая функция **queryParams** было определено для сериализации нашего тела POST, чтобы его можно было отправлять как **x-www-form-urlencoded** на сервер вместо a **payload**. Мы сделали это, потому что Django не может обрабатывать поступающие запросы **payload**.

Ниже представлено изображение, которое показывает то, что мы создали:

0*iF8r7xsxvctowLcc

Вывод

В этой статье мы рассмотрели, как создать статус доставки сообщения в реальном времени с помощью Django и Pusher. Мы освободили определенные функции от проверок CSRF, а также освободили вещателя от получения вызванного им события.

Код размещен в публичном репозитории GitHub. Вы можете скачать его для учебных целей.

Есть лучший способ создать нашу программу, оговорки или комментарии? Дайте нам знать в комментариях. Помните, что делиться – это учиться.

Эта публикация была первоначально опубликована автором в блоге pusher здесь.

Эта версия отредактирована для ясности и может отличаться от оригинальной публикации.

Добавить комментарий

Ваш адрес email не будет опубликован.