当后端更新结果时，前端可以实时跟进。例如后端输出1，前端更新，当输出结果2时，前端不用刷新跟进显示2
websocket长链接
websocket长链接
参考：https://blog.csdn.net/weixin_34197488/article/details/93599007
如解决 请采纳 谢谢
后端代码：
from flask import Flask, request,render_template
from geventwebsocket.websocket import WebSocket
from gevent.pywsgi import WSGIServer
from geventwebsocket.handler import WebSocketHandler
user_socket_list = []
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/ws')
def ws():
user_socket = request.environ.get('wsgi.websocket') # type:WebSocket
# 建立连接
if user_socket:
user_socket_list.append(user_socket) # 将建立的连接添加进一个列表
print(len(user_socket_list))
else:
print('请用websocket链接')
return render_template('index.html',message='请用websocket链接')
while True:
msg = user_socket.receive()
print(msg)
for socket in user_socket_list:
socket.send(msg)
if __name__ == '__main__':
http_serv = WSGIServer(('0.0.0.0',5000),app,handler_class=WebSocketHandler)
http_serv.serve_forever()
前端代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>
<dvi id='idMsg'>群聊</dvi>
</h1>
<input type='button' value='Test' onclick='test()'>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
var ws = new WebSocket('ws://127.0.0.1:5000/ws');
ws.onmessage = function(data) {
var jdata = JSON.parse(data.data);
$('#idMsg').html(jdata.user + ': ' + jdata.text);
}
function test() {
mydict = {
'user': 'myname',
'text': 'mytext',
};
jdata = JSON.stringify(mydict);
ws.send(jdata)
}
</script>
</body>
</html>
index.html
server.py
import json, time, random
from flask import Flask, render_template
from flask import request
from flask import make_response
from gevent import pywsgi
from geventwebsocket.handler import WebSocketHandler
from threading import Thread
# 实例化产生一个Flask对象
app = Flask(__name__)
WS_LIST = []
count = 0
# flask的路由是基于装饰器的
@app.route('/', methods=['GET', 'POST'])
def hello_world():
return render_template("index.html")
@app.route("/main")
def func():
global count
ws = request.environ.get('wsgi.websocket')
if not ws:
print('【客户端退出1】', str(ws))
return make_response("error", 404)
WS_LIST.append(ws)
print('len(WS_LIST)', len(WS_LIST)) # 客户端数量
while True:
# 等待用户发送消息，并接受
message = ws.receive()
# 关闭：message=None
if not message:
try:
print('【客户端退出2】', str(ws))
WS_LIST.remove(ws)
del ws
print('len(WS_LIST)', len(WS_LIST))
except Exception as e:
print(e)
return make_response("error", 404)
# msg = json.loads(message)
# print(msg)
for item in WS_LIST:
res = json.dumps({'data': count})
item.send(res)
if __name__ == '__main__':
def foo():
global count
while True:
time.sleep(1)
count += 1
print(count)
t1 = Thread(target=foo) # 创建线程对象
t1.start() # 启动线程
server = pywsgi.WSGIServer(('', 6000), app, handler_class=WebSocketHandler)
print('server start http://localhost:6000')
server.serve_forever()
templates/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>text</title>
</head>
<body>
<input type="button" value="按钮" onclick="test()"/>
<div id="one"></div>
<script>
function test() {
let url = "ws://localhost:6000/main"
let ws = new WebSocket(url);
ws.onmessage = function (event) {
document.getElementById('one').innerHTML = event.data;
setTimeout(function () {
ws.send(JSON.stringify({'hello':'world'}));
}, 1000)
};
ws.onopen = function (evt) {
console.log("Websocket open success", url);
ws.send(JSON.stringify({'hello':'world'}));
};
ws.onclose = function (evt) {
console.log("Connection closed.", evt);
ws.close();
};
}
</script>
</body>
</html>
基于falsk的广播，打开多少个客户端都没问题
Flask==1.1.1
Flask-Sockets ==0.2.1
gevent==21.8.0
gevent-websocket==0.10.1
广播操作解决，楼上正确