（亲测可用！！） python Flask websocket 实现时间实时推送demo

原创已于 2022-10-21 11:03:48 修改 · 1.9k 阅读

17 ·

CC 4.0 BY-SA版权

文章标签：

#python #flask #websocket

于 2022-10-20 19:17:08 首次发布

工具同时被 2 个专栏收录

56 篇文章

订阅专栏

python 后端

32 篇文章

订阅专栏

本文展示了如何使用Gevent、Flask-Sockets和WebSocket创建一个实时通信服务器。通过Python的Flask框架，结合Gevent的 monkey.patch_all() 进行异步处理，实现了WebSocket路由 '/test'，每当接收到客户端消息时，服务器会发送当前时间，并将接收到的消息打印出来。客户端则使用JavaScript建立WebSocket连接，接收并显示服务器发送的时间，同时将接收到的消息回传给服务器。

效果：

Sever：

import time
from flask_sockets import Sockets
from gevent import monkey
from flask import Flask,jsonify
from gevent import pywsgi
from geventwebsocket.handler import WebSocketHandler

monkey.patch_all()

app = Flask(__name__)
sockets = Sockets(app)

@sockets.route('/test')  # 指定路由
def echo_socket(ws):
    while not ws.closed:
        ws.send(str(time.asctime()))  # 给clicent传时间

        message = ws.receive()  # 接收到消息
        if message is not None:
            print("receive msg==> ",  str(message))
            # ws.send(str(json.dumps(message)))  # 回传给clicent
        else:
            print("no receive")
        time.sleep(1)

@app.route('/')
def hello():
    return jsonify(msg="ok")

if __name__ == "__main__":
    server = pywsgi.WSGIServer(('0.0.0.0', 5000), app, handler_class=WebSocketHandler)
    print('server start')
    server.serve_forever()

Client：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcss.com/jquery/3.2.0/jquery.js"></script>
</head>
<body>
    <div id="time" style="width: 300px;height: 50px;background-color: #0C0C0C;
    color: white;text-align: center;line-height: 50px;margin-left: 40%;font-size: 20px"></div>

    <script>
        function f() {
            var ws = new WebSocket("ws://127.0.0.1:5000/test");

            ws.onmessage = function (event) {  //当客户端收到服务端发来的消息时，触发onmessage事件，参数e.data包含server传递过来的数据
                content = document.createTextNode(event.data);
                $("#time").html(content);
                ws.send("已接收："+event.data);
            };
        }
        f();

    </script>
    </body>
</html>

注：我的Flask版本是2.1.2,安装的Werkzeug版本是1.0.1，可以不用管安装过程中的ERROR

pip install Werkzeug==1.0.1 -i https://mirrors.aliyun.com/pypi/simple/