Pierwsze kroki z kanałami Django

UWAGA: Spróbuj użyć michael jako nazwę użytkownika i johnson123 jako hasło.

sign_up widok przekierowuje nas do log_in widoku i stamtąd możemy uwierzytelnić naszego nowo utworzonego użytkownika.

Po zalogowaniu możemy przetestować nasze nowe widoki uwierzytelniania.

Skorzystaj z formularza rejestracji, aby utworzyć kilku nowych użytkowników w ramach przygotowań do następnej sekcji.

Alerty logowania

Mamy działające podstawowe uwierzytelnianie użytkowników, ale nadal musimy wyświetlać listę użytkowników i potrzebujemy, aby serwer informował grupę, kiedy użytkownik się loguje i wylogowuje. Musimy edytować nasze funkcje konsumenckie, aby wysyłali wiadomość zaraz po klient łączy się i tuż przed rozłączeniem klienta. Dane wiadomości będą zawierać nazwę użytkownika i stan połączenia.

Zaktualizuj example_channels/example/consumers.py tak:

import json
from channels import Group
from channels.auth import channel_session_user, channel_session_user_from_http


@channel_session_user_from_http
def ws_connect(message):
    Group('users').add(message.reply_channel)
    Group('users').send({
        'text': json.dumps({
            'username': message.user.username,
            'is_logged_in': True
        })
    })


@channel_session_user
def ws_disconnect(message):
    Group('users').send({
        'text': json.dumps({
            'username': message.user.username,
            'is_logged_in': False
        })
    })
    Group('users').discard(message.reply_channel)

Zauważ, że dodaliśmy dekoratory do funkcji, aby pobrać użytkownika z sesji Django. Ponadto wszystkie wiadomości muszą być możliwe do serializacji w formacie JSON, więc zrzucamy nasze dane do ciągu JSON.

Następnie zaktualizuj example_channels/example/templates/example/user_list.html :

{% extends 'example/_base.html' %}

{% block content %}
  <a href="{% url 'example:log_out' %}">Log out</a>
  <br>
  <ul>
    {% for user in users %}
      <!-- NOTE: We escape HTML to prevent XSS attacks. -->
      <li data-username="{{ user.username|escape }}">
        {{ user.username|escape }}: {{ user.status|default:'Offline' }}
      </li>
    {% endfor %}
  </ul>
{% endblock content %}

{% block script %}
  <script>
    var socket = new WebSocket('ws://' + window.location.host + '/users/');

    socket.onopen = function open() {
      console.log('WebSockets connection created.');
    };

    socket.onmessage = function message(event) {
      var data = JSON.parse(event.data);
      // NOTE: We escape JavaScript to prevent XSS attacks.
      var username = encodeURI(data['username']);
      var user = $('li').filter(function () {
        return $(this).data('username') == username;
      });

      if (data['is_logged_in']) {
        user.html(username + ': Online');
      }
      else {
        user.html(username + ': Offline');
      }
    };

    if (socket.readyState == WebSocket.OPEN) {
      socket.onopen();
    }
  </script>
{% endblock script %}

Na naszej stronie głównej rozszerzamy naszą listę użytkowników, aby wyświetlić listę użytkowników. Przechowujemy nazwę użytkownika każdego użytkownika jako atrybut danych, aby ułatwić znalezienie elementu użytkownika w DOM. Do naszego WebSocket dodajemy również detektor zdarzeń, który może obsługiwać komunikaty z serwera. Po otrzymaniu wiadomości analizujemy dane JSON, znajdujemy <li> elementu dla danego użytkownika i zaktualizuj status tego użytkownika.

Django nie śledzi, czy użytkownik jest zalogowany, więc musimy stworzyć prosty model, który zrobi to za nas. Utwórz LoggedInUser model z połączeniem jeden do jednego z naszym User model w example_channels/example/models.py :

from django.conf import settings
from django.db import models


class LoggedInUser(models.Model):
    user = models.OneToOneField(
        settings.AUTH_USER_MODEL, related_name='logged_in_user')

Nasza aplikacja utworzy LoggedInUser wystąpienie, gdy użytkownik się zaloguje, a aplikacja usunie to wystąpienie, gdy użytkownik się wyloguje.

Dokonaj migracji schematu, a następnie zmigruj naszą bazę danych, aby zastosować zmiany.

(env)$ python manage.py makemigrations
(env)$ python manage.py migrate

Następnie zaktualizuj nasz widok listy użytkowników w example_channels/example/views.py , aby pobrać listę użytkowników do renderowania:

from django.contrib.auth import get_user_model, login, logout
from django.contrib.auth.decorators import login_required
from django.contrib.auth.forms import AuthenticationForm, UserCreationForm
from django.core.urlresolvers import reverse
from django.shortcuts import render, redirect


User = get_user_model()


@login_required(login_url='/log_in/')
def user_list(request):
    """
    NOTE: This is fine for demonstration purposes, but this should be
    refactored before we deploy this app to production.
    Imagine how 100,000 users logging in and out of our app would affect
    the performance of this code!
    """
    users = User.objects.select_related('logged_in_user')
    for user in users:
        user.status = 'Online' if hasattr(user, 'logged_in_user') else 'Offline'
    return render(request, 'example/user_list.html', {'users': users})


