时间戳

首页 > 解决方案 > 套接字 io 仅在最后接收消息

javascript - 套接字 io 仅在最后接收消息

问题描述

我想将视频从烧瓶服务器流式传输到网页。出于测试目的，我只发送文本字符串。问题是客户最后只收到包裹。我必须等待 30 秒，然后才能收到所有消息。当我使用无限循环进行流式传输时，客户端永远不会收到消息。这是我的服务器代码：

from flask import Flask, render_template, request, jsonify
from flask_socketio import SocketIO, emit, send
from flask_cors import CORS
import cv2
import base64
import time
app = Flask(__name__)
app.config['SECRET_KEY'] = 'justasecretkeythatishouldputhere'

socketio = SocketIO(app, cors_allowed_origins="http://localhost:3000", logger=True, engineio_logger=True)
CORS(app)

@socketio.on('connect')
def on_connect(auth):
    print("CONNECTED")

@socketio.on("live")
def live(test):
    cap = cv2.VideoCapture(0)
    counter  = 0
    for _ in range(30):
        counter += 1
        ret,frame = cap.read()
        retval, buffer = cv2.imencode('.jpg', frame)
        send(f"Hi, {counter}")
        time.sleep(1)


if __name__ == '__main__':
    socketio.run(app)

这是我的客户代码：

import {useEffect, useState} from 'react'
import logo from './logo.svg';
import './App.css';
import { io } from "socket.io-client";
function App() {
  const [test, setText] = useState("test")
  useEffect(()=>{
    const socket = io("http://localhost:5000");
    console.log(socket)
    socket.on('message', function (data) {
      console.log(data)
      setText(data)
    });
    socket.emit('live', "data");
  },[])
  return (
    <div className="App">
      {test}
    </div>
  );
}

export default App;

标签： javascriptpythonreactjsflaskwebsocket

解决方案

您是否使用 ASGI Web 服务器来托管此应用程序，可能是 eventlet？

您的主循环一直占用资源并且socketio没有时间通过​​ websocket 发送数据 - 这就是您最后收到所有消息的原因。简单time.sleep的不要释放它。

尝试替换time.sleep(1)为socketio.sleep(0).

推荐阅读