Издатели
- 1 ответ
- 0 вопросов
2
Вклад в тег
let socket;
let cookieUserId = $.cookie('userId');
let reconnectAttempts = 0;
const MAX_RECONNECT_ATTEMPTS = 100;
function tryToConnect() {
socket = new WebSocket('wss:// ... /?userId='+cookieUserId); // замените на ваш адрес сервера
socket.onopen = onSocketOpen;
socket.onmessage = onSocketMessage;
socket.onclose = onSocketClose;
socket.onerror = onSocketError;
}
function onSocketOpen(e) {
console.log('Успешное соединение');
reconnectAttempts = 0; // сбрасываем число попыток при успешном подключении
... // ваш код при успешном соединении
};
function onSocketClose(e) {
console.log('Соединение закрыто. Попытка повторного подключения');
if (reconnectAttempts < MAX_RECONNECT_ATTEMPTS) {
setTimeout(() => tryToConnect(), 2000); // повторное подключение через 1 секунду
reconnectAttempts++;
}
else {
console.log('Слишком много попыток соединения. Соединение невозможно, попробуйте позже');
}
}
function onSocketError(e) {
console.log('Ошибка соединения');
...
}
function onSocketMessage(e) {
console.log('You have a new message');
...
}
document.addEventListener('DOMContentLoaded', () => {
tryToConnect(); // начинаем соединение после загрузки DOM
});
window.onfocus = function(){
console.log('Окно активно');
if (socket.readyState !== 1) { // если за время неактивности окна соединение прервалось
tryToConnect() // подключаемся заново
}
else {
console.log('Соединение до сих пор активно, повторная попытка не требуется. Статус: ' + socket.readyState)
}
}
.statusbar {
height: 15px;
border-radius: 15px;
background-color: blue;
}
<div class="statusbar" style="width=15%"></div>
<div class="statusbar" style="width=65%"></div>
<div class="statusbar" style="width=98%"></div>
...
<div class="statusbar" style="width=5%"></div>