首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Python

Django Channel实时推送与聊天的示例代码

Posted in Python onApril 30, 2020

先来看一下最终的效果吧

Django Channel实时推送与聊天的示例代码

开始聊天，输入消息并点击发送消息就可以开始聊天了

Django Channel实时推送与聊天的示例代码

点击 “获取后端数据”开启实时推送

Django Channel实时推送与聊天的示例代码

先来简单了解一下 Django Channel

Channels是一个采用Django并将其功能扩展到HTTP以外的项目，以处理WebSocket，聊天协议，IoT协议等。它基于称为ASGI的Python规范构建。

它以Django的核心为基础，并在其下面分层了一个完全异步的层，以同步模式运行Django本身，但异步处理了连接和套接字，并提供了以两种方式编写的选择，从而实现了这一点。

详情请参考官方文档：https://channels.readthedocs.io/en/latest/introduction.html

再简单说下ASGI是什么东东吧

ASGI 由 Django 团队提出，为了解决在一个网络框架里（如 Django）同时处理 HTTP、HTTP2、WebSocket 协议。为此，Django 团队开发了 Django Channels 插件，为 Django 带来了 ASGI 能力。
在 ASGI 中，将一个网络请求划分成三个处理层面，最前面的一层，interface server（协议处理服务器），负责对请求协议进行解析，并将不同的协议分发到不同的 Channel（频道）；频道属于第二层，通常可以是一个队列系统。频道绑定了第三层的 Consumer（消费者）。

详情请参考官方文档：https://channels.readthedocs.io/en/latest/asgi.html

下边来说一下具体的实现步骤

一、安装channel

pip3 install channels 
pip3 install channels_redis

二、新建Django项目

1.新建项目

django-admin startproject mysite

2.新建应用

python3 manage.py startapp chat

3.编辑mysite/settings.py文件

#注册应用
INSTALLED_APPS = [
  ....
  'chat.apps.ChatConfig',
  "channels",
]

# 在文件尾部新增如下配置

#将ASGI_APPLICATION设置设置为指向该路由对象作为您的根应用程序：
ASGI_APPLICATION = 'mysite.routing.application'

#配置Redis
CHANNEL_LAYERS = {
  'default': {
    'BACKEND': 'channels_redis.core.RedisChannelLayer',
    'CONFIG': {
      "hosts": [('10.0.6.29', 6379)],
    },
  },
}

三、详细代码与配置

1. 添加索引视图的模板

在chat目录中创建一个templates目录。在您刚刚创建的templates目录中，创建另一个名为的目录chat，并在其中创建一个名为的文件index.html以保存索引视图的模板

将以下代码放入chat/templates/chat/index.html

<!-- chat/templates/chat/index.html -->
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>Chat Rooms</title>
</head>
<body>
  What chat room would you like to enter?<br>
  <input id="room-name-input" type="text" size="100"><br>
  <input id="room-name-submit" type="button" value="Enter">

  <script>
    document.querySelector('#room-name-input').focus();
    document.querySelector('#room-name-input').onkeyup = function(e) {
      if (e.keyCode === 13) { // enter, return
        document.querySelector('#room-name-submit').click();
      }
    };

    document.querySelector('#room-name-submit').onclick = function(e) {
      var roomName = document.querySelector('#room-name-input').value;
      window.location.pathname = '/chat/' + roomName + '/';
    };
  </script>
</body>
</html>

2.创建聊天与消息推送模板

chat/templates/chat/room.html

<!DOCTYPE html>
<html>
<head>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.0/jquery.min.js" type="text/javascript"></script>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="external nofollow" >
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
  <meta charset="utf-8"/>
  <title>Chat Room</title>
</head>
<body>
<textarea id="chat-log" cols="150" rows="30" class="text"></textarea><br>
<input id="chat-message-input" type="text" size="150"><br>
<input id="chat-message-submit" type="button" value="发送消息" class="input-sm">
<button id="get_data" class="btn btn-success">获取后端数据</button>
{{ room_name|json_script:"room-name" }}

