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

超简单的fastapi链接websocket用例

main.py

from typing import Listfrom fastapi import FastAPI, WebSocket, WebSocketDisconnectapp = FastAPI()class ConnectionManager:def __init__(self):# 存放激活的ws连接对象self.active_connections: List[WebSocket] = []async def connect(self, ws: WebSocket):# 等待连接await ws.accept()# 存储ws连接对象self.active_connections.append(ws)def disconnect(self, ws: WebSocket):# 关闭时 移除ws对象self.active_connections.remove(ws)@staticmethodasync def send_personal_message(message: str, ws: WebSocket):# 发送个人消息await ws.send_text(message)async def broadcast(self, message: str):# 广播消息for connection in self.active_connections:await connection.send_text(message)manager = ConnectionManager()@app.websocket("/ws/{user}")
async def websocket_endpoint(websocket: WebSocket, user: str):await manager.connect(websocket)await manager.broadcast(f"用户{user}进入聊天室")try:while True:data = await websocket.receive_text()await manager.send_personal_message(f"你说了: {data}", websocket)await manager.broadcast(f"用户:{user} 说: {data}")except WebSocketDisconnect:manager.disconnect(websocket)await manager.broadcast(f"用户-{user}-离开")if __name__ == "__main__":import uvicorn# 官方推荐是用命令后启动 uvicorn main:app --host=127.0.0.1 --port=8010 --reloaduvicorn.run(app='main:app', host="127.0.0.1", port=8010, reload=True, debug=True)

