尧图网页设计 
编程语言语言运行时编译器前端【免费下载链接】brythonBrython (Browser Python) is an implementation of Python 3 running in the browser项目地址https://gitcode.com/gh_mirrors/br/brython点击查看免费下载WebSocket 是 HTML5 定义的浏览器与服务器之间双向通信协议。本指南以 Brython 仓库中的官方文档 browser.websocket.md法语版与 英文版 为主体讲解 Brython 中browser.websocket模块的 API、事件模型与完整示例并结合模块源码与 DOMEvent 实现进行原理级剖析。读完本文你将能够在 Brython 应用中建立 WebSocket 连接、收发消息、处理连接生命周期事件并正确应对浏览器不支持 WebSocket 的场景。一、模块概览HTML5 WebSocket 的 Python 封装WebSocket 让客户端与服务器之间可以保持一条持久化、双向、全双工的通信通道常用于实时消息、聊天、协同编辑、行情推送等场景。Brython 在浏览器环境中用 Python 复现了这一能力browser.websocket模块对浏览器原生的WebSocketAPI 做了薄封装暴露给 Python 开发者两个核心符号supported一个布尔值指示当前浏览器是否支持 WebSocket 协议WebSocket(host)一个构造函数用于创建指向指定服务器地址的 WebSocket 连接对象。1.1 源码级实现supported 与 WebSocket 的定义从模块源码 websocket.py 可以看到其实现极其精简from browser import window if hasattr(window, WebSocket): supported True WebSocket window.WebSocket.new else: supported False class WebSocket: def __init__(self, *args): raise NotImplementedError这段源码揭示了三个关键事实supported由浏览器能力探测决定模块导入时即检查window上是否存在WebSocket属性存在则置为True否则为False。WebSocket直接复用浏览器原生构造函数在支持的环境下WebSocket window.WebSocket.new即 Brython 直接调用 JavaScript 原生WebSocket构造函数因此其地址格式、握手行为、帧协议均遵循浏览器实现与服务器端遵循 RFC 6455 的 WebSocket 服务器如wss://加密连接兼容。不支持时优雅降级当浏览器不支持时WebSocket被替换为一个在构造时抛出NotImplementedError的占位类。这与文档所述“如果浏览器不支持 WebSocket将抛出NotImplementedError”完全一致。1.2 构造函数 WebSocket(host)WebSocket(host)的参数_hote_host是支持 WebSocket 协议的服务器地址返回一个WebSocket对象。在实际使用中需要注意地址应使用 WebSocket 专用协议前缀例如wss://echo.websocket.events加密、安全或ws://明文、不安全通常仅限本地开发官方文档示例使用的wss://echo.websocket.events是一个公开的 Echo 测试服务服务器会把客户端发来的消息原样回传非常适合用来验证连接与收发链路如果传入的服务器不支持 WebSocket 握手连接会失败并触发error事件。二、WebSocket 对象的事件模型bind 方法WebSocket对象通过bind(evt, function)方法把 Python 函数关联到对应事件。事件类型与回调函数签名由下表定义内容完整继承自官方文档事件回调函数open无参数函数在与服务器的连接建立后调用一次error无参数函数通信过程中发生错误时调用message接收一个参数的函数参数是DOMEvent实例其data属性保存服务器发来的消息字符串close无参数函数连接关闭时调用2.1 message 事件与 DOMEvent.datamessage事件的回调是唯一带参数的一个browser.DOMEvent实例消息内容存放在其data属性中。DOMEvent 是 Brython 对原生 DOM 事件的统一封装——从 py_dom.js 的实现可以看到Brython 通过$DOMEvent工厂把原生事件对象转换为DOMEvent实例并为其提供data、type、target等一系列属性参见 py_dom.js 的类工厂与 events.md 中“DOMEvent 对象”一节的说明。因此你在回调里通过evt.data拿到的就是服务器下发的原始消息字符串可以直接用于页面渲染或业务逻辑处理。2.2 数据发送与连接关闭除事件绑定外WebSocket对象还提供两个方法send(data)把字符串data发送给服务器close()关闭连接。这两者与 JavaScript 原生WebSocket.send()/.close()一一对应因WebSocket对象直接来自window.WebSocket.new因此还支持原生 API 的其他能力如readyState状态查询但官方文档保证的接口即为上述三个方法加一个布尔量。三、完整实战示例连接、收发与状态管理官方文档附带的示例是一个可直接运行的 HTML 页面三个按钮打开连接、发送、关闭连接加一个文本输入框演示了 WebSocket 生命周期的完整管理。以下为法语版文档示例的完整代码保留了文档中exec_on_load的页面内执行模式与对应按钮 HTMLfrom browser import document, websocket from browser.widgets.dialog import InfoDialog def on_open(evt): document[sendbtn].disabled False document[closebtn].disabled False document[openbtn].disabled True InfoDialog(websocket, Connexion ouverte) def on_message(evt): # message reçu du serveur InfoDialog(websocket, fMessage reçu : {evt.data}) def on_close(evt): # la websocket est fermée InfoDialog(websocket, La connexion est fermée) document[openbtn].disabled False document[closebtn].disabled True document[sendbtn].disabled True ws None def _open(ev): if not websocket.supported: InfoDialog(websocket, WebSocket nest pas pris en charge par votre navigateur) return global ws # open a web socket ws websocket.WebSocket(wss://echo.websocket.events) # attache des fonctions aux événements web sockets ws.bind(open, on_open) ws.bind(message, on_message) ws.bind(close, on_close) def send(ev): data document[data].value if data: ws.send(data) def close_connection(ev): ws.close() document[openbtn].disabled False document[openbtn].bind(click, _open) document[sendbtn].bind(click, send) document[closebtn].bind(click, close_connection)button idopenbtnOuvrir la connexion/button brinput iddatabutton idsendbtn disabledEnvoyer/button pbutton idclosebtn disabledFermer la connexion/button英文版文档 browser.websocket.md 的示例与此结构一致区别在于使用bind(#openbtn, click)装饰器绑定 DOM 事件并显示英文提示文本两者可以对照阅读。3.1 示例逻辑拆解这个示例虽然简短却覆盖了 WebSocket 编程的全部关键环节能力检查_open回调首先检查websocket.supported若浏览器不支持立即弹出InfoDialog提示并return避免后续调用抛出NotImplementedError。这是编写健壮 WebSocket 代码的第一步。连接建立通过websocket.WebSocket(wss://echo.websocket.events)创建连接对象随后用ws.bind(open, on_open)、ws.bind(message, on_message)、ws.bind(close, on_close)绑定三个生命周期事件示例未绑定error实际项目中建议补上以捕获握手失败等错误。UI 状态机通过按钮disabled属性管理连接状态——连接打开前只有“打开连接”可用连接建立后禁用“打开连接”、启用“发送/关闭”连接关闭后恢复初始状态。这套状态迁移逻辑保证了用户不会在无效状态下误操作。消息收发send回调读取输入框document[data].value非空时才调用ws.send(data)on_message通过evt.data展示服务器回传Echo 服务会把消息原样返回的消息。3.2 在 Brython 页面中的集成方式文档示例采用 Brython 的exec_on_load标记页面加载时自动执行脚本块。把它嵌入普通 Brython 页面时你需要在 HTML 中引入brython.js与brython_stdlib.js并执行brython()初始化将脚本块标记为exec_on_load或把代码放入brython标签页面提供 id 分别为openbtn、sendbtn、closebtn、data的元素如需与服务器端配合可参考仓库中 integr.md 关于 Brython 内置websocket()函数实现客户端-服务器 WebSocket 通信的说明搭建同源的服务器端通道。四、要点总结与注意事项API 面极小记忆成本低整个模块只暴露supported与WebSocket(host)两个符号对象方法为bind、send、close务必先查supported再创建连接源码显示不支持时构造会直接抛NotImplementedError用supported做前置判断是官方示例推荐的防御性写法回调签名要严格对应只有message回调接收参数DOMEvent用evt.data取消息open/error/close均无参数写错签名会导致回调异常优先使用wss://生产环境应使用加密 WebSocket 地址文档示例使用的wss://echo.websocket.events是公开测试端点适合本地验证连接生命周期要闭环官方示例用按钮 disabled 状态管理 open→message→close 的完整生命周期实际项目还应绑定error事件并处理断线重连、心跳等场景。凭借 Brython 对浏览器原生 WebSocket 的直接封装Python 开发者无需编写任何 JavaScript 即可在浏览器中完成全双工实时通信本指南中的 API 表格与示例代码可以直接复制用于你自己的实时应用开发。赞分享编程语言语言运行时编译器前端【免费下载链接】brythonBrython (Browser Python) is an implementation of Python 3 running in the browser项目地址https://gitcode.com/gh_mirrors/br/brython点击查看免费下载相关推荐Brython 中的 WebSocket 编程用 browser.websocket 模块在浏览器里实现双向实时通信Brython 中的 WebSocket 编程用 browser.websocket 模块在浏览器里实现双向实时通信 本篇指南围绕 Brython运行在浏览编程语言语言运行时编译器前端3个步骤掌握UsbDkWindows USB设备开发的革命性工具3个步骤掌握UsbDkWindows USB设备开发的革命性工具 想要在Windows平台上绕过复杂的驱动开发流程直接控制USB设备吗UsbDkUSB编程语言语言运行时编译器前端Brython 浏览器端异步编程指南browser.aio 模块的 async/await 实战Brython 浏览器端异步编程指南browser.aio 模块的 async/await 实战 browser.aio 是 Brython 在浏览器环境中实编程语言语言运行时编译器前端上一篇Capital One 混合办公档案全解析Remote In Tech 远程友好科技公司目录的数据建模、渲染与检索原理下一篇Windows B站客户端终极体验告别卡顿享受原生流畅观影创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Brython 浏览器 WebSocket 编程指南：browser.websocket 模块的完整用法与实战示例
编程语言语言运行时编译器前端【免费下载链接】brythonBrython (Browser Python) is an implementation of Python 3 running in the browser项目地址https://gitcode.com/gh_mirrors/br/brython点击查看免费下载WebSocket 是 HTML5 定义的浏览器与服务器之间双向通信协议。本指南以 Brython 仓库中的官方文档 browser.websocket.md法语版与 英文版 为主体讲解 Brython 中browser.websocket模块的 API、事件模型与完整示例并结合模块源码与 DOMEvent 实现进行原理级剖析。读完本文你将能够在 Brython 应用中建立 WebSocket 连接、收发消息、处理连接生命周期事件并正确应对浏览器不支持 WebSocket 的场景。一、模块概览HTML5 WebSocket 的 Python 封装WebSocket 让客户端与服务器之间可以保持一条持久化、双向、全双工的通信通道常用于实时消息、聊天、协同编辑、行情推送等场景。Brython 在浏览器环境中用 Python 复现了这一能力browser.websocket模块对浏览器原生的WebSocketAPI 做了薄封装暴露给 Python 开发者两个核心符号supported一个布尔值指示当前浏览器是否支持 WebSocket 协议WebSocket(host)一个构造函数用于创建指向指定服务器地址的 WebSocket 连接对象。1.1 源码级实现supported 与 WebSocket 的定义从模块源码 websocket.py 可以看到其实现极其精简from browser import window if hasattr(window, WebSocket): supported True WebSocket window.WebSocket.new else: supported False class WebSocket: def __init__(self, *args): raise NotImplementedError这段源码揭示了三个关键事实supported由浏览器能力探测决定模块导入时即检查window上是否存在WebSocket属性存在则置为True否则为False。WebSocket直接复用浏览器原生构造函数在支持的环境下WebSocket window.WebSocket.new即 Brython 直接调用 JavaScript 原生WebSocket构造函数因此其地址格式、握手行为、帧协议均遵循浏览器实现与服务器端遵循 RFC 6455 的 WebSocket 服务器如wss://加密连接兼容。不支持时优雅降级当浏览器不支持时WebSocket被替换为一个在构造时抛出NotImplementedError的占位类。这与文档所述“如果浏览器不支持 WebSocket将抛出NotImplementedError”完全一致。1.2 构造函数 WebSocket(host)WebSocket(host)的参数_hote_host是支持 WebSocket 协议的服务器地址返回一个WebSocket对象。在实际使用中需要注意地址应使用 WebSocket 专用协议前缀例如wss://echo.websocket.events加密、安全或ws://明文、不安全通常仅限本地开发官方文档示例使用的wss://echo.websocket.events是一个公开的 Echo 测试服务服务器会把客户端发来的消息原样回传非常适合用来验证连接与收发链路如果传入的服务器不支持 WebSocket 握手连接会失败并触发error事件。二、WebSocket 对象的事件模型bind 方法WebSocket对象通过bind(evt, function)方法把 Python 函数关联到对应事件。事件类型与回调函数签名由下表定义内容完整继承自官方文档事件回调函数open无参数函数在与服务器的连接建立后调用一次error无参数函数通信过程中发生错误时调用message接收一个参数的函数参数是DOMEvent实例其data属性保存服务器发来的消息字符串close无参数函数连接关闭时调用2.1 message 事件与 DOMEvent.datamessage事件的回调是唯一带参数的一个browser.DOMEvent实例消息内容存放在其data属性中。DOMEvent 是 Brython 对原生 DOM 事件的统一封装——从 py_dom.js 的实现可以看到Brython 通过$DOMEvent工厂把原生事件对象转换为DOMEvent实例并为其提供data、type、target等一系列属性参见 py_dom.js 的类工厂与 events.md 中“DOMEvent 对象”一节的说明。因此你在回调里通过evt.data拿到的就是服务器下发的原始消息字符串可以直接用于页面渲染或业务逻辑处理。2.2 数据发送与连接关闭除事件绑定外WebSocket对象还提供两个方法send(data)把字符串data发送给服务器close()关闭连接。这两者与 JavaScript 原生WebSocket.send()/.close()一一对应因WebSocket对象直接来自window.WebSocket.new因此还支持原生 API 的其他能力如readyState状态查询但官方文档保证的接口即为上述三个方法加一个布尔量。三、完整实战示例连接、收发与状态管理官方文档附带的示例是一个可直接运行的 HTML 页面三个按钮打开连接、发送、关闭连接加一个文本输入框演示了 WebSocket 生命周期的完整管理。以下为法语版文档示例的完整代码保留了文档中exec_on_load的页面内执行模式与对应按钮 HTMLfrom browser import document, websocket from browser.widgets.dialog import InfoDialog def on_open(evt): document[sendbtn].disabled False document[closebtn].disabled False document[openbtn].disabled True InfoDialog(websocket, Connexion ouverte) def on_message(evt): # message reçu du serveur InfoDialog(websocket, fMessage reçu : {evt.data}) def on_close(evt): # la websocket est fermée InfoDialog(websocket, La connexion est fermée) document[openbtn].disabled False document[closebtn].disabled True document[sendbtn].disabled True ws None def _open(ev): if not websocket.supported: InfoDialog(websocket, WebSocket nest pas pris en charge par votre navigateur) return global ws # open a web socket ws websocket.WebSocket(wss://echo.websocket.events) # attache des fonctions aux événements web sockets ws.bind(open, on_open) ws.bind(message, on_message) ws.bind(close, on_close) def send(ev): data document[data].value if data: ws.send(data) def close_connection(ev): ws.close() document[openbtn].disabled False document[openbtn].bind(click, _open) document[sendbtn].bind(click, send) document[closebtn].bind(click, close_connection)button idopenbtnOuvrir la connexion/button brinput iddatabutton idsendbtn disabledEnvoyer/button pbutton idclosebtn disabledFermer la connexion/button英文版文档 browser.websocket.md 的示例与此结构一致区别在于使用bind(#openbtn, click)装饰器绑定 DOM 事件并显示英文提示文本两者可以对照阅读。3.1 示例逻辑拆解这个示例虽然简短却覆盖了 WebSocket 编程的全部关键环节能力检查_open回调首先检查websocket.supported若浏览器不支持立即弹出InfoDialog提示并return避免后续调用抛出NotImplementedError。这是编写健壮 WebSocket 代码的第一步。连接建立通过websocket.WebSocket(wss://echo.websocket.events)创建连接对象随后用ws.bind(open, on_open)、ws.bind(message, on_message)、ws.bind(close, on_close)绑定三个生命周期事件示例未绑定error实际项目中建议补上以捕获握手失败等错误。UI 状态机通过按钮disabled属性管理连接状态——连接打开前只有“打开连接”可用连接建立后禁用“打开连接”、启用“发送/关闭”连接关闭后恢复初始状态。这套状态迁移逻辑保证了用户不会在无效状态下误操作。消息收发send回调读取输入框document[data].value非空时才调用ws.send(data)on_message通过evt.data展示服务器回传Echo 服务会把消息原样返回的消息。3.2 在 Brython 页面中的集成方式文档示例采用 Brython 的exec_on_load标记页面加载时自动执行脚本块。把它嵌入普通 Brython 页面时你需要在 HTML 中引入brython.js与brython_stdlib.js并执行brython()初始化将脚本块标记为exec_on_load或把代码放入brython标签页面提供 id 分别为openbtn、sendbtn、closebtn、data的元素如需与服务器端配合可参考仓库中 integr.md 关于 Brython 内置websocket()函数实现客户端-服务器 WebSocket 通信的说明搭建同源的服务器端通道。四、要点总结与注意事项API 面极小记忆成本低整个模块只暴露supported与WebSocket(host)两个符号对象方法为bind、send、close务必先查supported再创建连接源码显示不支持时构造会直接抛NotImplementedError用supported做前置判断是官方示例推荐的防御性写法回调签名要严格对应只有message回调接收参数DOMEvent用evt.data取消息open/error/close均无参数写错签名会导致回调异常优先使用wss://生产环境应使用加密 WebSocket 地址文档示例使用的wss://echo.websocket.events是公开测试端点适合本地验证连接生命周期要闭环官方示例用按钮 disabled 状态管理 open→message→close 的完整生命周期实际项目还应绑定error事件并处理断线重连、心跳等场景。凭借 Brython 对浏览器原生 WebSocket 的直接封装Python 开发者无需编写任何 JavaScript 即可在浏览器中完成全双工实时通信本指南中的 API 表格与示例代码可以直接复制用于你自己的实时应用开发。赞分享编程语言语言运行时编译器前端【免费下载链接】brythonBrython (Browser Python) is an implementation of Python 3 running in the browser项目地址https://gitcode.com/gh_mirrors/br/brython点击查看免费下载相关推荐Brython 中的 WebSocket 编程用 browser.websocket 模块在浏览器里实现双向实时通信Brython 中的 WebSocket 编程用 browser.websocket 模块在浏览器里实现双向实时通信 本篇指南围绕 Brython运行在浏览编程语言语言运行时编译器前端3个步骤掌握UsbDkWindows USB设备开发的革命性工具3个步骤掌握UsbDkWindows USB设备开发的革命性工具 想要在Windows平台上绕过复杂的驱动开发流程直接控制USB设备吗UsbDkUSB编程语言语言运行时编译器前端Brython 浏览器端异步编程指南browser.aio 模块的 async/await 实战Brython 浏览器端异步编程指南browser.aio 模块的 async/await 实战 browser.aio 是 Brython 在浏览器环境中实编程语言语言运行时编译器前端上一篇Capital One 混合办公档案全解析Remote In Tech 远程友好科技公司目录的数据建模、渲染与检索原理下一篇Windows B站客户端终极体验告别卡顿享受原生流畅观影创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考