React+Flask-Socket.io:浏览器关闭时客户端的套接字断开事件延迟

Question

我的React组件：

import React, { useState, useEffect } from 'react';
import {Redirect} from "react-router-dom";
import io from "socket.io-client";
function Game({userName, roomCode}) {
const [users, setUsers] = useState([])
useEffect(() => {
const socket = io("http://127.0.0.1:5000")
socket.emit('join', {userName, roomCode})
socket.on('message', (msg) => console.log(msg))
socket.on('updateUsers', (userlist) => {
setUsers(Object.values(userlist))
}) 
return () => {
socket.disconnect()
}
}, [])
const userItems = users.map((element) =>
<li>{element.username}</li>)
return userName === '' ? <Redirect to="/"/> :
(
<div>
<h1>Game Page</h1>
<h2>Users:</h2>
<ul>{userItems}</ul>
</div>
);
}
export default Game;

烧瓶：

from flask import Flask, render_template, request
from flask_socketio import SocketIO, send, join_room, leave_room, emit
from users import UserDB
app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret!'
socketio = SocketIO(app, cors_allowed_origins="*")
db = UserDB()
@socketio.on('join')
def on_join(data):
print("Joining!")
username = data['userName']
room = data['roomCode']
join_room(room)
db.add_user(request.sid, username, room)
room_list = db.get_room_users(room)
emit('updateUsers', room_list, broadcast=True, room=room)

@socketio.on('disconnect')
def on_leave():
user = db.delete_user(request.sid)
room = user['room']
room_list = db.get_room_users(room)
emit('updateUsers', room_list, broadcast = True, room = room)
print('disconnection!')

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

现在，如果我按下浏览器(使用React Router(，组件将卸载，套接字将立即断开。然而，如果我合上标签，插座只会在大约一分钟后断开。我如何做到浏览器/选项卡一关闭套接字就断开连接(在Vanilla JS上的工作方式(？

Answer 1

请参阅中的烧瓶套

编辑ping_timeout和ping_interval选项以找到合适的答案。

socketio = SocketIO(app, cors_allowed_origins="*")