WebSockets - Manejo de errores

Una vez que se ha establecido una conexión entre el cliente y el servidor, openEl evento se dispara desde la instancia de Web Socket. Se generan errores por errores, que se producen durante la comunicación. Está marcado con la ayuda deonerror evento. Onerror siempre va seguido de la terminación de la conexión.

los onerrorEl evento se activa cuando ocurre algo incorrecto entre las comunicaciones. El eventoonerror va seguido de una terminación de conexión, que es un close evento.

Una buena práctica es informar siempre al usuario sobre el error inesperado e intentar volver a conectarlo.

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

Cuando se trata de manejo de errores, debe considerar tanto los parámetros internos como los externos.

  • Los parámetros internos incluyen errores que se pueden generar debido a errores en su código o comportamiento inesperado del usuario.

  • Los errores externos no tienen nada que ver con la aplicación; más bien, están relacionados con parámetros que no se pueden controlar. El más importante es la conectividad de la red.

  • Cualquier aplicación web bidireccional interactiva requiere, bueno, una conexión activa a Internet.

Comprobación de la disponibilidad de la red

Imagine que sus usuarios disfrutan de su aplicación web, cuando de repente la conexión de red deja de responder en medio de su tarea. En las aplicaciones móviles y de escritorio nativas modernas, es una tarea común verificar la disponibilidad de la red.

La forma más común de hacerlo es simplemente realizando una solicitud HTTP a un sitio web que se supone que está activo (por ejemplo, http://www.google.com). Si la solicitud tiene éxito, el escritorio o el dispositivo móvil saben que hay conectividad activa. Del mismo modo, HTML tieneXMLHttpRequest para determinar la disponibilidad de la red.

Sin embargo, HTML5 lo hizo aún más fácil e introdujo una forma de verificar si el navegador puede aceptar respuestas web. Esto se logra a través del objeto del navegador -

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

El modo sin conexión significa que el dispositivo no está conectado o que el usuario ha seleccionado el modo sin conexión en la barra de herramientas del navegador.

A continuación se explica cómo informar al usuario que la red no está disponible e intentar volver a conectarse cuando se produce un evento de cierre de WebSocket:

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 para recibir mensajes de error

El siguiente programa explica cómo mostrar mensajes de error usando Web Sockets:

<!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>

La salida es la siguiente: