当前位置: 首页 > news >正文

在Django5中使用Websocket进行通信

Docker安装Redis

docker run --restart=always -p 6379:6379 --name redis -d redis:7.0.12  --requirepass zhangdapeng520

安装依赖

参考文档:https://channels.readthedocs.io/en/latest/installation.html

pip install "channels[daphne]"

展示聊天页面

新增:chat/templates/chat/index.html

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"/><title>Chat Rooms</title>
</head>
<body>请输入您要进入的房间名称<br><input id="room-name-input" type="text" size="100"><br><input id="room-name-submit" type="button" value="进入房间"><script>// 输入框聚焦document.querySelector('#room-name-input').focus();// 输入框按下enter键,相当于点击提交按钮document.querySelector('#room-name-input').onkeyup = function(e) {if (e.key === 'Enter') {document.querySelector('#room-name-submit').click();}};// 提交按钮点击document.querySelector('#room-name-submit').onclick = function(e) {// 获取房间名称const roomName = document.querySelector('#room-name-input').value;// 重定向到指定房间window.location.pathname = '/chat/' + roomName + '/';};</script>
</body>
</html>

修改:chat/views.py

from django.shortcuts import renderdef index(request):"""首页路由"""return render(request, "chat/index.html")

新增:chat/urls.py

from django.urls import pathfrom . import viewsurlpatterns = [path("", views.index, name="index"),
]

修改:Django5Websocket/urls.py

from django.contrib import admin
from django.urls import include, pathurlpatterns = [path("chat/", include("chat.urls")),path("admin/", admin.site.urls),
]

启动服务,浏览器访问:http://localhost:8000

建立Websocket服务

新增:chat/consumers.py

import jsonfrom channels.generic.websocket import WebsocketConsumerclass ChatConsumer(WebsocketConsumer):"""Websocket通信类"""def connect(self):"""建立连接"""self.accept()def disconnect(self, close_code):"""断开连接"""passdef receive(self, text_data):"""接收消息"""# 转换为JSON类型text_data_json = json.loads(text_data)# 提取消息message = text_data_json["message"]# 重新发送JSON文本消息self.send(text_data=json.dumps({"message": message}))

新增:chat/routing.py

from django.urls import re_pathfrom . import consumerswebsocket_urlpatterns = [# 定义websocket的连接re_path(r"ws/chat/(?P<room_name>\w+)/$", consumers.ChatConsumer.as_asgi()),
]

修改:Django5Websocket/wsgi.py

import os
from channels.auth import AuthMiddlewareStack
from channels.routing import ProtocolTypeRouter, URLRouter
from channels.security.websocket import AllowedHostsOriginValidator
from django.core.asgi import get_asgi_application
from chat.routing import websocket_urlpatternsos.environ.setdefault('DJANGO_SETTINGS_MODULE', 'Django5Websocket.settings')django_asgi_app = get_asgi_application()
application = ProtocolTypeRouter({"http": django_asgi_app,"websoket": AllowedHostsOriginValidator(AuthMiddlewareStack(URLRouter(websocket_urlpatterns)))
})

修改:chat/views.py

from django.shortcuts import renderdef index(request):"""首页路由"""return render(request, "chat/index.html")def room(request, room_name):"""房间路由"""return render(request, "chat/room.html", {"room_name": room_name})

