单客户端能否建立多个Socket.IO连接且不丢失原有连接？

问题根因 #

Socket.IO客户端默认会复用已有的连接实例，你直接新增第二个io.connect调用时，客户端会默认尝试复用第一个连接的配置，不会真正创建新的独立连接，因此只有第一个连接生效。

客户端修改（templates/chat.html） #

核心是创建连接时添加{forceNew: true}参数强制生成独立连接，同时用对象存储所有连接实例方便后续管理。修改后的JS部分代码如下：

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.3.0/socket.io.js"></script>
<script>
    // 配置所有需要连接的局域网服务地址
    const serviceNodes = [
        "http://192.168.1.2:5000", // Bob的服务
        "http://192.168.1.3:5000", // Frank的服务
        // 可继续添加其他设备的服务地址
    ]
    // 存储所有连接实例，key为服务地址，value为socket实例
    const socketInstances = {}

    serviceNodes.forEach(nodeUrl => {
        // 核心参数forceNew: true，强制创建独立连接
        socketInstances[nodeUrl] = io.connect(nodeUrl, {forceNew: true})
        const currentSocket = socketInstances[nodeUrl]

        // 每个连接的连接成功回调
        currentSocket.on('connect', function() {
            currentSocket.emit('join_room',{
                username: "{{ username }}",
                room: "{{ room }}"
            })
        })

        // 每个连接的加入通知回调，可自定义区分来源
        currentSocket.on('join_room_announce', function (data) {
            alert(`[来自${nodeUrl}的通知] ${data.username}加入房间`)
        })

        // 后续发送消息、接收消息逻辑都可按此模式扩展
    })

    // 示例：发送消息时遍历所有连接同步发送
    document.querySelector('form').addEventListener('submit', function(e) {
        e.preventDefault()
        const msg = document.querySelector('input').value.trim()
        if (!msg) return
        Object.values(socketInstances).forEach(socket => {
            socket.emit('send_message', {
                username: "{{ username }}",
                content: msg
            })
        })
        document.querySelector('input').value = ''
    })
</script>

服务端修改（app.py） #

如果仅需要实现单客户端同时连接多个服务的能力，原服务端代码无需修改。如果需要补充消息收发的广播逻辑，可新增如下事件处理：

@socketio.on('send_message')
def handle_message(data):
    # 向当前房间的所有成员广播消息
    socketio.emit('receive_message', data, room=data['room'])

然后在客户端对应添加receive_message事件的监听逻辑，把消息渲染到页面即可。

扩展优化建议 #

• 可把服务节点列表改成动态配置，在首页增加输入框让用户手动添加局域网内其他设备的IP，无需硬编码在前端代码中
• 可在服务端新增节点发现接口，所有设备启动后自动上报自身IP，客户端加载时自动拉取所有在线节点列表自动完成连接
• 消息展示时可增加来源IP标识，方便区分不同设备发来的消息

内容的提问来源于stack exchange，提问作者NIGHT077