WebSockets - Fehlerbehandlung

Sobald eine Verbindung zwischen dem Client und dem Server hergestellt wurde, wird eine openEreignis wird von der Web Socket-Instanz ausgelöst. Fehler werden für Fehler generiert, die während der Kommunikation auftreten. Es wird mit Hilfe von markiertonerror Veranstaltung. Onerror Es folgt immer die Beendigung der Verbindung.

Das onerrorEreignis wird ausgelöst, wenn zwischen den Kommunikationen ein Fehler auftritt. Das Ereignisonerror gefolgt von einer Verbindungsbeendigung, die a close Veranstaltung.

Es empfiehlt sich, den Benutzer immer über den unerwarteten Fehler zu informieren und erneut zu versuchen, die Verbindung herzustellen.

socket.onclose = function(event) {
   console.log("Error occurred.");
	
   // Inform the user about the error.
   var label = document.getElementById("status-label");
   label.innerHTML = "Error: " + event;
}

Bei der Fehlerbehandlung müssen sowohl interne als auch externe Parameter berücksichtigt werden.

Zu den internen Parametern gehören Fehler, die aufgrund von Fehlern in Ihrem Code oder unerwartetem Benutzerverhalten generiert werden können.
Externe Fehler haben nichts mit der Anwendung zu tun. Sie beziehen sich vielmehr auf Parameter, die nicht gesteuert werden können. Das wichtigste ist die Netzwerkkonnektivität.
Jede interaktive bidirektionale Webanwendung erfordert eine aktive Internetverbindung.

Überprüfen der Netzwerkverfügbarkeit

Stellen Sie sich vor, Ihre Benutzer genießen Ihre Web-App, wenn die Netzwerkverbindung mitten in ihrer Aufgabe plötzlich nicht mehr reagiert. In modernen nativen Desktop- und Mobilanwendungen ist es eine häufige Aufgabe, die Netzwerkverfügbarkeit zu überprüfen.

Am häufigsten stellen Sie einfach eine HTTP-Anfrage an eine Website, die aktiv sein soll (z. B. http://www.google.com). Wenn die Anforderung erfolgreich ist, weiß der Desktop oder das mobile Gerät, dass eine aktive Verbindung besteht. Ebenso hat HTMLXMLHttpRequest zur Bestimmung der Netzwerkverfügbarkeit.

HTML5 machte es jedoch noch einfacher und führte eine Möglichkeit ein, zu überprüfen, ob der Browser Webantworten akzeptieren kann. Dies wird über das Navigatorobjekt erreicht -

if (navigator.onLine) {
   alert("You are Online");
}else {
   alert("You are Offline");
}

Offline-Modus bedeutet, dass entweder das Gerät nicht verbunden ist oder der Benutzer den Offline-Modus in der Browser-Symbolleiste ausgewählt hat.

So informieren Sie den Benutzer, dass das Netzwerk nicht verfügbar ist, und versuchen, die Verbindung wiederherzustellen, wenn ein WebSocket-Schließereignis auftritt:

socket.onclose = function (event) {
   // Connection closed.
   // Firstly, check the reason.
	
   if (event.code != 1000) {
      // Error code 1000 means that the connection was closed normally.
      // Try to reconnect.
		
      if (!navigator.onLine) {
         alert("You are offline. Please connect to the Internet and try again.");
      }
   }
}

Demo zum Empfang von Fehlermeldungen

Das folgende Programm erklärt, wie Fehlermeldungen mithilfe von Web Sockets angezeigt werden:

<!DOCTYPE html>
<html>
   <meta charset = "utf-8" />
   <title>WebSocket Test</title>

   <script language = "javascript" type = "text/javascript">
      var wsUri = "ws://echo.websocket.org/";
      var output;
		
      function init() {
         output = document.getElementById("output");
         testWebSocket();
      }
		
      function testWebSocket() {
         websocket = new WebSocket(wsUri);
			
         websocket.onopen = function(evt) {
            onOpen(evt)
         };
			
         websocket.onclose = function(evt) {
            onClose(evt)
         };
			
         websocket.onerror = function(evt) {
            onError(evt)
         };
      }
		
      function onOpen(evt) {
         writeToScreen("CONNECTED");
         doSend("WebSocket rocks");
      }
		
      function onClose(evt) {
         writeToScreen("DISCONNECTED");
      }
		
      function onError(evt) {
         writeToScreen('<span style = "color: red;">ERROR:</span> ' + evt.data);
      } 
		
      function doSend(message) {
         writeToScreen("SENT: " + message); websocket.send(message);
      }
		
      function writeToScreen(message) {
         var pre = document.createElement("p"); 
         pre.style.wordWrap = "break-word"; 
         pre.innerHTML = message; output.appendChild(pre);
      }
		
      window.addEventListener("load", init, false);
   </script>
	
   <h2>WebSocket Test</h2>
   <div id = "output"></div>
	
</html>

Die Ausgabe ist wie folgt -