Django es un poderoso framework de Python para el desarrollo web. Es rápido, seguro y confiable. Los canales permiten que los proyectos de Django manejen HTTP junto con protocolos asíncronos como WebSockets, MQTT, chatbots y más.
Canales:
Los canales preservan el comportamiento síncrono de Django y agregan una capa de protocolos asíncronos que permiten a los usuarios escribir las vistas que son completamente síncronas, asíncronas o una combinación de ambas. Básicamente, los canales permiten que la aplicación admita «conexiones de larga duración». Reemplaza el WSGI predeterminado de Django con su ASGI .
ASGI:
ASGI (Interfaz de puerta de enlace de servidor asíncrono) proporciona una interfaz entre aplicaciones y servidores web Python asíncronos mientras admite todas las características proporcionadas por WSGI.
Consumidores:
Un consumidor es una unidad básica de Canales. Es una clase basada en eventos que admite aplicaciones asíncronas y sincronizadas. Los consumidores pueden ejecutar más tiempo y, por lo tanto, admiten sockets web que necesitan una conexión persistente.
En esta publicación, configuraremos un ejemplo básico de canales. Construiremos una aplicación de calculadora que permitirá al usuario enviar múltiples expresiones al servidor y recibir el resultado a través de una única conexión persistente.
Configuración del entorno:
- Siempre es una buena idea crear un entorno virtual para las aplicaciones de Python para evitar conflictos de versiones. Ejecute los siguientes comandos en la terminal para comenzar
easy-install pip python3 -m pip install virtualenv virtualenv venv source venv/bin/activate
- Ahora instala Django y Canales :
pip install django pip install channels # On windows, try an unofficial wheel of 'Twisted' in case of dependency errors
Aplicación LiveCalculator:
Ahora inicie un proyecto Django y cree una aplicación llamada ‘liveCalculator’
django-admin startproject sampleProject cd sampleProject python3 manage.py startapp liveCalculator
En sampleProject/settings.py , registre canales y liveCalculator .
configuración.py:
INSTALLED_APPS = [ 'channels', 'liveCalculator', 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', ]
En sampleProject/asgi.py, agregue el protocolo http.
asgi.py:
Python3
import os
import django
from channels.http import AsgiHandler
from channels.routing import ProtocolTypeRouter
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'sampleProject.settings')
django.setup()
application = ProtocolTypeRouter({
"http": AsgiHandler(),
# Just HTTP for now. (We can add other protocols later.)
})
Ahora necesitamos registrar este asgi en nuestra aplicación. Agregue esta línea en sampleProject/settings.py:
ASGI_APPLICATION = "sampleProject.asgi.application"
Cree una nueva carpeta liveCalculator/templates/liveCalculator y cree un nuevo archivo index.html dentro de ella. Será la página de inicio de nuestra aplicación. Agregue el siguiente código en index.html:
índice.html:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Live Calculator</title>
</head>
<body>
<textarea name="ta" id="results" cols="30" rows="10">
</textarea><br>
Enter the expression: <input type="text" id="exp">
<input type="button" id="submit" value="Get Results">
<script>
const socket = new WebSocket('ws://localhost:8000/ws/livec/');
socket.onmessage = (e) => {
result = JSON.parse(e.data).result;
document.getElementById("results").value += "Server: " + result + "\n";
}
socket.onclose = (e) => {
console.log("Socket closed!");
}
document.querySelector('#exp').onkeyup = function (e) {
if (e.keyCode === 13) { // enter, return
document.querySelector('#submit ').click();
}
};
document.querySelector("#submit").onclick = (e) => {
inputfield = document.querySelector("#exp")
exp = inputfield.value
socket.send(JSON.stringify(
{
expression: exp
}
))
document.querySelector("#results").value += "You: " + exp + "\n";
inputfield.value = "";
}
</script>
</body>
</html>
El código anterior generará un área de texto y un cuadro de entrada donde el usuario puede ingresar la expresión. Creará una conexión de socket que haremos más tarde y agregará el resultado recibido en el área de texto. Cuando el usuario ingrese la expresión, enviará la expresión a través de una conexión de socket.
Ahora cree una vista para representar esta página en liveCalculator/views.py :
calculadora en vivo/vistas.py:
Python3
from django.shortcuts import render
# Create your views here.
def index(request):
return render(request, 'liveCalculator/index.html', {})
A continuación, necesitamos crear una ruta para esta vista. Agregue un nuevo archivo urls.py en el directorio liveCalculator y agregue el siguiente código:
liveCalculator/urls.py:
Python3
from django.conf.urls import url from . import views urlpatterns = [ url(r'^$', views.index, name="index"), ]
Registre esta ruta en sampleProject/urls.py :
ejemploProyecto/urls.py:
Python3
from django.contrib import admin
from django.urls import path
from django.conf.urls import include, url
urlpatterns = [
path('admin/', admin.site.urls),
url(r'^', include('liveCalculator.urls'))
]
Ahora necesitamos crear el consumidor para nuestra conexión de socket web. Usaremos la clase genérica WebsocketConsumer para implementar sus métodos basados en eventos. Cree un nuevo archivo consumer.py en la carpeta liveCalculator y agregue el siguiente código:
consumidores.py:
Python3
import json
from channels.generic.websocket import WebsocketConsumer
class Calculator(WebsocketConsumer):
def connect(self):
self.accept()
def disconnect(self, close_code):
self.close()
def receive(self, text_data):
text_data_json = json.loads(text_data)
expression = text_data_json['expression']
try:
result = eval(expression)
except Exception as e:
result = "Invalid Expression"
self.send(text_data=json.dumps({
'result': result
}))
La clase WebsocketConsumer admite estos métodos definidos por el usuario:
- connect() : Podemos escribir la lógica comercial de lo que debería suceder cuando el cliente envía una solicitud de conexión.
- desconectar() : podemos escribir la lógica comercial de lo que debería suceder cuando el cliente envía una solicitud de desconexión.
- recibir(): podemos escribir la lógica comercial de lo que debería suceder cuando el cliente envía un mensaje.
También es compatible con estos métodos integrados:
- accept(): Aceptará la conexión entrante.
- close(): Cerrará la conexión actual.
- send(): Enviará el mensaje especificado al cliente.
Simplemente hemos utilizado los métodos anteriores en nuestra clase Calculadora para aceptar la conexión, evaluar la expresión cuando se recibe un mensaje y enviarlo al cliente.
A continuación, también debemos definir el método de enrutamiento para este consumidor. Cree un nuevo archivo routing.py en la misma carpeta y agréguele el siguiente código:
enrutamiento.py:
Python3
from django.urls import re_path from . import consumers websocket_urlpatterns = [ re_path(r'ws/livec/$', consumers.Calculator.as_asgi()), ]
Tenga en cuenta que hemos usado el método as_asgi() en nuestra clase Calculadora para usarlo en nuestra aplicación. Esto habilitará el socket en ws://<IP:Port>/ws/livec . Ahora registre routing.py en asgi.py declarando el protocolo WebSocket .
asgi.py:
Python3
import os
from channels.auth import AuthMiddlewareStack
from channels.routing import ProtocolTypeRouter, URLRouter
from django.core.asgi import get_asgi_application
import liveCalculator.routing
os.environ.setdefault("DJANGO_SETTINGS_MODULE", "sampleProject.settings")
application = ProtocolTypeRouter({
"http": get_asgi_application(),
"websocket": AuthMiddlewareStack(
URLRouter(
liveCalculator.routing.websocket_urlpatterns
)
),
})
Casi hemos terminado con nuestra primera aplicación de Canales. Guarde todos los archivos y ejecute los siguientes comandos en la terminal:
python3 manage.py makemigrations python3 manage.py migrate python3 manage.py runserver
Ahora abra http://localhost:8000 en su navegador, y debería ver el resultado como este:
Ver el registro del servidor. Tenga en cuenta que hemos creado la conexión solo una vez y podemos enviar el mensaje varias veces sin crear una nueva conexión.
Publicación traducida automáticamente
Artículo escrito por mukulbindal170299 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA