js做qq聊天代码

// 创建 WebSocket 连接
const socket = new WebSocket('ws://example.com/socketserver');

// 连接打开时的事件处理
socket.addEventListener('open', function (event) {
    socket.send('Hello Server!');
});

// 接收消息的事件处理
socket.addEventListener('message', function (event) {
    console.log('Message from server:', event.data);
    // 更新聊天界面
    const messagesList = document.getElementById('messages');
    const newMessage = document.createElement('li');
    newMessage.textContent = event.data;
    messagesList.appendChild(newMessage);
});

// 发送消息的函数
function sendMessage(message) {
    if (socket.readyState === WebSocket.OPEN) {
        socket.send(message);
    } else {
        console.error('WebSocket is not open. Current state:', socket.readyState);
    }
}

// 假设有一个发送按钮和一个文本框
document.getElementById('sendButton').addEventListener('click', function () {
    const input = document.getElementById('messageInput');
    sendMessage(input.value);
    input.value = ''; // 清空输入框
});

// 心跳机制示例
setInterval(function() {
    if (socket.readyState === WebSocket.OPEN) {
        socket.send('ping');
    }
}, 30000); // 每30秒发送一次心跳

// 断线重连机制示例
socket.addEventListener('close', function(event) {
    setTimeout(function() {
        connectWebSocket();
    }, 5000); // 5秒后尝试重连
});

function connectWebSocket() {
    const newSocket = new WebSocket('ws://example.com/socketserver');
    // 复制原有事件监听器到新连接
    newSocket.addEventListener('open', function(event) {
        socket = newSocket;
        // 其他事件监听...
    });
    // 其他事件监听...
}