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

FastAPI Web框架教程 第13章 WebSocket

news 2026/3/13 21:06:39

13-1 WebSocket是什么

WebSocket简介：

  • WebSocket是一种在单个TCP连接上进行全双工通信的协议。

  • WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。

  • 在WebSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。

WebSocket和HTTP的相同点和不同点：

  • WebSocket和HTTP都是解决 客户端-服务端 通信的网络协议。

  • HTTP是单向的，客户端先发起请求，服务端收到请求后再处理这个请求返回响应结果；即先有请求再有响应，且是一个请求对应一个响应；请求时建立连接，响应后断开连接。

  • WebSocket是双向的，客户端发起请求经过三次握手连接后，客户端和服务端就会基于这个连接保持通信，都可以主动向对方发消息。任何一端都可以主动断开这个连接。

  • HTTP是无状态的，WebSocket是有状态的。即如果使用WebSocket，那么只要建立了连接，每次通信时，服务端都知道在和谁通信，不需要借助Cookie或seesion或jwt等登录认证方式。

参考：https://www.geeksforgeeks.org/what-is-web-socket-and-how-it-is-different-from-the-http/

WebSocket的应用：

  • 实时web应用
  • 游戏
  • 聊天软件等等

13-2 WebSocket聊天室简易版

  • 使用FastAPI演示浏览器和服务端基于WebSocket，建立连接并双向通信。

  • 前端代码无需掌握，只要了解它在干什么事情即可。

  • 示例中，我们使用 HTMLResponse，通过接口的方式把前端代码响应的浏览器上；但其实直接写一个html文件，手动打开也可以的。

  • 后端使用WebSocket，需要使用WebSocket这个对象，常用如下三个 协程函数。

await websocket.accept()				# 建立连接
data = await websocket.receive_text()	 # 收消息
await websocket.send_text()				# 发消息

想要在fastAPI中使用websocket 需要安装标准版的uvicorn

pip3 install uvicorn[standard]

实例：简单版聊天

from fastapi import FastAPI, WebSocket
from fastapi.responses import HTMLResponseapp = FastAPI()html = """
<!DOCTYPE html>
<html><head><title>Chat</title></head><body><h1>WebSocket Chat</h1><form action="" οnsubmit="sendMessage(event)"><input type="text" id="messageText" autocomplete="off"/><button>Send</button></form><ul id='messages'></ul><script>var ws = new WebSocket("ws://localhost:8000/ws");ws.onmessage = function(event) {var messages = document.getElementById('messages')var message = document.createElement('li')var content = document.createTextNode(event.data)message.appendChild(content)messages.appendChild(message)};function sendMessage(event) {var input = document.getElementById("messageText")ws.send(input.value)input.value = ''event.preventDefault()}</script></body>
</html>
"""@app.get("/")
async def get():return HTMLResponse(html)@app.websocket("/ws")
async def websocket_endpoint(websocket: WebSocket):await websocket.accept()while True:data = await websocket.receive_text()await websocket.send_text(f"Message text was: {data}")

13-3 WebSocket多人在线聊天室

  • 实现多人在线聊天室
  • 处理客户端下线通知
  • 使用时间戳做客户端id

示例1：多人在线聊天室

from typing import Listfrom fastapi import FastAPI, WebSocket, WebSocketDisconnect
from fastapi.responses import HTMLResponseapp = FastAPI()html = """
<!DOCTYPE html>
<html><head><title>Chat</title></head><body><h1>WebSocket Chat</h1><h2>Your ID: <span id="ws-id"></span></h2><form action="" οnsubmit="sendMessage(event)"><input type="text" id="messageText" autocomplete="off"/><button>Send</button></form><ul id='messages'></ul><script>var client_id = Date.now()document.querySelector("#ws-id").textContent = client_id;var ws = new WebSocket(`ws://localhost:8000/ws/${client_id}`);ws.onmessage = function(event) {var messages = document.getElementById('messages')var message = document.createElement('li')var content = document.createTextNode(event.data)message.appendChild(content)messages.appendChild(message)};function sendMessage(event) {var input = document.getElementById("messageText")ws.send(input.value)input.value = ''event.preventDefault()}</script></body>
</html>
"""class ConnectionManager:def __init__(self):self.active_connections: List[WebSocket] = []async def connect(self, websocket: WebSocket):await websocket.accept()self.active_connections.append(websocket)def disconnect(self, websocket: WebSocket):self.active_connections.remove(websocket)async def send_personal_message(self, message: str, websocket: WebSocket):await websocket.send_text(message)async def broadcast(self, message: str):for connection in self.active_connections:await connection.send_text(message)manager = ConnectionManager()@app.get("/")
async def get():return HTMLResponse(html)@app.websocket("/ws/{client_id}")
async def websocket_endpoint(websocket: WebSocket, client_id: int):await manager.connect(websocket)	# 接收连接try:while True:data = await websocket.receive_text()		# 接收数据await manager.send_personal_message(f"You wrote: {data}", websocket)	# 自己发的消息自己看到await manager.broadcast(f"Client #{client_id} says: {data}")			# 广播，发给所有在线的客户端except WebSocketDisconnect:manager.disconnect(websocket)	# 断开连接await manager.broadcast(f"Client #{client_id} left the chat")	# 广播

