Guida introduttiva ai canali Django

NOTA: Prova a utilizzare michael come nome utente e johnson123 come password.

La sign_up view ci reindirizza al log_in visualizzare e da lì possiamo autenticare il nostro utente appena creato.

Dopo aver effettuato l'accesso, possiamo testare le nostre nuove viste di autenticazione.

Usa il modulo di registrazione per creare diversi nuovi utenti in preparazione per la prossima sezione.

Avvisi di accesso

Abbiamo l'autenticazione utente di base funzionante, ma abbiamo ancora bisogno di visualizzare un elenco di utenti e abbiamo bisogno che il server comunichi al gruppo quando un utente si collega e si disconnette. Dobbiamo modificare le nostre funzioni consumer in modo che inviino un messaggio subito dopo un client si connette e subito prima che un client si disconnette. I dati del messaggio includeranno il nome utente dell'utente e lo stato della connessione.

Aggiorna canali_esempio/esempio/consumers.py così:

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)

Si noti che abbiamo aggiunto decoratori alle funzioni per ottenere l'utente dalla sessione di Django. Inoltre, tutti i messaggi devono essere serializzabili in JSON, quindi eseguiamo il dump dei nostri dati in una stringa JSON.

Quindi, aggiorna 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 %}

Sulla nostra homepage, espandiamo il nostro elenco di utenti per visualizzare un elenco di utenti. Memorizziamo il nome utente di ogni utente come attributo di dati per facilitare la ricerca dell'elemento utente nel DOM. Aggiungiamo anche un listener di eventi al nostro WebSocket in grado di gestire i messaggi dal server. Quando riceviamo un messaggio, analizziamo i dati JSON, troviamo il <li> elemento per l'utente specificato e aggiorna lo stato di quell'utente.

Django non tiene traccia se un utente ha effettuato l'accesso, quindi dobbiamo creare un modello semplice per farlo per noi. Crea un LoggedInUser modello con una connessione uno a uno al nostro User modello in 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')

La nostra app creerà un LoggedInUser istanza quando un utente effettua l'accesso e l'app eliminerà l'istanza quando l'utente si disconnette.

Effettua la migrazione dello schema e poi migra il nostro database per applicare le modifiche.

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

Quindi, aggiorna la nostra visualizzazione elenco utenti, inexample_channels/example/views.py , per recuperare un elenco di utenti di cui eseguire il rendering:

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})

Se un utente ha un LoggedInUser associato , quindi registriamo lo stato dell'utente come "Online" e, in caso contrario, l'utente è "Offline". Aggiungiamo anche un @login_required decorator sia al nostro elenco utenti che alle viste di disconnessione per limitare l'accesso solo agli utenti registrati.

Aggiungi anche le importazioni:

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

A questo punto, gli utenti possono effettuare l'accesso e la disconnessione, il che attiverà il server per inviare messaggi al client, ma non abbiamo modo di sapere quali utenti hanno effettuato l'accesso al primo accesso dell'utente. L'utente vede gli aggiornamenti solo quando un altro utente cambiamenti di stato. Qui è dove il LoggedInUser entra in gioco, ma abbiamo bisogno di un modo per creare un LoggedInUser esempio quando un utente effettua l'accesso, quindi eliminalo quando quell'utente si disconnette.

La libreria Django include una funzionalità nota come segnali che trasmette notifiche quando si verificano determinate azioni. Le applicazioni possono ascoltare tali notifiche e quindi agire su di esse. Possiamo sfruttare due utili segnali integrati (user_logged_in e user_logged_out ) per gestire il nostro LoggedInUser comportamento.

All'interno di "example_channels/example", aggiungi un nuovo file chiamato 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()

Dobbiamo rendere disponibili i segnali nella nostra configurazione dell'app, example_channels/example/apps.py :

from django.apps import AppConfig


class ExampleConfig(AppConfig):
    name = 'example'

    def ready(self):
        import example.signals

Aggiorna canali_esempio/esempio/__init__.py anche:

default_app_config = 'example.apps.ExampleConfig'

Controllo della sanità mentale

Ora abbiamo terminato la codifica e siamo pronti per connetterci al nostro server con più utenti per testare la nostra app.

Esegui il server Django, accedi come utente e visita la home page. Dovremmo vedere un elenco di tutti gli utenti nella nostra app, ciascuno con lo stato "Offline". Quindi, apri una nuova finestra di navigazione in incognito, accedi come un altro utente e guarda entrambe le schermate. Subito dopo l'accesso, il normale browser aggiorna lo stato dell'utente su "Online". Dalla nostra finestra di navigazione in incognito, vediamo che l'utente che ha effettuato l'accesso ha anche lo stato "Online". Possiamo testare i WebSocket effettuando l'accesso e la disconnessione sui nostri diversi dispositivi con vari utenti.

Osservando la console dello sviluppatore sul client e l'attività del server nel nostro terminale, possiamo confermare che le connessioni WebSocket vengono formate quando un utente effettua l'accesso e distrutte quando un utente si disconnette.

[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]