Django实现WebSocket在线聊天室功能(channels库) Django实现WebSocket在线聊天室功

1.Django实现WebSocket在线聊天室 1.1 安装

pip install channels==2.3

(saas) F:\Desktop\Python_Study\CHS-Tracer\saas>pip install channels==2.3
Looking in indexes: http://mirrors.aliyun.com/pypi/simple/
Collecting channels==2.3
Downloading
...
Successfully installed Automat-20.2.0 attrs-20.3.0 autobahn-21.3.1 channels-2.3.0

1.2 创建Django项目
1.3 http路由

url(r"^chat/$", chat_view.chat, name="chat"),# 聊天室

【Django实现WebSocket在线聊天室功能(channels库)】1.4 http视图函数

def chat(request):
return render(request, "chat.html")

1.5 settings添加channels相关配置

INSTALLED_APPS = ['channels',# 项目中要使用channels做WebSocket了]ASGI_APPLICATION = "saas.routing.application" # 项目名.routing.application

1.6 创建routing.py（websocket的路由）和comsumers.py（websocket的视图函数）

文章图片

文章图片

1.7 websocket路由

# -*- coding:utf-8 -*-# 作者：IT小学生蔡坨坨# 时间：2021/4/23 18:21# 功能：channels相关路由from channels.routing import ProtocolTypeRouter, URLRouterfrom django.conf.urls import urlfrom web import consumersapplication = ProtocolTypeRouter({"websocket": URLRouter([url(r'^chat/$', consumers.ChatConsumer),])})

1.8 websocket视图函数

# -*- coding:utf-8 -*-# 作者：IT小学生蔡坨坨# 时间：2021/4/23 18:25# 功能：channels相关视图from channels.exceptions import StopConsumerfrom channels.generic.websocket import WebsocketConsumer# 定义一个列表，用于存放当前在线的用户CONSUMER_OBJECT_LIST = []class ChatConsumer(WebsocketConsumer):def websocket_connect(self, message):"""客户端浏览器发来连接请求之后就会被触发:param message::return:"""# 服务端接收连接，向客户端浏览器发送一个加密字符串self.accept()# 连接成功CONSUMER_OBJECT_LIST.append(self)def websocket_receive(self, message):"""客户端浏览器向服务端发送消息，此方法自动触发:param message::return:"""print("接受到消息了。", message)# 服务端给客户端回一条消息# self.send(text_data=https://www.it610.com/article/message["text"])for obj in CONSUMER_OBJECT_LIST:obj.send(text_data=https://www.it610.com/article/message["text"])def websocket_disconnect(self, message):"""客户端浏览器主动断开连接:param message::return:"""# 服务端断开连接CONSUMER_OBJECT_LIST.remove(self)raise StopConsumer()

1.9 前端代码

pre {display: block; padding: 9.5px; margin: 0 0 10px; font-size: 18px; line-height: 1.42857143; color: #333; word-break: break-all; word-wrap: break-word; background-color: #00aaaa; border-radius: 12px; }在线实时聊天室匿名用户：

2.效果展示