WebSockets - Penanganan Kesalahan

Setelah koneksi dibuat antara klien dan server, file openacara dipecat dari instance Web Socket. Kesalahan dihasilkan untuk kesalahan, yang terjadi selama komunikasi. Itu ditandai dengan bantuanonerror peristiwa. Onerror selalu diikuti dengan pemutusan koneksi.

Itu onerroracara dipecat ketika sesuatu yang salah terjadi antara komunikasi. Acaraonerror diikuti dengan pemutusan koneksi, yaitu a close peristiwa.

Praktik yang baik adalah selalu memberi tahu pengguna tentang kesalahan tak terduga dan mencoba menyambungkannya kembali.

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

Dalam hal penanganan error, Anda harus mempertimbangkan parameter internal dan eksternal.

  • Parameter internal termasuk kesalahan yang dapat dihasilkan karena bug dalam kode Anda, atau perilaku pengguna yang tidak terduga.

  • Kesalahan eksternal tidak ada hubungannya dengan aplikasi; melainkan, mereka terkait dengan parameter, yang tidak dapat dikontrol. Yang terpenting adalah konektivitas jaringan.

  • Setiap aplikasi web dua arah interaktif membutuhkan koneksi Internet yang aktif.

Memeriksa Ketersediaan Jaringan

Bayangkan pengguna Anda menikmati aplikasi web Anda, ketika tiba-tiba koneksi jaringan menjadi tidak responsif di tengah tugas mereka. Dalam aplikasi desktop dan seluler asli modern, memeriksa ketersediaan jaringan adalah tugas umum.

Cara paling umum untuk melakukannya adalah dengan membuat permintaan HTTP ke situs web yang seharusnya aktif (misalnya, http://www.google.com). Jika permintaan berhasil, desktop atau perangkat seluler mengetahui ada konektivitas yang aktif. Demikian pula dengan HTMLXMLHttpRequest untuk menentukan ketersediaan jaringan.

HTML5, bagaimanapun, membuatnya lebih mudah dan memperkenalkan cara untuk memeriksa apakah browser dapat menerima tanggapan web. Ini dicapai melalui objek navigator -

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

Mode offline berarti perangkat tidak terhubung atau pengguna telah memilih mode offline dari toolbar browser.

Berikut adalah cara memberi tahu pengguna bahwa jaringan tidak tersedia dan mencoba menyambung kembali ketika peristiwa penutupan WebSocket terjadi -

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 untuk menerima pesan kesalahan

Program berikut menjelaskan cara menampilkan pesan kesalahan menggunakan 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>

Outputnya adalah sebagai berikut -