def log_in(request):
    form = AuthenticationForm()
    if request.method == 'POST':
        form = AuthenticationForm(data=request.POST)
        if form.is_valid():
            login(request, form.get_user())
            return redirect(reverse('example:user_list'))
        else:
            print(form.errors)
    return render(request, 'example/log_in.html', {'form': form})


@login_required(login_url='/log_in/')
def log_out(request):
    logout(request)
    return redirect(reverse('example:log_in'))


def sign_up(request):
    form = UserCreationForm()
    if request.method == 'POST':
        form = UserCreationForm(data=request.POST)
        if form.is_valid():
            form.save()
            return redirect(reverse('example:log_in'))
        else:
            print(form.errors)
    return render(request, 'example/sign_up.html', {'form': form})

Jeśli użytkownik ma powiązanego LoggedInUser , wtedy rejestrujemy status użytkownika jako „Online”, a jeśli nie, użytkownik jest „Offline”. Dodajemy również @login_required dekorator zarówno do naszej listy użytkowników, jak i do widoku wylogowania, aby ograniczyć dostęp tylko do zarejestrowanych użytkowników.

Dodaj również importy:

from django.contrib.auth import get_user_model, login, logout
from django.contrib.auth.decorators import login_required

W tym momencie użytkownicy mogą się logować i wylogowywać, co spowoduje, że serwer będzie wysyłać wiadomości do klienta, ale nie mamy możliwości sprawdzenia, którzy użytkownicy są zalogowani, gdy użytkownik loguje się po raz pierwszy. Użytkownik widzi aktualizacje tylko wtedy, gdy inny użytkownik zmiany statusu. To tutaj LoggedInUser wchodzi w grę, ale potrzebujemy sposobu na utworzenie LoggedInUser na przykład, gdy użytkownik się zaloguje, a następnie usuń go, gdy ten się wyloguje.

Biblioteka Django zawiera funkcję znaną jako sygnały, która emituje powiadomienia, gdy wystąpią określone działania. Aplikacje mogą nasłuchiwać tych powiadomień, a następnie na nich działać. Możemy wykorzystać dwa pomocne, wbudowane sygnały (user_logged_in i user_logged_out ) do obsługi naszego LoggedInUser zachowanie.

W obrębie „example_channels/example” dodaj nowy plik o nazwie signals.py :

from django.contrib.auth import user_logged_in, user_logged_out
from django.dispatch import receiver
from example.models import LoggedInUser


@receiver(user_logged_in)
def on_user_login(sender, **kwargs):
    LoggedInUser.objects.get_or_create(user=kwargs.get('user'))


@receiver(user_logged_out)
def on_user_logout(sender, **kwargs):
    LoggedInUser.objects.filter(user=kwargs.get('user')).delete()

Musimy udostępnić sygnały w konfiguracji naszej aplikacji, example_channels/example/apps.py :

from django.apps import AppConfig


class ExampleConfig(AppConfig):
    name = 'example'

    def ready(self):
        import example.signals

Zaktualizuj example_channels/example/__init__.py a także:

default_app_config = 'example.apps.ExampleConfig'

Sprawdzenie stanu zdrowia

Teraz zakończyliśmy kodowanie i jesteśmy gotowi do połączenia się z naszym serwerem z wieloma użytkownikami w celu przetestowania naszej aplikacji.

Uruchom serwer Django, zaloguj się jako użytkownik i odwiedź stronę główną. Powinniśmy zobaczyć listę wszystkich użytkowników naszej aplikacji, każdy ze statusem „Offline”. Następnie otwórz nowe okno incognito, zaloguj się jako inny użytkownik i obejrzyj oba ekrany. Gdy się logujemy, zwykła przeglądarka aktualizuje status użytkownika na „Online”. Z naszego okna Incognito widzimy, że zalogowany użytkownik również ma status „Online”. Możemy przetestować WebSockets, logując się i wylogowując na naszych różnych urządzeniach z różnymi użytkownikami.

Obserwując konsolę programisty na kliencie i aktywność serwera w naszym terminalu, możemy potwierdzić, że połączenia WebSocket są tworzone podczas logowania użytkownika i niszczone, gdy użytkownik się wylogowuje.

[2017/02/20 00:15:23] HTTP POST /log_in/ 302 [0.07, 127.0.0.1:55393]
[2017/02/20 00:15:23] HTTP GET / 200 [0.04, 127.0.0.1:55393]
[2017/02/20 00:15:23] WebSocket HANDSHAKING /users/ [127.0.0.1:55414]
[2017/02/20 00:15:23] WebSocket CONNECT /users/ [127.0.0.1:55414]
[2017/02/20 00:15:25] HTTP GET /log_out/ 302 [0.01, 127.0.0.1:55393]
[2017/02/20 00:15:26] HTTP GET /log_in/ 200 [0.02, 127.0.0.1:55393]
[2017/02/20 00:15:26] WebSocket DISCONNECT /users/ [127.0.0.1:55414]