<script>

  $("#get_data").click(function () {
    $.ajax({
      url: "{% url 'push' %}",
      type: "GET",
      data: {
        "room": "{{ room_name }}",
        "csrfmiddlewaretoken": "{{ csrf_token }}"
      },
    })
  });

  const roomName = JSON.parse(document.getElementById('room-name').textContent);
  const chatSocket = new WebSocket(
    'ws://' + window.location.host
    + '/ws/chat/'
    + roomName + '/'
  );
  let chatSocketa = new WebSocket(
    "ws://" + window.location.host + "/ws/push/" + roomName
  );
  chatSocket.onmessage = function (e) {
    const data = JSON.parse(e.data);
    // data 为收到后端发来的数据
    //console.log(data);
    document.querySelector('#chat-log').value += (data.message + '\n');
  };
  chatSocketa.onmessage = function (e) {
    let data = JSON.parse(e.data);
    //let message = data["message"];
    document.querySelector("#chat-log").value += (data.message + "\n");
  };


  chatSocket.onclose = function (e) {
    console.error('Chat socket closed unexpectedly');
  };
  chatSocketa.onclose = function (e) {
    console.error("Chat socket closed unexpectedly");
  };
  document.querySelector('#chat-message-input').focus();
  document.querySelector('#chat-message-input').onkeyup = function (e) {
    if (e.keyCode === 13) { // enter, return
      document.querySelector('#chat-message-submit').click();
    }
  };

  document.querySelector('#chat-message-submit').onclick = function (e) {
    const messageInputDom = document.querySelector('#chat-message-input');
    const message = messageInputDom.value;
    chatSocket.send(JSON.stringify({
      'message': message
    }));
    messageInputDom.value = '';
  };
</script>
</body>
</html>

3.创建房间的视图

将以下代码放入chat/views.py

# chat/views.py
from django.shortcuts import render
from django.http import JsonResponse
from channels.layers import get_channel_layer
from asgiref.sync import async_to_sync


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


def room(request, room_name):
  return render(request, "chat/room.html", {"room_name": room_name})


def pushRedis(request):
  room = request.GET.get("room")
  print(room)

  def push(msg):
    channel_layer = get_channel_layer()
    async_to_sync(channel_layer.group_send)(
      room,
      {"type": "push.message", "message": msg, "room_name": room}
    )

  push("推送测试", )
  return JsonResponse({"1": 1})

4. 创建项目二级路由

在chat目录下创建一个名为的文件urls.py

# mysite/chat/urls.py
from django.urls import path
from . import views

urlpatterns = [
  path('', views.index, name='index'),
 path('<str:room_name>/', views.room, name='room'),
]

5. 修改根路由

# mysite/urls.py

from django.contrib import admin
from django.urls import path, include
from chat.views import pushRedis

urlpatterns = [
  path('admin/', admin.site.urls),
  path("chat/", include("chat.urls")),
  path("push", pushRedis, name="push"),
]

6.创建一个消费者

文件chat/consumers.py

当Django接受HTTP请求时，它会查询根URLconf来查找视图函数，然后调用该视图函数来处理该请求。同样，当Channels接受WebSocket连接时，它会查询根路由配置以查找使用者，然后在使用者上调用各种功能来处理来自连接的事件。

import time
import json
from channels.generic.websocket import WebsocketConsumer, AsyncWebsocketConsumer
from asgiref.sync import async_to_sync
import redis

pool = redis.ConnectionPool(
  host="10.0.6.29",
  port=6379,
  max_connections=10,
  decode_response=True,
)
conn = redis.Redis(connection_pool=pool, decode_responses=True)


class ChatConsumer(AsyncWebsocketConsumer):
  async def connect(self, ):
    self.room_name = self.scope["url_route"]["kwargs"]["room_name"]
    self.room_group_name = "chat_%s" % self.room_name

    await self.channel_layer.group_add(
      self.room_group_name,
      self.channel_name,
    )
    await self.accept()

  async def disconnect(self, close_code):
    print("close_code: ", close_code)
    await self.channel_layer.group_discard(
      self.room_group_name,
      self.channel_name
    )

  async def receive(self, text_data=None, bytes_data=None):
    text_data_json = json.loads(text_data)
    message = text_data_json["message"]
    print("receive_message：", message)
    await self.channel_layer.group_send(
      self.room_group_name,
      {
        "type": "chat_message",
        "message": message
      }
    )

  async def chat_message(self, event):
    receive_message = event["message"]
    response_message = "You message is :" + receive_message
    await self.send(text_data=json.dumps({
      "message": response_message
    }))


class PushMessage(WebsocketConsumer):

  def connect(self):
    self.room_group_name = self.scope["url_route"]["kwargs"]["room_name"]
    async_to_sync(self.channel_layer.group_add)(
      self.room_group_name,
      self.channel_name
    )
    self.accept()

  def disconnect(self, code):
    async_to_sync(self.channel_layer.group_discard)(
      self.room_group_name,
      self.channel_name
    )

  def push_message(self, event):
    """
    主动推送
    :param event:
    :return:
    """
    print(event, type(event))
    while True:
      time.sleep(2)
      msg = time.strftime("%Y-%m-%d %H:%M:%S") + "--- room_name: %s" % event["room_name"]
      self.send(text_data=json.dumps(
        {"message": msg}
      ))

7.为项目添加websocket的路由配置

在chat目录下创建一个名为的文件routing.py

# mysite/chat/routing.py

from django.urls import re_path, path
from . import consumers

websocket_urlpatterns = [
  re_path(r"ws/chat/(?P<room_name>\w+)/$", consumers.ChatConsumer),
  path("ws/push/<room_name>", consumers.PushMessage),
]

8.配置websocket根路由

与setting同级目录新建ws根路由文件 routing.py

from channels.routing import ProtocolTypeRouter, URLRouter
from channels.auth import AuthMiddlewareStack
import chat.routing

application = ProtocolTypeRouter({
  "websocket": AuthMiddlewareStack(
    URLRouter(
      chat.routing.websocket_urlpatterns
    )
  ),
})

9.最终的文件关系如下图

Django Channel实时推送与聊天的示例代码

10.启动服务

python3 manage.py runserver 10.0.6.2:80

注意看，这和django是不一样的

Django Channel实时推送与聊天的示例代码

还有另一种更稳健的启动方式

和setting同级新增文件 asgi.py

import os
import django
from channels.routing import get_default_application

os.environ.setdefault("DJANGO_SETTINGS_MODULE", "mysite.settings")
django.setup()
application = get_default_application()

启动方式为：

daphne -b 10.0.6.2 -p 80 mysite.asgi:application

daphne 在安装channel时已经自动安装好了

Django Channel实时推送与聊天的示例代码

参考：

https://channels.readthedocs.io/en/latest/tutorial/index.html

https://blog.ernest.me/post/asgi-demonstration-realtime-blogging

到此这篇关于Django Channel实时推送与聊天的示例代码的文章就介绍到这了,更多相关Django Channel实时推送与聊天内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木！

Django Channel实时推送与聊天的示例代码

- Author -