示例2：优化自己发的消息不重复展示

from typing import Listfrom fastapi import FastAPI, WebSocket, WebSocketDisconnect
from fastapi.responses import HTMLResponseapp = FastAPI()html = """
<!DOCTYPE html>
<html><head><title>Chat</title></head><body><h1>WebSocket Chat</h1><h2>Your ID: <span id="ws-id"></span></h2><form action="" οnsubmit="sendMessage(event)"><input type="text" id="messageText" autocomplete="off"/><button>Send</button></form><ul id='messages'></ul><script>var client_id = Date.now()document.querySelector("#ws-id").textContent = client_id;var ws = new WebSocket(`ws://localhost:8000/ws/${client_id}`);ws.onmessage = function(event) {var messages = document.getElementById('messages')var message = document.createElement('li')var content = document.createTextNode(event.data)message.appendChild(content)messages.appendChild(message)};function sendMessage(event) {var input = document.getElementById("messageText")ws.send(input.value)input.value = ''event.preventDefault()}</script></body>
</html>
"""class ConnectionManager:def __init__(self):self.active_connections: List[WebSocket] = []async def connect(self, websocket: WebSocket):await websocket.accept()self.active_connections.append(websocket)	# 收集有所的在线客户端def disconnect(self, websocket: WebSocket):self.active_connections.remove(websocket)	# 当客户端断线时，更新在线客户端列表async def send_personal_message(self, message: str, websocket: WebSocket):await websocket.send_text(message)async def broadcast(self, message: str, websocket: WebSocket):for connection in self.active_connections:if connection == websocket:		# 判断下，如果是自己就不再发送消息continueawait connection.send_text(message)manager = ConnectionManager()@app.get("/")
async def get():return HTMLResponse(html)@app.websocket("/ws/{client_id}")
async def websocket_endpoint(websocket: WebSocket, client_id: int):await manager.connect(websocket)try:while True:data = await websocket.receive_text()await manager.send_personal_message(f"You wrote: {data}", websocket)await manager.broadcast(f"Client #{client_id} says: {data}", websocket)except WebSocketDisconnect:manager.disconnect(websocket)await manager.broadcast(f"Client #{client_id} left the chat", websocket)

相关文章：

FastAPI Web框架教程 第13章 WebSocket

13-1 WebSocket是什么 WebSocket简介&#xff1a; WebSocket是一种在单个TCP连接上进行全双工通信的协议。 WebSocket使得客户端和服务器之间的数据交换变得更加简单&#xff0c;允许服务端主动向客户端推送数据。 在WebSocket API中&#xff0c;浏览器和服务器只需要完成一…...

编程日记 2024/4/2 6:57:21

将 Elasticsearch 向量数据库引入到数据上的 Azure OpenAI 服务（预览）

作者&#xff1a;来自 Elastic Aditya Tripathi Microsoft 和 Elastic 很高兴地宣布&#xff0c;全球下载次数最多的向量数据库 Elasticsearch 是公共预览版中 Azure OpenAI Service On Your Data 官方支持的向量存储和检索增强搜索技术。 这项突破性的功能使你能够利用 GPT-4 …...

编程日记 2024/4/2 6:54:18

SeLinux 常见的宏