新增:chat/templates/chat/room.html

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"/><title>Chat Room</title>
</head>
<body>
{#聊天日志#}
<textarea id="chat-log" cols="100" rows="20"></textarea><br>
{#消息输入框#}
<input id="chat-message-input" type="text" size="100"><br>
{#提交按钮#}
<input id="chat-message-submit" type="button" value="Send">
{#房间名称#}
{{ room_name|json_script:"room-name" }}
<script>// 提取房间名称const roomName = JSON.parse(document.getElementById('room-name').textContent);// 创建websocket连接const chatSocket = new WebSocket('ws://'+ window.location.host+ '/ws/chat/'+ roomName+ '/');// 接收消息chatSocket.onmessage = function (e) {// 解析接收到的消息const data = JSON.parse(e.data);// 输出到聊天日志记录document.querySelector('#chat-log').value += (data.message + '\n');};// 关闭websocketchatSocket.onclose = function (e) {console.error('聊天websocket连接已经被关闭');};// 消息输入框自动聚焦document.querySelector('#chat-message-input').focus();// 消息输入框的enter事件document.querySelector('#chat-message-input').onkeyup = function (e) {if (e.key === 'Enter') {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>

迁移数据:

python manage.py migrate

Docker安装Redis

安装Redis:

docker run --restart=always -p 6379:6379 --name redis -d redis:7.0.12  --requirepass zhangdapeng520

安装依赖:

pip install channels_redis

配置信息:

ASGI_APPLICATION = 'Django5Websocket.asgi.application'
CHANNEL_LAYERS = {"default": {"BACKEND": "channels_redis.core.RedisChannelLayer","CONFIG": {"hosts": ["redis://:zhangdapeng520@127.0.0.1:6379/0"],},},
}

启动服务

启动服务,浏览器访问:http://localhost:8000/chat/test/

相关文章:

在Django5中使用Websocket进行通信

Docker安装Redis docker run --restartalways -p 6379:6379 --name redis -d redis:7.0.12 --requirepass zhangdapeng520安装依赖 参考文档&#xff1a;https://channels.readthedocs.io/en/latest/installation.html pip install "channels[daphne]"展示聊天页…...

外汇天眼:CySEC与NAGA Markets Europe达成15万欧元的和解

塞浦路斯证券交易委员会&#xff08;CySEC&#xff09;已经与NAGA Markets Europe达成15万欧元的和解。有关监管决定的会议于2023年3月举行&#xff0c;然而直到今天才公布这个决定。 该和解符合2009年塞浦路斯证券交易委员会法第37(4)条的规定&#xff0c;该条赋予CySEC就任何…...

Docker仓库搭建与镜像推送拉取

1.Docker镜像仓库 搭建镜像仓库可以基于Docker官方提供的DockerRegistry来实现。 官网地址&#xff1a;https://hub.docker.com/_/registry 1.1.简化版镜像仓库 Docker官方的Docker Registry是一个基础版本的Docker镜像仓库&#xff0c;具备仓库管理的完整功能&#xff0c;…...

最适合初学者的PHP集成环境!

如果你是一个php初学者&#xff0c;千万不要为了php的运行环境去浪费时间&#xff0c;这里我给大家推荐一款php的集成环境&#xff1a;phpStudy。它具备了php运行的三要素&#xff1a;php、apache、mysql&#xff0c;当然它具备的功能远不止这些。 phpstudy V8安装步骤 步骤一…...

添加 Android App Links

添加 Android App Links功能 介绍一个简单的效果Android配置Add Url intent filtersAdd logic to handle the intentAssociate website 搭建网页支持AppLinks 介绍 Android App Links 是指将用户直接转到 Android 应用内特定内容的 HTTP 网址。Android App Links 可为您的应用带…...

五、Spring AOP面向切面编程(基于注解方式实现和细节)

本章概要 Spring AOP底层技术组成初步实现获取通知细节信息切点表达式语法重用&#xff08;提取&#xff09;切点表达式环绕通知切面优先级设置CGLib动态代理生效注解实现小结 5.5.1 Spring AOP 底层技术组成 动态代理&#xff08;InvocationHandler&#xff09;&#xff1a;…...

ES6 class详解

✨ 专栏介绍 在现代Web开发中&#xff0c;JavaScript已经成为了不可或缺的一部分。它不仅可以为网页增加交互性和动态性&#xff0c;还可以在后端开发中使用Node.js构建高效的服务器端应用程序。作为一种灵活且易学的脚本语言&#xff0c;JavaScript具有广泛的应用场景&#x…...

嵌入式固件加密的几种方式

一、利用id做软件加密 1&#xff0c;如果板子上有外部存储器&#xff0c;可以先编写一个程序&#xff0c;利用算法把id计算得到一些值存入外部存储器&#xff0c;然后再烧写真正的程序&#xff0c;真正的程序去校验外部存储器的数据是否合法即可 2&#xff0c;利用板子上按键组…...

[C#]使用onnxruntime部署Detic检测2万1千种类别的物体

【源码地址】 github地址&#xff1a;https://github.com/facebookresearch/Detic/tree/main 【算法介绍】 Detic论文&#xff1a;https://arxiv.org/abs/2201.02605v3 项目源码&#xff1a;https://github.com/facebookresearch/Detic 在Detic论文中&#xff0c;Detic提到…...

关于Spring @Transactional事务传播机制详解

Spring事务传播机制 1.什么是事务传播机制&#xff1f;2.Spring事务传播类型Propagation介绍3.具体案例总结 Spring事务传播机制 1.什么是事务传播机制&#xff1f; 举个栗子&#xff0c;方法A是一个事务的方法&#xff0c;方法A执行过程中调用了方法B&#xff0c;那么方法B有…...

力扣139.单词拆分

思路&#xff1a;动态规划&#xff0c;设dp[]记录当前字符能不能通过字典里的单词到达&#xff0c;双层循环&#xff0c;外层循环遍历字符串每一个字符&#xff0c;内层遍历当前i字符之前的所有以i字符结尾的子串 例如字符串&#xff1a;leetcode i遍历到了t 那么内层循环就…...

Docker 镜像命令总汇

目录 1、查看镜像列表 2、搜索镜像 3、拉取镜像 4、删除镜像 5、显示镜像详细信息 6、显示镜像历史 7、导出镜像 8、导入镜像 9、清理未使用的镜像 10、强制删除镜像 1、查看镜像列表 docker images 这个命令列出了你系统中的所有 Docker 镜像&#xff0c;包括镜像名…...

客户服务:助力企业抵御经济衰退的关键要素与策略

目前经济仍悬而未决是否陷入衰退。当前情况下&#xff0c;尽管通胀率高企&#xff0c;消费者支出良好&#xff0c;就业率也在上升&#xff0c;表明就业市场强劲。然而&#xff0c;有人认为衰退可能会在2024年第一季度发生。经济环境的不确定性可能会让人望而却步&#xff0c;但…...

第八周:AIPM面试准备

以下为从开始准备转行到拿到offer期间每天需要准备的10个面试题目以及相关知识补充&#xff01;来源广泛&#xff0c;从各个地方收集&#xff0c;只提供题目&#xff0c;我自己的尝试回答也会陆续放在我的喜马拉雅&#xff0c;基于我粗浅的认知&#xff0c;分享我粗浅的作答思路…...

阿里云2核2G3M服务器能放几个网站?有限制吗?

阿里云2核2g3m服务器可以放几个网站&#xff1f;12个网站&#xff0c;阿里云服务器网的2核2G服务器上安装了12个网站&#xff0c;甚至还可以更多&#xff0c;具体放几个网站取决于网站的访客数量&#xff0c;像阿里云服务器网aliyunfuwuqi.com小编的网站日访问量都很少&#xf…...

Baumer工业相机堡盟工业相机如何通过NEOAPI SDK设置相机本身的数据保存(CustomData)功能(C#)

Baumer工业相机堡盟工业相机如何通过NEOAPI SDK设置相机本身的数据保存&#xff08;CustomData&#xff09;功能&#xff08;C#&#xff09; Baumer工业相机Baumer工业相机的数据保存&#xff08;CustomData&#xff09;功能的技术背景CameraExplorer如何使用图像剪切&#xff…...

从零开始配置kali2023环境:镜像保存和导入

对原始的镜像做了一些改动&#xff0c;然后把当前容器状态打包为新的镜像&#xff0c;这样以后可以部署到其他地方了&#xff0c;而不用再安装软件等改动等等 1.查看容器id ┌──(holyeyes㉿kali2023)-[~] └─$ sudo docker ps ┌──(holyeyes㉿kali2023)-[~] └─$ s…...

Transformer梳理与总结

其实transformer的成功也是源于对注意力机制的应用&#xff0c;其本质上还是可以归因于注意力机制&#xff0c;首先我们先来了解一下什么是注意力机制。在注意力机制的背景下&#xff0c;自主性提示被称为查询&#xff08;query&#xff09;,给定任何查询&#xff0c;注意力机制…...

php之 校验多个时间段是否重复

参考网址 https://www.kancloud.cn/xiaobaoxuetp/mywork/3069416 https://segmentfault.com/a/1190000020487996 PHP判断多个时间段是否存在跨天或重复叠加的场景 /*** PHP计算两个时间段是否有交集&#xff08;边界重叠不算&#xff09;** param string $beginTime1 开始时间…...

atoi函数的模拟实现

这里强力推荐一篇文章 http://t.csdnimg.cn/kWuAm 详细解析了atoi函数以及其模拟实现&#xff0c;我这里就不说了。 这里作者先把自己模拟的代码给大家看一下。 int add(char* arr) {char* arr2 arr;while (*arr!-48){arr;}arr--;int sum 0;int n 0;while (arr ! (arr2-…...

编程笔记 html5cssjs 009 HTML链接

编程笔记 html5&css&js 009 HTML链接 一、HTML 链接二、文本链接三、图片链接四、HTML 链接- id 属性五、锚点链接六、HTML 链接 - target 属性七、属性downloadhrefpingreferrerpolicyreltargettype 八、操作小结 网页有了链接&#xff0c;就可根据需要进行跳转。纸质…...

Vue实现导出Excel表格,提示“文件已损坏,无法打开”的解决方法

一、vue实现导出excel 1、前端实现 xlsx是一个用于读取、解析和写入Excel文件的JavaScript库。它提供了一系列的API来处理Excel文件。使用该库&#xff0c;你可以将数据转换为Excel文件并下载到本地。这种方法适用于在前端直接生成Excel文件的场景。 安装xlsx依赖 npm inst…...

分发糖果,Java经典算法编程实战。

&#x1f3c6;作者简介&#xff0c;普修罗双战士&#xff0c;一直追求不断学习和成长&#xff0c;在技术的道路上持续探索和实践。 &#x1f3c6;多年互联网行业从业经验&#xff0c;历任核心研发工程师&#xff0c;项目技术负责人。 &#x1f389;欢迎 &#x1f44d;点赞✍评论…...

鸿蒙原生应用再添新丁!中国移动 入局鸿蒙

鸿蒙原生应用再添新丁&#xff01;中国移动 入局鸿蒙 来自 HarmonyOS 微博1月2日消息&#xff0c;#中国移动APP启动鸿蒙原生应用开发#&#xff0c;拥有超3亿用户的中国移动APP宣布&#xff0c;正式基于HarmonyOS NEXT启动#鸿蒙原生应用#及元服务开发。#HarmonyOS#系统的分布式…...

一个人能不能快速搭建一套微服务环境

一、背景 大型软件系统的开发现在往往需要多人的协助&#xff0c;特别是前后端分离的情况下下&#xff0c;分工越来越细&#xff0c;那么一个人是否也能快速搭建一套微服务系统呢&#xff1f; 答案是能的。看我是怎么操作的吧。 二、搭建过程 1、首先需要一套逆向代码生成工…...

计算机毕业设计------经贸车协小程序

项目介绍 本项目分为三种用户类型&#xff0c;分别是租赁者&#xff0c;车主&#xff0c;管理员用户&#xff1b; 管理员用户包含以下功能&#xff1a; 管理员登录,个人中心,租赁者管理,车主管理,赛事活动管理,车类别管理,租车管理,租车订单管理,车辆出售管理,购买订单管理,…...

数据结构OJ实验11-拓扑排序与最短路径

A. DS图—图的最短路径&#xff08;无框架&#xff09; 题目描述 给出一个图的邻接矩阵&#xff0c;输入顶点v&#xff0c;用迪杰斯特拉算法求顶点v到其它顶点的最短路径。 输入 第一行输入t&#xff0c;表示有t个测试实例 第二行输入顶点数n和n个顶点信息 第三行起&…...

你的第一个JavaScript程序

JavaScript&#xff0c;即JS&#xff0c;JavaScript是一种具有函数优先的轻量级&#xff0c;解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名&#xff0c;但是它也被用到了很多非浏览器环境中&#xff0c;JavaScript基于原型编程、多范式的动态脚本语言…...

CMake入门教程【基础篇】列表操作(list)

文章目录 1. 定义列表2. 获取列表长度3. 获取列表元素4. 追加元素到列表末尾5. 插入元素到指定位置6. 移除指定位置的元素7. 移除指定值的元素8. 替换指定位置的元素9. 迭代列表元素 #mermaid-svg-IAjFPWI6IXEGYmuU {font-family:"trebuchet ms",verdana,arial,sans-…...

普中STM32-PZ6806L开发板(HAL库函数实现-读取内部温度)

简介 主芯片STM32F103ZET6&#xff0c;读取内部温度其他知识 内部温度所在ADC通道 温度计算公式 V25跟Avg_Slope值 参考文档 stm32f103ze.pdf 电压计算公式 Vout Vref * (D / 2^n) 其中Vref代表参考电压&#xff0c; n为ADC的位数&#xff0c; D为ADC输入的数字信号。 实现…...

wordpress安装数据库错误/seo优化顾问服务阿亮

笔者一直使用jquery的click函数来绑定元素发生的click事件和处理函数&#xff0c;如下&#xff1a; $("#new_data").click(function () {}&#xff09;; 但今天在绑定一个由ajax请求生成的table时&#xff0c;发现click没有响应&#xff0c;查阅文档后发现&#xf…...

刷赞网站空间免费/搜索引擎优化seo怎么做

EnableCaching如何一键开启缓存手动挡CacheManagerCache使用演示小结自动挡CachingConfigurationSelectorAutoProxyRegistrarProxyCachingConfigurationCacheOperationSourceCacheOperationBeanFactoryCacheOperationSourceAdvisorCacheInterceptor小结推荐阅读手动挡 我们首先…...

做暧暧视频网站免费/怎么自己刷推广链接

自20年前TIOBE指数开始以来&#xff0c;Java和C首次不再占据前两位。 C仍然是第一&#xff0c;但现在是Python占据了第二的位置。有人说&#xff0c;Python最近的流行是由于数据挖掘、人工智能和数值计算等领域的蓬勃发展,但我有自己的看法。我相信Python的流行与一般需求有关…...

dede网站怎么做单页面/软件网站排行榜

点击上方“蓝色字”可关注我们&#xff01;暴走时评&#xff1a;IT业巨头富士通日前推出一项新的咨询服务&#xff0c;并表示该服务将在短短五天内实现“随时可用”的区块链最低可行产品研发。该服务起价9900欧元&#xff0c;内容包括从区块链技术基础入门课程、拟议用例评估再…...

asp.net 发布网站 ftp/个人网页设计作品欣赏

字符串函数 include<string.h> (1)strlen: strlen(字符串名)———代表的是取这个字符串的长度&#xff0c;不包括结尾的"\0". (2)strcmp: int strcmp(const char*s1,const char *s2)——用来比较这两个字符串&#xff0c;返回:(1).s1s2:0;(2).s1>s2:1;(3)…...

哪些网站做简历合适/seo关键词排名公司

redis集群 java架构师项目实战,高并发集群分布式,大数据高可用,视频教程在redis3.0之前&#xff0c;出现了sentinel工具来监控各个Master的状态&#xff08;可以看上一篇博客&#xff09;。如果Master异常则会做主从切换。选举一个slave作为新的Master&#xff0c;3.0之后出现了…...