Uncaught InvalidStateError: Не удалось выполнить 'send' в 'WebSocket': все еще в состоянии CONNECTING
Когда моя страница загружается, я пытаюсь отправить сообщение send
на сервер, чтобы инициировать соединение, но оно не работает. Этот блок script находится в верхней части моего файла:
var connection = new WrapperWS();
connection.ident();
// var autoIdent = window.addEventListener('load', connection.ident(), false);
В большинстве случаев я вижу ошибку в заголовке:
Uncaught InvalidStateError: не удалось выполнить 'send' на 'WebSocket': все еще в состоянии CONNECTING
Итак, я попытался исключить catch
исключение, как вы можете видеть ниже, но теперь кажется, что InvalidStateError
не определен и создает ReferenceError
.
Здесь объект-оболочка для моего подключения к сети:
// Define WrapperWS
function WrapperWS() {
if ("WebSocket" in window) {
var ws = new WebSocket("ws://server:8000/");
var self = this;
ws.onopen = function () {
console.log("Opening a connection...");
window.identified = false;
};
ws.onclose = function (evt) {
console.log("I'm sorry. Bye!");
};
ws.onmessage = function (evt) {
// handle messages here
};
ws.onerror = function (evt) {
console.log("ERR: " + evt.data);
};
this.write = function () {
if (!window.identified) {
connection.ident();
console.debug("Wasn't identified earlier. It is now.");
}
ws.send(theText.value);
};
this.ident = function () {
var session = "Test";
try {
ws.send(session);
} catch (error) {
if (error instanceof InvalidStateError) {
// possibly still 'CONNECTING'
if (ws.readyState !== 1) {
var waitSend = setInterval(ws.send(session), 1000);
}
}
}
window.identified = true;
theText.value = "Hello!";
say.click();
theText.disabled = false;
};
};
}
Я тестирую Chromium на Ubuntu.
Ответы
Ответ 1
Вы можете отправлять сообщения через прокси-функцию, которая ожидает, что readyState будет 1.
this.send = function (message, callback) {
this.waitForConnection(function () {
ws.send(message);
if (typeof callback !== 'undefined') {
callback();
}
}, 1000);
};
this.waitForConnection = function (callback, interval) {
if (ws.readyState === 1) {
callback();
} else {
var that = this;
// optional: implement backoff for interval here
setTimeout(function () {
that.waitForConnection(callback, interval);
}, interval);
}
};
Затем используйте this.send
вместо ws.send
и поместите код, который должен быть запущен впоследствии, в обратный вызов:
this.ident = function () {
var session = "Test";
this.send(session, function () {
window.identified = true;
theText.value = "Hello!";
say.click();
theText.disabled = false;
});
};
Для чего-то более упорядоченного вы можете посмотреть на обещания.
Ответ 2
если вы используете один клиентский объект websocket и подключаетесь из случайных мест приложения, тогда объект может находиться в режиме соединения (созерцательный доступ).
если вы хотите обменять только один веб-сайт, тогда
создайте класс с promise и сохраните его в свойстве
class Ws {
get newClientPromise() {
return new Promise((resolve, reject) => {
let wsClient = new WebSocket("ws://demos.kaazing.com/echo");
console.log(wsClient)
wsClient.onopen = () => {
console.log("connected");
resolve(wsClient);
};
wsClient.onerror = error => reject(error);
})
}
get clientPromise() {
if (!this.promise) {
this.promise = this.newClientPromise
}
return this.promise;
}
}
создать singleton
window.wsSingleton = new Ws()
использовать свойство clientPromise в любом месте приложения
window.wsSingleton.clientPromise
.then( wsClient =>{wsClient.send('data'); console.log('sended')})
.catch( error => alert(error) )
http://jsfiddle.net/adqu7q58/11/