在SeLinux框架中&#xff0c;google定义好了一些宏&#xff0c;我们使用这些宏&#xff0c;开发时可以更加方便。大部分的宏是定义在te_macros文件中 type_transition type_transition source_type target_type : class default_type当主体进程域source_type 对target_type 类…...

编程日记 2024/4/2 6:53:17

图解PyTorch中的torch.gather函数和 scatter 函数

前言 torch.gather在目前基于 transformer or query based 的目标检测中&#xff0c;在最后获取目标结果时&#xff0c;经常用到。 这里记录下用法&#xff0c;防止之后又忘了。 介绍 torch.gather 官方文档对torch.gather()的定义非常简洁 定义&#xff1a;从原tensor中获…...

编程日记 2024/4/2 6:52:16

Pytorch实用教程： torch.tensor()的用法

在PyTorch中&#xff0c;torch.tensor()函数是用来创建张量&#xff08;Tensor&#xff09;的一个非常基础和重要的函数。张量是PyTorch中的基本数据结构&#xff0c;用于存储和操作数据&#xff0c;可以看作是一个高维数组。torch.tensor()函数可以从数据创建新的张量&#xf…...

编程日记 2024/4/2 6:51:15

Java设计模式详解：工厂模式

Java设计模式详解&#xff1a;工厂模式 文章目录 Java设计模式详解&#xff1a;工厂模式前言一、工厂模式是个啥&#xff1f;二、工厂模式怎么用&#xff1f;三、工厂模式啥时候用&#xff1f;四、工厂模式的优点总结 前言 今天咱们来聊聊设计模式中的一位重要成员——工厂模式…...

编程日记 2024/4/2 6:50:14

Python爬虫：爬虫常用伪装手段

目录 前言 一、设置User-Agent 二、设置Referer 三、使用代理IP 四、限制请求频率 总结 前言 随着互联网的快速发展&#xff0c;爬虫技术在网络数据采集方面发挥着重要的作用。然而&#xff0c;由于爬虫的使用可能会对被爬取的网站造成一定的压力&#xff0c;因此&#…...

编程日记 2024/4/2 6:48:12

【数据结构】非线性结构---二叉树

1、树 1.1 树的相关概念 节点的度&#xff1a;一个节点含有的子树的个数称为该节点的度&#xff1b; 如上图&#xff1a;A的为6 叶节点或终端节点&#xff1a;度为0的节点称为叶节点&#xff1b; 如上图&#xff1a;B、C、H、I...等节点为叶节点 非终端节点或分支节点&#…...

编程日记 2024/4/2 6:47:11

【战略前沿】与中国达成生产协议后，飞行汽车即将起飞

【原文】Flying cars edge towards takeoff after Chinese production deal 【作者】Thomas Macaulay 斯洛伐克公司KleinVision签署了一项协议&#xff0c;将大规模生产AirCar。 一辆获得航空认证的飞行汽车向商业化又迈出了一大步。 空中汽车的创造者KleinVision今天宣布出售…...

编程日记 2024/4/2 6:46:10

谷粒商城实战(007 压力测试)

Java项目《谷粒商城》架构师级Java项目实战&#xff0c;对标阿里P6-P7&#xff0c;全网最强 总时长 104:45:00 共408P 此文章包含第141p-第p150的内容 简介 安装jmeter 安装jmeter 使用中文 这样写就是200个线程循环100次 一共是2万个请求 介绍线程组 添加请求 可以是htt…...

编程日记 2024/4/2 6:44:08

使用CSS计数器，在目录名称前加上了序号，让目录看起来更加井然有序

目录&#xff08;Text of Contents缩写为TOC&#xff09;&#xff0c;其实就是一篇文章的概要或简述。这好比&#xff0c;去书店买书&#xff0c;先是被这本书的标题所吸引&#xff0c;而后我们才会&#xff0c;翻开这本书目录&#xff0c;看看这本书主要是在讲些什么&#xff…...

编程日记 2024/4/2 6:43:07

SSH常见运维总结

1 -bash: ssh: command not found 解决办法&#xff1a;"yum install &#xff0d;y openssh-server openssh-clinets" 2 ssh登录时提示&#xff1a;Read from socket failed: Connection reset by peer. 原因&#xff1a;/etc/ssh/下没有ssh*key*文件 解决&…...