Sunzz

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Python 相关文章推荐
基于Python 的进程管理工具supervisor使用指南
Sep 18 Python
Python使用defaultdict读取文件各列的方法
May 11 Python
python 实现上传图片并预览的3种方法(推荐)
Jul 14 Python
python中使用xlrd读excel使用xlwt写excel的实例代码
Jan 31 Python
Python使用add_subplot与subplot画子图操作示例
Jun 01 Python
python range()函数取反序遍历sequence的方法
Jun 25 Python
python实现邮件发送功能
Aug 10 Python
django在保存图像的同时压缩图像示例代码详解
Feb 11 Python
详解Django配置JWT认证方式
May 09 Python
Django与AJAX实现网页动态数据显示的示例代码
Feb 24 Python
Django给表单添加honeypot验证增加安全性
May 06 Python
Python基础知识学习之类的继承
May 31 Python
Django ORM 查询表中某列字段值的方法
Apr 30 #Python
Python pip install如何修改默认下载路径
Apr 29 #Python
Django 5种类型Session使用方法解析
Apr 29 #Python
PyQt5连接MySQL及QMYSQL driver not loaded错误解决
Apr 29 #Python
Python退出时强制运行一段代码的实现方法
Apr 29 #Python
pyinstaller将含有多个py文件的python程序做成exe
Apr 29 #Python
如何使用python切换hosts文件
Apr 29 #Python
泰国购物网站(30) 荷兰购物网站(99) 芬兰购物网站(10) 南非购物网站(8) 土耳其购物网站(10) 欧洲购物网站(15) 哥伦比亚购物网站(5) 瑞典购物网站(55) 比利时购物网站(33) 葡萄牙购物网站(13)
You might like
php获取远程图片体积大小的实例
2013/11/12 PHP
php邮箱地址正则表达式验证
2015/11/13 PHP
javaScript Array（数组）相关方法简述
2009/07/25 Javascript
onsubmit阻止form表单提交与onclick的相关操作
2010/09/03 Javascript
js读取配置文件自写
2014/02/11 Javascript
生成二维码方法汇总
2014/12/26 Javascript
JS动态修改iframe内嵌网页地址的方法
2015/04/01 Javascript
Jquery实现弹性滑块滑动选择数值插件
2015/08/08 Javascript
js实现图片上传并正常显示
2015/12/19 Javascript
Winform客户端向web地址传参接收参数的方法
2016/05/17 Javascript
关于vue中的ajax请求和axios包问题
2018/04/19 Javascript
JavaScript数组方法的错误使用例子
2018/09/13 Javascript
js+springMVC 提交数组数据到后台的实例
2019/09/21 Javascript
vue自定义标签和单页面多路由的实现代码
2020/05/03 Javascript
Python 字符串操作方法大全
2014/03/11 Python
Python基于动态规划算法计算单词距离
2015/07/25 Python
Python抓取框架Scrapy爬虫入门：页面提取
2017/12/01 Python
ERLANG和PYTHON互通实现过程详解
2019/07/05 Python
python实现DEM数据的阴影生成的方法
2019/07/23 Python
Python学习笔记之Django创建第一个数据库模型的方法
2019/08/07 Python
HTML5 用动画的表现形式装载图像
2016/03/08 HTML / CSS
HTML5 File接口在web页面上使用文件下载
2017/02/27 HTML / CSS
HTML5学习心得总结(推荐)
2016/07/08 HTML / CSS
美国知名日用品连锁超市：Dollar General(多来店)
2017/01/14 全球购物
黑猩猩商店：The Chimp Store
2020/02/12 全球购物
乌克兰数字设备、配件和智能技术的连锁商店：KTC
2020/08/18 全球购物
C#里面可以避免一个类被其他类继承么？如何？
2013/09/26 面试题
大学生职业生涯规划范文——找准自我，定位人生
2014/01/23 职场文书
安全大检查实施方案
2014/02/22 职场文书
门前三包责任书
2014/04/15 职场文书
教师三严三实对照检查材料
2014/09/25 职场文书
2014乡镇党委副书记对照检查材料思想汇报
2014/10/09 职场文书
2015年基层党建工作总结
2015/05/14 职场文书
感谢信的技巧及范例
2019/05/15 职场文书
MySQL系列之二 多实例配置
2021/07/02 MySQL
一起来看看Vue的核心原理剖析
2022/03/24 Vue.js