Web Development with Python: Websockets in Django

Introduction
Prerequisites
Setup
Creating a Django Project
Installing Django Channels
Creating a WebSocket Consumer
Routing WebSockets
Sending and Receiving Messages
Running the Server
Conclusion

Introduction

Python is a versatile language that can be used for a wide range of applications, including web development. In this tutorial, we will explore how to use websockets in Django, a popular web framework in Python. Websockets enable real-time communication between clients and servers, allowing for interactive applications such as chats, notifications, and collaborative editors.

By the end of this tutorial, you will have a basic understanding of websockets and how to implement them in Django using the Django Channels library.

Prerequisites

Before starting this tutorial, you should have:

Python installed on your machine (preferably Python 3)
Familiarity with the basic concepts of Django
Basic knowledge of HTML, CSS, and JavaScript

Setup

To get started, we need to set up a new Django project and install the necessary dependencies.

Creating a Django Project

Open a terminal or command prompt.
Navigate to the directory where you want to create your project.
Run the following command to create a new Django project:
```
 django-admin startproject websocket_project
```
This will create a new directory named websocket_project with the basic structure of a Django project.

Installing Django Channels

Django Channels is a third-party library that adds support for websockets to Django. To install it, follow these steps:

Activate your virtual environment (if you are using one).
Run the following command to install Django Channels:
```
 pip install channels
```
Creating a WebSocket Consumer

In Django Channels, a websocket consumer is a Python class that handles websocket connections and messages. Let’s create a simple websocket consumer to demonstrate the basic functionality.

Inside the websocket_project directory, create a new directory named chat.
Inside the chat directory, create a new file named consumers.py.
Open consumers.py and add the following code:
```
 from channels.generic.websocket import AsyncWebsocketConsumer
	
 class ChatConsumer(AsyncWebsocketConsumer):
     async def connect(self):
         await self.accept()
	
     async def disconnect(self, close_code):
         pass
```
In this code, we import the AsyncWebsocketConsumer class from channels.generic.websocket and define a new class ChatConsumer. This class inherits from AsyncWebsocketConsumer and defines two methods: connect and disconnect. The connect method is called when a websocket connection is established, and the disconnect method is called when the connection is closed.

Routing WebSockets

To route websocket connections to the appropriate consumer, we need to create a routing.py file.

Inside the chat directory, create a new file named routing.py.
Open routing.py and add the following code:
```
 from django.urls import re_path
	
 from . import consumers
	
 websocket_urlpatterns = [
     re_path(r'ws/chat/$', consumers.ChatConsumer.as_asgi()),
 ]
```
In this code, we import the re_path function from django.urls and the ChatConsumer class from the consumers module. We define a list named websocket_urlpatterns that contains a single URL pattern. This pattern maps any websocket connection to the ChatConsumer class.

Sending and Receiving Messages

Now that we have set up the basic structure, let’s implement the functionality to send and receive messages through websockets.

Open consumers.py and modify the ChatConsumer class as follows:

 from channels.generic.websocket import AsyncWebsocketConsumer
	
 class ChatConsumer(AsyncWebsocketConsumer):
     async def connect(self):
         self.room_name = 'default'
         self.room_group_name = f'chat_{self.room_name}'
	
         # Join room group
         await self.channel_layer.group_add(
             self.room_group_name,
             self.channel_name
         )
	
         await self.accept()
	
     async def disconnect(self, close_code):
         # Leave room group
         await self.channel_layer.group_discard(
             self.room_group_name,
             self.channel_name
         )
	
     async def receive(self, text_data):
         # Receive message from WebSocket
         await self.channel_layer.group_send(
             self.room_group_name,
             {
                 'type': 'chat_message',
                 'message': text_data
             }
         )
	
     async def chat_message(self, event):
         # Send message to WebSocket
         await self.send(text_data=event['message'])

In this updated code, we have added the following functionality:

When a websocket connection is established (connect method), we join a room group identified by the room_name. The room_group_name is composed of the string 'chat_' followed by the room_name.
When a websocket connection is closed (disconnect method), we leave the room group.
When a message is received through the websocket (receive method), we send the message to all the connections in the room group.
Finally, we define a new method chat_message that sends the received message back to the individual websocket connection.

Running the Server

To test our websocket functionality, we need to run the Django development server.

Open a terminal or command prompt.
Navigate to the websocket_project directory.
Run the following command:
```
 python manage.py runserver
```
This will start the development server on http://127.0.0.1:8000/.

Conclusion

In this tutorial, we have learned how to use websockets in Django using the Django Channels library. We have covered the basics of creating a websocket consumer, routing websockets, and sending/receiving messages. With this knowledge, you can start building real-time applications that require interactive communication between clients and servers.

Remember to explore the Django Channels documentation to discover more advanced features and possibilities.

Published: 11 December 2019