编程日记 2024/4/2 6:41:05

uni app 扫雷

闲来无聊。做个扫雷玩玩吧&#xff0c;点击打开&#xff0c;长按标记&#xff0c;标记的点击两次或长按取消标记。所有打开结束 <template><view class"page_main"><view class"add_button" style"width: 100vw; margin-bottom: 20r…...

编程日记 2024/4/2 6:39:03

MATLAB绘制堆叠填充图--巧用句柄

MATLAB绘制堆叠填充图–巧用句柄 目录 MATLAB绘制堆叠填充图--巧用句柄1. 主要原理讲解1.1 主要函数1.2 句柄原理 2. 绘图示例2.1 准备数据2.2 绘制堆叠填充图-使用句柄控制图形属性2.3 设置填充颜色和样式2.4 添加标题和标签2.5 绘图效果 3. 结语 堆叠填充图是一种常见的数据可…...

编程日记 2024/4/2 6:37:01

JQuery的定义

jQuery是一个js库&#xff0c;使用jQuery会比js简单一点 jQuery文件是一个自执行函数 jQuery文件是一个自执行函数 $传递的参数不同&#xff0c;效果也不同&#xff1a; 传递的是匿名函数&#xff0c;那$就是一个入口函数&#xff0c;传递的是一个字符串&#xff0c;那$就…...

编程日记 2024/4/2 6:36:00

【操作系统】FCFS、SJF、HRRN、RR、EDF、LLF调度算法及python实现代码

文章目录 一、先来先服务调度算法&#xff08;FCFS&#xff09; 二、短作业优先调度算法&#xff08;SJF&#xff09; 三、高响应比优先调度算法&#xff08;HRRN&#xff09; 四、轮转调度算法&#xff08;RR&#xff09; 五、最早截至时间优先算法&#xff08;EDF&#…...

编程日记 2024/4/2 6:34:58

Image-Adaptive YOLO for Object Detection in Adverse Weather Conditions(IA-YOLO)

1、总体概述 基于深度学习的目标检测在常规条件的数据集可以获得不错的结果&#xff0c;但是在环境、场景、天气、照度、雾霾等自然条件的综合干扰下&#xff0c;深度学习模型的适应程度变低&#xff0c;检测结果也随之下降&#xff0c;因此研究在复杂气象条件下的目标检测方法…...

编程日记 2024/4/2 6:32:57

Mac电脑Jmeter集成到Jenkins，压测多个接口并生成测试报告

Jenkins支持的JDK版本17、21&#xff0c;通过java -version查看当前JDK版本&#xff0c;确认是否匹配 打开网址https://www.jenkins.io/download 点击下载&#xff0c;选择mac版本 commend空格打开终端&#xff0c;输入安装命令brew install jenkins 安装完成后输入brew servi…...

编程日记 2024/4/2 6:31:56

redis-Hash

一&#xff0c;应用场景 Redis hash 是一个string类型的field和value的映射表&#xff0c;hash特别适合用于存储对象。Set就是一种简化的Hash,只变动key,而value使用默认值填充。 可以将一个Hash表作为一个对象进行存储&#xff0c;表中存放对象的信息。 二&#xff0c;命令 H…...

编程日记 2024/4/2 6:30:55

Kubernetes kafka系列 | Strimzi 部署kafka-bridge

Strimzi kafka集群部署直通车 一、kafka bridge 介绍 Kafka Bridge 是 Apache Kafka 生态系统中的一个工具或组件&#xff0c;用于实现 Kafka 与其他系统或协议之间的通信或集成。Kafka 本身是一个分布式事件流平台&#xff0c;广泛用于构建实时数据流水线和流式应用程序。然而…...

编程日记 2024/4/2 6:29:53

高效提取Ren‘Py游戏资源：unrpa全攻略

高效提取RenPy游戏资源&#xff1a;unrpa全攻略 【免费下载链接】unrpa A program to extract files from the RPA archive format. 项目地址: https://gitcode.com/gh_mirrors/un/unrpa unrpa是一款专业的Python工具&#xff0c;能够高效提取RenPy引擎打包的RPA格式档案…...

编程新知 2026/3/13 20:59:33

Symfony/Translation错误监控终极指南：Sentry+Slack告警完整配置教程