chat.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>聊天1</title>
</head>
<body>
<h1>User{{id}} Chat</h1>
<form action="" onsubmit="sendMessage(event)"><input type="text" id="messageText" autocomplete="off"/><button>Send</button>
</form>
<ul id='messages'>
</ul><script>var ws = new WebSocket("ws://127.0.0.1:5200/api/chat/ws/user{{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>

以上部分是案例

此处是个人案例  通过http传递用户协议到jinjia2模板进行html渲染

from fastapi import APIRouter,WebSocket,WebSocketDisconnect
from app1.core.websocket_config import manager
from starlette.requests import Request
from starlette.staticfiles import StaticFiles
from starlette.templating import Jinja2Templateschat_routing=APIRouter(prefix='/chat')@chat_routing.websocket("/ws/{user}")
async def websocket_endpoint(websocket: WebSocket, user: str):await manager.connect(websocket)await manager.broadcast(f"用户{user}进入聊天室")try:while True:data = await websocket.receive_text()await manager.send_personal_message(f"你说了: {data}", websocket)await manager.broadcast(f"用户:{user} 说: {data}")except WebSocketDisconnect:manager.disconnect(websocket)await manager.broadcast(f"用户-{user}-离开")templates = Jinja2Templates(directory="templates")
@chat_routing.get("/chat/{id}")
async def read_item(request: Request, id: str):return templates.TemplateResponse("chat.html", {"request": request, "id": id})

html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>聊天1</title>
</head>
<body>
<h1>User{{id}} Chat</h1>
<form action="" onsubmit="sendMessage(event)"><input type="text" id="messageText" autocomplete="off"/><button>Send</button>
</form>
<ul id='messages'>
</ul><script>var ws = new WebSocket("ws://127.0.0.1:5200/api/chat/ws/user{{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>

https://www.cnblogs.com/CharmCode/p/13552551.html

相关文章:

超简单的fastapi链接websocket用例

main.py from typing import Listfrom fastapi import FastAPI, WebSocket, WebSocketDisconnectapp FastAPI()class ConnectionManager:def __init__(self):# 存放激活的ws连接对象self.active_connections: List[WebSocket] []async def connect(self, ws: WebSocket):# 等…...

MySQL详解

目录 一、MySQL 概述二、MySQL 安装和配置三、MySQL 基础语法四、MySQL 高级语法五、MySQL 性能优化六、MySQL 应用场景和实例七、MySQL 开发工具和插件八、MySQL 学习资源和社区 一、MySQL 概述 MySQL 是一种开源的关系型数据库管理系统&#xff0c;最初由瑞典的 MySQL AB 公…...

Vue [Day2]

指令修饰符 v-model.trim v-model.number 事件名.stop click.stop 事件名.prevent keyup.enter <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-w…...

【前端|Javascript第1篇】一文搞懂Javascript的基本语法

欢迎来到JavaScript的奇妙世界&#xff01;作为前端开发的基石&#xff0c;JavaScript为网页增色不少&#xff0c;赋予了静态页面活力与交互性。如果你是一名前端小白&#xff0c;对编程一无所知&#xff0c;或者只是听说过JavaScript却从未涉足过&#xff0c;那么你来对了地方…...

【Linux命令200例】cp用于复制文件和目录(常用)

&#x1f3c6;作者简介&#xff0c;黑夜开发者&#xff0c;全栈领域新星创作者✌&#xff0c;阿里云社区专家博主&#xff0c;2023年6月csdn上海赛道top4。 &#x1f3c6;本文已收录于专栏&#xff1a;Linux命令大全。 &#x1f3c6;本专栏我们会通过具体的系统的命令讲解加上鲜…...

C高级_第二讲_shell指令和shell脚本_递归练习

思维导图 递归实现&#xff0c;输入一个数&#xff0c;输出这个数的每一位 int funh(int num){if(0 num){return 0;}else{funh(num/10);printf("%d\n", num%10);} }int main(int argc, const char *argv[]) {puts("请输入一个数");int num 0;scanf(&quo…...

静态路由综合实验

实验拓扑如下&#xff1a; 实验要求如下&#xff1a; 【1】R6为isp&#xff0c;接口IP地址均为公有地址;该设备只能配置IP地址&#xff0c;之后不能再对其进行任何配置 【2】R1~R5为局域网&#xff0c;私有IP地址192.168.1.0/24&#xff0c;请合理分配 【3】所有路由器上环回…...

Spring核心IOC控制反转思想-----Spring框架

import org.junit.Test;public class TestPublic {Testpublic void Test(){//控制反转是一种思想,是为了提高程序扩展力降低耦合度,达到DIP(Dependency Inversion Principle依赖倒置)原则//其核心是将对象的创建权交出去,由第三方容器负责管理,将对象和对象之间的维护权交出去,…...

中小企业如何做好MES管理系统实施建设

中小企业在生产制造领域面临着诸多挑战&#xff0c;包括提升产品竞争力、规范生产制造等。为了应对这些挑战&#xff0c;越来越多的中小企业开始实施MES生产管理系统。然而&#xff0c;由于企业规模小、资源实力不足等原因&#xff0c;很多企业在实施MES管理系统时存在一定的困…...

java环境搭建 Ubuntu Linux

jdk的安装和配置环境变量 使用apt sudo apt install default-jdk若是安装成功了在终端输入java -version来查看是否安装成功 使用官网下载的jdk包 直接在百度上搜索jdk&#xff0c;选择图片这个 网址:jdk下载网址 若是arm就选择带有arm的&#xff0c;反之选择x64的&#…...

微信小程序使用mp-html遇到的问题并解决

1、在本地配置寻找勾选使用npm 查了之后发现2023了 不需要勾选了 默认使用npm 2、在微信小程序编辑器左上角的 工具-->构建npm 然后就报错了 于是搜索到以下的内容&#xff1a; 没有找到可以构建的NPM包&#xff0c;请确认需要参与构建的npm都在 miniprogramRoot 目录内 -…...

【VTK】基于读取出来的 STL 模型,当用户点击鼠标左键时,程序将获取点击位置的点,显示其坐标,并设置它为模型的旋转原点

知识不是单独的&#xff0c;一定是成体系的。更多我的个人总结和相关经验可查阅这个专栏&#xff1a;Visual Studio。 文章目录 class PointPickedSignal : public QObjectclass MouseInteractorCommand : public vtkCommandvoid A::on_pushButtonSelected_clicked()void A::on…...

【第一阶段】kotlin的when表达式

1.Java 的if /when是语句 kotlin的if/when是表达式&#xff0c;表达式是有返回值的 java中void是个关键字&#xff0c;Unit在kotlin中是个类 2.当使用when语句的时候必须有一个不满足的值即else: fun main() {var week:Int5val info when(week){1->"今天是星期一"…...

C#中Convert.ToInt32() 和 int.Parse()的区别

都是用于将字符串转换为整数类型&#xff08;int&#xff09;的方法&#xff0c;但它们在处理转换过程中有一些区别&#xff1a; 1. 错误处理方式不同&#xff1a; - Convert.ToInt32()&#xff1a;如果字符串无法成功转换为整数类型&#xff0c;Convert.ToInt32()…...

安全学习DAY14_JS信息打点

信息打点——前端JS框架 文章目录 信息打点——前端JS框架小节概述-思维导图JS安全概述什么是JS渗透测试&#xff1f;前后端差异JS安全问题流行的Js框架如何判定JS开发应用&#xff1f; 测试方法&#xff08;JS文件的获取以及分析方法1、手工搜索分析2、半自动Burp分析插件介绍…...

windows下配置vue开发环境

安装nodejs&#xff0c;配置npm 1.下载安装包&#xff1a;下载地址&#xff1a;https://nodejs.org/en/download 2.安装node&#xff1a;下载完成后进行安装&#xff0c;记住安装的文件夹。本人安装路径为 D:\Program Files\nodejs 3.配置环境变量&#xff1a; ①安装完成后…...

AndroidTV 获取焦点View放大效果实现方式

需求 电视开发最常见的就是view获焦后要有放大效果&#xff0c;让用户明显看到。这里总结两个实现方法&#xff0c;以后遇到其他的再补充。 方式一&#xff1a;ViewCompat.animate(view) 1、注册焦点变化监听 mBtnFocus1.setOnFocusChangeListener(this);2、有焦点变化的时…...

访问者模式——操作复杂对象结构

1、简介 1.1、概述 访问者模式是一种较为复杂的行为型设计模式&#xff0c;它包含访问者和被访问元素两个主要组成部分。这些被访问的元素通常具有不同的类型&#xff0c;且不同的访问者可以对它们进行不同的访问操作。访问者模式使得用户可以在不修改现有系统的情况下扩展系…...

指针经典笔试题强训(附图详解)

目录 笔试题1&#xff1a; 解析&#xff1a; 运行结果&#xff1a; 笔试题2 解析&#xff1a; 运行结果&#xff1a; 笔试题3 解析&#xff1a; 运行结果&#xff1a; 笔试题4 解析&#xff1a; 运行结果&#xff1a; 笔试题5 解析&#xff1a; 运行结果&#xff1a;…...

Python:列表(list)与元组(tuple)

列表与元组 列表&#xff1a;list元组&#xff1a;tuple 比较直观的区分&#xff1a;列表是中括号"[ ]“&#xff0c;元组是小括号”( )"元组可以看成列表的只读形式 # 列表 list1 [hello, world] list2 [1, 2, 3, 4, 5] list3 ["a", "b", &…...

技术顶尖却始终赚不到大钱:程序员最容易忽略的那门“手艺”

在技术一线&#xff0c;越来越多程序员把“精通Java”“刷LeetCode”“深挖源码”当成职业护城河。年薪五十万、技术专家头衔、公司核心项目一把抓&#xff0c;看起来前途无量。可真正到职业天花板时&#xff0c;却发现自己和65岁只剩105美元的肯德基上校桑德斯上校陷入了同一个…...

我的Qt实践:融合QTabWidget与AdvancedDocking,打造可定制的Ribbon界面框架【开源分享】

1. 从零开始构建Ribbon界面框架 第一次接触Ribbon界面是在使用Office 2007时&#xff0c;那种将功能按逻辑分组、通过标签页切换的设计让我眼前一亮。后来做Qt开发时&#xff0c;发现很多企业级应用也需要类似的界面风格。经过多次尝试&#xff0c;我发现用QTabWidget配合QSS样…...

怎么安装OpenClaw?2026年4月本地配置Coding Plan零门槛流程

怎么安装OpenClaw&#xff1f;2026年4月本地配置Coding Plan零门槛流程。本文面向零基础用户&#xff0c;完整说明在轻量服务器与本地Windows11、macOS、Linux系统中部署OpenClaw&#xff08;Clawdbot&#xff09;的流程&#xff0c;包含环境配置、服务启动、Skills集成、阿里云…...

别再为SBUS负逻辑头疼了!硬件反相器电路设计与STM32软件避坑全指南

SBUS负逻辑难题终结手册&#xff1a;从硬件反相到STM32配置的工程实践 当你第一次将航模遥控器的SBUS输出端直接连接到自制的STM32飞控板时&#xff0c;那个令人沮丧的时刻——串口调试器里只有乱码或者干脆一片寂静——可能已经成为许多嵌入式开发者的"成人礼"。这…...

从单兵到军团:2026 多智能体协作的崛起与实战全指南

从单兵到军团&#xff1a;2026 多智能体协作的崛起与实战全指南在前三篇文章中&#xff0c;我们拆解了单个AI Agent的技术内核&#xff0c;并盘点了2026年主流框架的选型策略。但企业级场景的复杂程度&#xff0c;正在以肉眼可见的速度超越单一个体的能力天花板。单个“全能实习…...

3000+科研图标免费下载:Bioicons如何让科学可视化变得简单?

3000科研图标免费下载&#xff1a;Bioicons如何让科学可视化变得简单&#xff1f; 【免费下载链接】bioicons A library of free open source icons for science illustrations in biology and chemistry 项目地址: https://gitcode.com/gh_mirrors/bi/bioicons 还在为科…...

阿里妈妈-AI应用算法-暑期实习招聘

...

UWPHook终极指南:一键将UWP游戏和Xbox Game Pass游戏添加到Steam

UWPHook终极指南&#xff1a;一键将UWP游戏和Xbox Game Pass游戏添加到Steam 【免费下载链接】UWPHook &#x1f517; Add your Windows Store or UWP games to Steam 项目地址: https://gitcode.com/gh_mirrors/uw/UWPHook 还在为Steam无法识别Windows Store和Xbox Gam…...

HTML怎么实现成就徽章放大预览_HTML悬停查看大图结构【教程】

用 transform: scale() 实现 hover 图片放大最省事&#xff0c;但需加 overflow: hidden 防溢出、transition 保证平滑、避免 position: absolute 破坏布局&#xff0c;并通过 data-large-src 或 background-image 解决高清图加载&#xff0c;同时适配移动端 touch 和 stacking…...

5G NR上行控制信息复用:PUSCH信道上的UCI资源映射实战解析

1. 5G NR上行控制信息复用基础概念 在5G NR系统中&#xff0c;上行控制信息&#xff08;UCI&#xff09;的传输是保证通信质量的关键环节。UCI通常包含HARQ-ACK反馈、信道状态信息&#xff08;CSI&#xff09;和调度请求&#xff08;SR&#xff09;等重要内容。这些信息可以通过…...