flask_socketio 以继承 Namespace方式实现一个网页聊天应用
点击进入上一篇，可作为参考
实验环境
python 用的是3.11.11
其他环境可以通过这种方式一键安装：
pip install flask==3.1.0 Flask-SocketIO==5.4.1 gevent-websocket==0.10.1 -i https://mirrors.tuna.tsinghua.edu.cn/pypi/web/simple
pip list 详情如下：
Package Version
---------------- -------
bidict 0.23.1
blinker 1.9.0
click 8.1.7
Flask 3.1.0
Flask-SocketIO 5.4.1
gevent 24.11.1
gevent-websocket 0.10.1
greenlet 3.1.1
h11 0.14.0
itsdangerous 2.2.0
Jinja2 3.1.4
MarkupSafe 3.0.2
pip 24.2
python-engineio 4.11.1
python-socketio 5.11.4
setuptools 75.1.0
simple-websocket 1.1.0
Werkzeug 3.1.3
wheel 0.44.0
wsproto 1.2.0
zope.event 5.0
zope.interface 7.2
先看效果：
目录结构：
app2.py中的内容如下：
from flask import Flask, render_template, request
from flask_socketio import SocketIO, Namespace, join_room, leave_room app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret!' def create_application(name, config=None, timeout=60, proxy=None):app = Flask(name)@app.route("/", methods=["GET", "POST"])def main():return render_template("index.html")return appclass MyNamespace(Namespace): def on_connect(self): print("Client connected") # def on_message(self, message): # print(f"Received message: {message}") # # socket_io.emit('response', {'data': 'Message received'}, namespace="/my_room") # 下边这种方式和本行这个方式都可以（在没有to传递参数时，self方式不能传递to这个参数）# self.emit('response', {'data': 'Message received'}, namespace="/my_room")def on_joinRoom(self, message):# global Room # 没有被用到吧，应该没啥用# print(message)join_room(message['room']) #加入房间有专门的函数，不用我们管# socket_io.emit("room_joined", {socket_io.emit("roomJoined", {"user" : request.sid,"room" : message['room']},to=message['room'], namespace="/my_room") # ！！！这个namespace="/my_room"一定要写def on_sendMsg(self,message):print(message)# 下边这个emit中的“SendtoAll”是 前端socket.on('SendtoAll'）的监听对象 to=message['room'] 表示给房间里的所有人都发送消息 如果不写则表示个自己一个人回消息# request.sid貌似是每对socket连接都会不一样，但是没断开的应该是一样的# self.emit 这个不能传递, to=message["room"] 不然会报错# self.emit('SendtoAll', {"msg":message["msg"], "user":request.sid}, to=message["room"], namespace="/my_room")socket_io.emit('SendtoAll', {"msg":message["msg"], "user":request.sid}, to=message["room"], namespace="/my_room")def on_leaveRoom(self,message):print(message)socket_io.emit('roomLeftPersonal', {"room": message['room'], "user": request.sid}, namespace="/my_room") # 这个没写to=message['room'] 表示给自己一个人回消息leave_room(message['room']) # 可神奇，他咋知道那个人离开了，可能是socket连接所以知道socket_io.emit('roomLeft', {"room":message['room'], "user":request.sid}, to=message['room'], namespace="/my_room")app = create_application("pipeagent_service", config=None)
socket_io = SocketIO(app, processes=True, cors_allowed_origins="*", async_mode='gevent')
socket_io.on_namespace(MyNamespace('/my_room'))
if __name__ == "__main__":socket_io.run(app=app, host="0.0.0.0", debug=False, log_output=True)
index.html中的内容如下：
<!DOCTYPE html>
<html lang="en"><head><title>flask socketio通信</title>
<!-- flask-socketio--><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg==" crossorigin="anonymous"></script><!-- Jquery--><!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js"></script> --><script type="text/javascript" src="//cdn.bootcss.com/socket.io/3.1.2/socket.io.min.js"></script><script type="text/javascript" src="{{url_for('static', filename='js/index.js')}}"></script></head><body><h3>Join Room</h3><form id="joinRoom" method="POST" action="#"><label>Room Number</label><input type="text" id="roomNum" required><input type="submit" id="submitRoomNum"></form><button id="leave_room">Leave</button><h1>Hello World</h1><ul id="chatContent"><li>Text</li></ul><form id="SubmitForm" method="POST" action="#"><h3>发送文字</h3><textarea placeholder="输入文字" name="msg" id="chatMsg" required></textarea><button type="submit">发送</button></form></body>
</html>
index.js中的内容如下：
$(document).ready(function(){// 这个 my_room对应后端中的Namespace 即命名空间var socket = io.connect('http://localhost:5000/my_room'); socket.on('connect', function() { socket.send('Client Connected') // console.log("Connected to server"); }); $('form#joinRoom').submit(function (event){socket.emit('joinRoom', {room:$('#roomNum').val()})return false});// 3socket.on('roomJoined', function (msg, cb) {$('#chatContent').append('<li>' + msg.user + 'has joined room'+ msg.room +' </li>')});// 4$('form#SubmitForm').submit(function (event){// 发送给后端的sendMsg方法socket.emit('sendMsg', {msg:$('#chatMsg').val(),room:$('#roomNum').val()});$('#chatMsg').val("");return false});// 5 监听后端的SendtoAll方法socket.on('SendtoAll', function (msg, cb) {$('#chatContent').append('<li>' + msg.user + ': ' + msg.msg + '</li>')});// 6$('#leave_room').on('click', function (){socket.emit('leaveRoom', {room:$('#roomNum').val()})console.log("sent")});// 7socket.on('roomLeftPersonal', function (msg, cb) {$('#chatContent').append('<li>' + 'you have left room'+ msg.room +' </li>')});// 8 socket.on('roomLeft', function (msg, cb) {$('#chatContent').append('<li>' + msg.user + 'has left room'+ msg.room +' </li>')});// socket.on('response', function(data) { // console.log(data.data); // }); // socket.on('disconnect', function() { // console.log('Disconnected'); // }); // socket.emit('message', 'Hello, server!');// 1 一般的执行步骤 1，2，3....// var socket = io();// 连接socket// socket.on('connect', function (){// socket.send('Client Connected')// });
})
运行：即 python app2.py 然后打开两个网页，并分别输入http://127.0.0.1:5000/ 开启愉快的自我交流吧
另可参考点击进入
相关文章：
flask_socketio 以继承 Namespace方式实现一个网页聊天应用
点击进入上一篇，可作为参考 实验环境 python 用的是3.11.11 其他环境可以通过这种方式一键安装： pip install flask3.1.0 Flask-SocketIO5.4.1 gevent-websocket0.10.1 -i https://mirrors.tuna.tsinghua.edu.cn/pypi/web/simple pip list 详情如下&am…...
go mod tidy 命令
go mod tidy 是 Go 语言的命令，用于清理和更新 go.mod 和 go.sum 文件。它主要有以下功能： 移除未使用的依赖项：从 go.mod 文件中删除那些在代码中不再使用的依赖项。 添加缺失的依赖项：添加代码中使用但尚未记录在 go.mod 文件中…...
（11）YOLOv9算法基本原理
一、YOLOv9 的结构 YOLOv9 引入了可编程梯度信息（PGI），以及基于梯度路径规划的新型轻量级网络架构，为目标检测领域带来了突破性的成果。 Yolov9 网络模型主要由BackBone（主干网络）、Neck（颈层&…...
python学opencv|读取图像（十七）认识alpha通道
【1】引言 前序学习进程中，我们已经掌握了RGB和HSV图像的通道拆分和合并，获得了很多意想不到的效果，相关链接包括且不限于： python学opencv|读取图像（十二）BGR图像转HSV图像-CSDN博客 python学opencv|读…...
中小学教室多媒体电脑安全登录解决方案
中小学教室多媒体电脑面临学生随意登录的问题，主要涉及到设备使用、网络安全、教学秩序等多个方面。以下是对这一问题的详细分析： 一、设备使用问题 1. 设备损坏风险 学生随意登录可能导致多媒体电脑设备过度使用，增加设备损坏的风险。不当…...
Redis篇之Redis高可用模式参数调优，提高Redis性能
1. Redis高可用模式核心 Redis高可用模式的核心是使用主从复制和自动故障转移机制来确保系统在某些节点发生故障时仍然可以正常工作。 常用的高可用架构包括Redis Sentinel模式和Redis Cluster模式，其中Sentinel模式是为了提供高可用性而专门设计的解决方案。 在Re…...
linux-----进程execl簇函数
execl函数族概述 在Linux中，execl函数族用于在一个进程中加载并执行一个新的程序，它会替换当前进程的地址空间（代码段、数据段、堆和栈等）。这个函数族包括execl、execlp、execle、execv、execvp和execvpe，它们的主要功…...
Vue + ECharts 实现山东地图展示与交互
这篇文章中，我将逐步介绍如何使用 Vue 和 ECharts 实现一个互动式的地图展示组件，其中支持返回上一层地图、点击查看不同城市的详细信息，以及根据数据动态展示不同的统计信息。 效果图：玩转山东地图：用Echarts打造交互…...
【Verilog】UDP用户原语
User-defined primitives 概述基本语法组合逻辑的UDP时序逻辑的UDPUDP 符号表 Verilog HDL（简称 Verilog ）是一种硬件描述语言，用于数字电路的系统设计。可对算法级、门级、开关级等多种抽象设计层次进行建模。 Verilog 不仅定义了语法&…...
问题小记-达梦数据库报错“字符串转换出错”处理
最近遇到一个达梦数据库报错“-6111: 字符串转换出错”的问题，这个问题主要是涉及到一条sql语句的执行，在此分享下这个报错的处理过程。 问题表现为：一样的表结构和数据，执行相同的SQL，在Oracle数据库中执行正常&…...
MyBatis入门的详细应用实例
目录 MyBatis第一章：代理Dao方式的CRUD操作1. 代理Dao方式的增删改查 第二章：MyBatis参数详解1. parameterType2. resultType 第三章：SqlMapConfig.xml配置文件1. 定义properties标签的方式管理数据库的信息2. 类型别名定义 MyBatis 第一章&…...
Sequelize ORM sql 语句工具
Sequelize ORM sql 语句工具 初始化配置 Sequelize orm 配置文章落日沉溺于海 在命令行中全局安装 npm i -g sequelize-clisequelize 执行需要匹配 mysql2 对应的依赖（安装 mysql2） npm i sequelize mysql2初始化项目 sequelize init熟悉初始化项目后…...
增强LabVIEW与PLC通信稳定性
在工业自动化系统中，上位机与PLC之间的通信稳定性至关重要，尤其是在数据采集和控制任务的实时性要求较高的场景中。LabVIEW作为常用的上位机开发平台，通过合理优化通信协议、硬件接口、数据传输方式以及系统容错机制，可以大大提升…...
UDP系统控制器_音量控制、电脑关机、文件打开、PPT演示、任务栏自动隐藏
UDP系统控制器(ShuiYX) 帮助文档 概述 本程序设计用于通过UDP协议接收指令来远程控制计算机的音量、执行特定命令和其他功能。为了确保程序正常工作，请确认防火墙和网络设置允许UDP通信，并且程序启动后会最小化到托盘图标。 命令格式及说明 音量控制…...
NK细胞杀伐功能如何实现？
在人体的免疫系统中，自然杀伐细胞（Natural Killer Cells，简称NK细胞）是一类完全自然的免疫激活力量。它们为人体提供了快速反应能力，不依赖类元的特定识别力，但能直接寻找和毁灭毒病感染细胞和肿瘤细胞。那…...
Ubuntu搭建ES8集群+加密通讯+https访问
目录 写在前面 一、前期准备 1. 创建用户和用户组 2. 修改limits.conf文件 3. 关闭操作系统swap功能 4. 调整mmap上限 二、安装ES 1.下载ES 2.配置集群间安全访问证书密钥 3.配置elasticsearch.yml 4.修改jvm.options 5.启动ES服务 6.修改密码 7.启用外部ht…...
PC寄存器（Program Counter Register）jvm
在JVM（Java虚拟机）中，PC寄存器（Program Counter Register）扮演着至关重要的角色。以下是对JVM中PC寄存器的详细解释： 一、定义与功能 定义： JVM中的PC寄存器，也被称为程序计数器，是对物理PC寄存器的一种抽象模拟。它用于存储当前线程所执行的字节码指令的地址，即指…...
预览和下载 （pc和微信小程序）
1.微信小程序 预览pdf 或者 图片等 //utils.js 文件//通过接口返回文件链接 打开文档 export default function previewFile({ downLinkUrl, tempFilePath }) {let url "https://" downLinkUrl.replace("http://", "").replace("https:…...
使用 DeepSpeed 微调 OPT 基础语言模型
文章目录 OPT 基础语言模型Using OPT with DeepSpeedmain.py 解析1、导入库和模块2、解析命令行参数3、main 函数3.1 设备与分布式初始化3.2 模型与数据准备3.3 定义评估函数3.4 优化器与学习率调度器设置3.5 使用 deepspeed 进行模型等初始化3.6 训练循环3.7 模型保存 4、dsch…...
BSM和BMS什么区别？
BSM BSM（Battery System Manager）是指用于管理和控制电动车辆的电池系统的设备，其功能包括监测电池状态、控制充放电过程、保护电池安全等。 BMS BMS（Battery Management System）是指用于监测、控制和保护电池组的设…...
导师推荐！2026年最值得用的专业AI论文写作工具
2026年AI论文写作工具已从“单点辅助”升级为智能化学术研究系统，核心评价维度涵盖文献真实性、格式合规性、长文本逻辑、查重降重、AIGC合规等关键指标。本次测评覆盖6款主流工具，测试场景包括中文与英文论文、全流程与专项功能、免费与付费版本&#x…...
突破百度网盘限速壁垒：5步实现直链高速下载全攻略
突破百度网盘限速壁垒：5步实现直链高速下载全攻略 【免费下载链接】baiduyun 油猴脚本 - 一个免费开源的网盘下载助手 项目地址: https://gitcode.com/gh_mirrors/ba/baiduyun 你是否经历过这样的场景：加班后想下载公司共享的设计素材包ÿ…...
PDF-Parser-1.0保姆级教程：5分钟搞定PDF文档智能解析，小白也能快速上手
PDF-Parser-1.0保姆级教程：5分钟搞定PDF文档智能解析，小白也能快速上手 1. 为什么选择PDF-Parser-1.0？ 你是否遇到过这些烦恼： 从PDF复制文字到Word后格式全乱表格数据粘贴后变成一堆乱码论文里的数学公式无法编辑双栏排版的文…...
Vulnhub靶机实战：Momentum-2渗透测试全流程解析
1. 靶机环境搭建与网络配置 Momentum-2是Vulnhub平台上经典的Web渗透测试靶机，模拟了真实环境中常见的漏洞组合。我们先从最基本的虚拟机配置开始说起。下载完OVA文件后，用VMware Workstation导入时会遇到一个小坑——系统会提示"重试"&#…...
从零开始：使用Deepspeed ZeRO3优化Qwen3-8B微调，解决多卡显存不足问题
从零开始：使用Deepspeed ZeRO3优化Qwen3-8B微调，解决多卡显存不足问题 当你面对一个8B参数规模的大语言模型时，单卡训练往往显得力不从心。显存不足的报错就像一堵高墙，阻挡着许多开发者的探索之路。而多卡并行训练又带来了新的挑…...
隐私优先方案：OpenClaw+Qwen3-32B-RTX4090D离线处理医疗记录
隐私优先方案：OpenClawQwen3-32B-RTX4090D离线处理医疗记录 1. 为什么医疗数据必须留在本地？ 去年协助某诊所搭建病历管理系统时，我亲历了一次数据泄露恐慌。当诊所负责人发现云端OCR服务商要求上传患者检查报告时，他立即叫停了…...
收藏！小白程序员必看：轻松掌握大模型核心技术，解决领域与时间限制难题！
通用大模型的两个硬伤——领域限制（不知道企业内部数据）和时间限制（无法获取最新信息）。 产品设计的第一步，不是写提示词，是厘清"模型不知道什么"。这与传统软件开发思维完全不同——传统软件是&…...
Chord - Ink Shadow 跨模态应用探索：连接文本与MATLAB科学计算
Chord - Ink & Shadow 跨模态应用探索：连接文本与MATLAB科学计算 你有没有过这样的经历？面对一堆实验数据，脑子里已经想好了要画个什么样的图来分析，但打开MATLAB，却卡在了写代码这一步。复杂的函数名、繁琐的语法…...
PP-DocLayoutV3入门必看：从零部署到JSON结构化输出完整流程
PP-DocLayoutV3入门必看：从零部署到JSON结构化输出完整流程 1. 开篇：认识文档布局分析利器 你是否曾经遇到过这样的困扰：面对扫描的文档图片，想要提取其中的文字和结构信息，却不知道从何下手？或者需要处理…...
高效处理海量数据——pandas分块读取与内存管理实战
1. 为什么需要分块读取千万级数据？ 第一次处理千万级CSV文件时，我盯着16GB的硬盘文件发愁——128GB内存的服务器居然加载到一半就崩溃了。这种场景在金融交易记录、物联网传感器数据、用户行为日志分析中太常见了。pandas默认的read_csv()会一次性把数据…...