Symfony/Translation错误监控终极指南&#xff1a;SentrySlack告警完整配置教程 【免费下载链接】translation symfony/translation: 是一个用于 PHP 的翻译库&#xff0c;支持多种消息源和翻译格式&#xff0c;可以用于构建多语言的 Web 应用程序和 API。 项目地址: https:/…...

编程新知 2026/3/13 18:46:16

若依Cloud+Flowable6.7.2实战：手把手教你搭建微服务工作流模块（附避坑指南）

若依Cloud微服务架构下Flowable工作流模块的深度集成与实战避坑指南 在当今企业级应用开发中&#xff0c;业务流程的自动化与管理已成为提升运营效率的核心环节。对于已经采用若依Cloud&#xff08;RuoYi-Cloud&#xff09;这一成熟微服务架构的团队而言&#xff0c;引入一个稳…...

编程新知 2026/3/13 17:21:06

MODBUS TCP转CANopen 技术赋能高效协同作业

在现代工业自动化领域&#xff0c;MODBUS TCP和CANopen两种通讯协议因其稳定性和高效性被广泛应用于各种设备和系统中。而随着科技的不断进步&#xff0c;这两种通讯协议也正在被逐步融合&#xff0c;形成了一种新型的通讯方式——开疆智能MODBUS TCP转CANopen网关KJ-TCPC-CANP…...

编程新知 2026/3/6 17:15:57

【决胜公务员考试】求职OMG——见面课测验1

2025最新版&#xff01;&#xff01;&#xff01;6.8截至答题&#xff0c;大家注意呀&#xff01; 博主码字不易点个关注吧,祝期末顺利~~ 1.单选题(2分) 下列说法错误的是:&#xff08; B &#xff09; A.选调生属于公务员系统 B.公务员属于事业编 C.选调生有基层锻炼的要求 D…...

编程新知 2026/2/18 15:34:31

JUC笔记(上)-复习 涉及死锁 volatile synchronized CAS 原子操作

一、上下文切换 即使单核CPU也可以进行多线程执行代码&#xff0c;CPU会给每个线程分配CPU时间片来实现这个机制。时间片非常短&#xff0c;所以CPU会不断地切换线程执行&#xff0c;从而让我们感觉多个线程是同时执行的。时间片一般是十几毫秒(ms)。通过时间片分配算法执行。…...

编程新知 2026/2/26 21:33:32

九天毕昇深度学习平台 | 如何安装库？

pip install 库名 -i https://pypi.tuna.tsinghua.edu.cn/simple --user 举个例子&#xff1a; 报错 ModuleNotFoundError: No module named torch 那么我需要安装 torch pip install torch -i https://pypi.tuna.tsinghua.edu.cn/simple --user pip install 库名&#x…...

编程新知 2026/2/25 15:32:55

打手机检测算法AI智能分析网关V4守护公共/工业/医疗等多场景安全应用

一、方案背景​ 在现代生产与生活场景中&#xff0c;如工厂高危作业区、医院手术室、公共场景等&#xff0c;人员违规打手机的行为潜藏着巨大风险。传统依靠人工巡查的监管方式&#xff0c;存在效率低、覆盖面不足、判断主观性强等问题&#xff0c;难以满足对人员打手机行为精…...

编程新知 2026/2/23 16:59:53

AI语音助手的Python实现

引言 语音助手（如小爱同学、Siri）通过语音识别、自然语言处理（NLP）和语音合成技术，为用户提供直观、高效的交互体验。随着人工智能的普及，Python开发者可以利用开源库和AI模型，快速构建自定义语音助手。本文由浅入深，详细介绍如何使用Python开发AI语音助手，涵盖基础功…...

编程新知 2026/3/7 11:36:24

十九、【用户管理与权限 - 篇一】后端基础：用户列表与角色模型的初步构建

【用户管理与权限 - 篇一】后端基础：用户列表与角色模型的初步构建 前言准备工作第一部分：回顾 Django 内置的 `User` 模型第二部分：设计并创建 `Role` 和 `UserProfile` 模型第三部分：创建 Serializers第四部分：创建 ViewSets第五部分：注册 API 路由第六部分：后端初步测…...

编程新知 2026/1/9 3:08:54