flask使用websocket
2024-08-25 05:49:09
flask使用websocket
1.概述
flask实现websocket有两种方式:flask_sockets,Flask-SocketIO。
flask_sockets:该方式是flask对websocket的最原始封装,功能较为单一;
Flask-SocketIO:该方式所能提供功能较多,不但实现了socket的基本通信功能,也可以结合flask相关接口,使其更加完备。
2.flask-sockets实验
2.1 环境配置
安装flask-sockets包,版本0.2.1
pip install flask-sockets
2.2 后端
2.2.1 route
路由包括两部分,其一为页面路由,其二为后台数据交换路由。
def handle_route_websocket_simple(app): @app.route('/ws/test_1')
def page_ws_test_1():
return render_template('websocket_test.html', title="websocket test") # websocket
def handle_route_websocket(app_socket): @app_socket.route('/ws/test_2')
def page_websocket_test(ws):
now = time.strftime('%Y-%m-%d-%H-%M-%S', time.localtime(time.time()))
while not ws.closed:
# 回传给clicent
message = ws.receive() # 接收到消息
if message is not None:
print("client says(%s): %s" %(now, message))
ws.send(str("回执:server已收到消息!-- %s " % now))
ws.send(str(json.dumps(message))) # 回传给clicent
else:
print(now, "no receive")
添加路由是用方法完成的,后面两句是看一下路由映射关系。
# websocket页面
from flask_sockets import Sockets
app_socket = Sockets(app) from .routes import handle_route_websocket, handle_route_websocket_simple
handle_route_websocket_simple(app)
handle_route_websocket(app_socket) print(app_socket.url_map)
print(app.url_map)
路由映射关系:
Map([<Rule '/ws/test_2' -> <function handle_route_websocket.<locals>.page_websocket_test at 0x0000009D88A83620>>])
Map([
<Rule '/ws/test_1' (GET, OPTIONS, HEAD) -> page_ws_test_1>,
<Rule '/hello' (GET, OPTIONS, HEAD) ->hello>,
<Rule '/static/<filename>' (GET, OPTIONS, HEAD) -> static>])
2.2.2 启动服务器
因为返回来的报文有websocket和HTTP两种,需要在WSGI中进行区分。
具体可以看下WebSocketHandler,此处略。
def run_app_websocket():
app_websocket = WSGIServer(('0.0.0.0', 9000), flask_app, handler_class=WebSocketHandler)
app_websocket.serve_forever() if __name__ == '__main__':
pass
#run_app()
run_app_websocket()
2.3 前端
<html>
<head>
<meta charset="utf-8" />
<title>websocket 测试</title>
<script src="https://cdn.bootcss.com/jquery/3.2.0/jquery.js">
</script>
<script type="text/javascript">
function WebSocketTest()
{
if ("WebSocket" in window)
{
// alert("您的浏览器支持 WebSocket!");
// 打开一个 web socket
var ws = new WebSocket("ws://localhost:9000/ws/test_2");
ws.onopen = function(){
// Web Socket 已连接上,使用 send() 方法发送数据
ws.send("请发送数据");
$("#r_s").append("数据发送中...<br>")
};
ws.onmessage = function (evt){
var received_msg = evt.data;
$("#r_s").append("server says: "+decodeURI(received_msg)+"<br>")
//ws.send("数据已收到。")
};
ws.onclose = function(){
// 关闭 websocket
ws.send("正在关闭连接...")
$("#r_s").append("连接已关闭...<br>")
};
}
else {
// 浏览器不支持 WebSocket
alert("您的浏览器不支持 WebSocket!");
}
}
</script>
</head>
<body>
<div id="sse">
<a href="javascript:WebSocketTest()">运行 WebSocket</a>
</div>
<div id="r_s">
操作记录:
<br />
</div>
</body>
</html>
3.测试结果
后端:
client says(2019-09-27-19-54-33): 请发送数据
页面:
操作记录:
数据发送中...
server says: 回执:server已收到消息!-- 2019-09-27-19-54-33
server says: 第0条消息。。。
server says: 第1条消息。。。
server says: 第2条消息。。。
server says: 第3条消息。。。
server says: 第4条消息。。。
server says: 第5条消息。。。
server says: 第6条消息。。。
server says: 第7条消息。。。
server says: 第8条消息。。。
server says: 第9条消息。。。
连接已关闭...
最新文章
- ios打包
- 第13章 Windows内存体系结构
- 第七章 美化DetailView界面
- SpringMVC常用注解,返回方式,路径匹配形式,验证
- 数据库连接池 c3p0 demo 代码和分析
- HW5.13
- PHP.INI常用设置一览表(持续更新)
- SharePoint管理中心来配置资源限制(大名单)
- 移动端默认返回按键,使用h5+修改默认事件
- 去掉谷歌input记住账号或密码时默认出现的黄色背景
- Java中newInstance()和new()区别
- TensorFlow object detection API
- Converting Python Virtual Machine Code to C
- java 线程Thread 技术--方法演示生产与消费模式
- ArcGIS for JavaScript 关于路径开发的一些记录(一)
- ny236 心急的C小加 hdoj1051 Wooden Sticks
- 第三百一十三节,Django框架,Session
- JavaWeb温习之Session对象
- 毒害一代Java程序猿的HttpClient
- Js复制链接代码
热门文章
- 简单易用,用Powershell劫持Windows系统快捷键
- 题解【AcWing177】噩梦
- [CodeForces]Educational Round 52
- java基础之I/O操作
- 第一篇,VScode插架以及配置项
- 跨表更新,Mysql Update Join
- angular6 路由拼接查询参数如 ?id=1 并获取url参数
- jenkins+maven配置findbugs+checkstyle+pmd
- noobSTL-1-配置器-1
- win7 安装asp.net v4.0