WebSockets - Ouverture de connexions

Une fois qu'une connexion a été établie entre le client et le serveur, l'événement open est déclenché à partir de l'instance Web Socket. Il est appelé comme prise de contact initiale entre le client et le serveur.

L'événement, qui est déclenché une fois la connexion établie, est appelé onopen. La création de connexions Web Socket est vraiment simple. Tout ce que vous avez à faire est d'appeler leWebSocket constructor et transmettez l'URL de votre serveur.

Le code suivant est utilisé pour créer une connexion Web Socket -

// Create a new WebSocket.
var socket = new WebSocket('ws://echo.websocket.org');

Une fois la connexion établie, l'événement open sera déclenché sur votre instance Web Socket.

onopen fait référence à la négociation initiale entre le client et le serveur qui a conduit à la première transaction et l'application Web est prête à transmettre les données.

L'extrait de code suivant décrit l'ouverture de la connexion du protocole Web Socket -

socket.onopen = function(event) {
   console.log(“Connection established”);
   // Display user friendly messages for the successful establishment of connection
   var.label = document.getElementById(“status”);
   label.innerHTML = ”Connection established”;
}

Il est recommandé de fournir un retour d'information approprié aux utilisateurs qui attendent que la connexion Web Socket soit établie. Cependant, il est toujours noté que les connexions Web Socket sont relativement rapides.

La démo de la connexion Web Socket établie est documentée dans l'URL donnée - https://www.websocket.org/echo.html

Un instantané de l'établissement de la connexion et de la réponse à l'utilisateur est présenté ci-dessous -

L'établissement d'un état ouvert permet une communication en duplex intégral et le transfert des messages jusqu'à ce que la connexion soit terminée.

Exemple

Création du fichier client-HTML5.

<!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)
         };
      }
	
      function onOpen(evt) {
         writeToScreen("CONNECTED");
      }
	
      window.addEventListener("load", init, false);
   
   </script>

   <h2>WebSocket Test</h2>
   <div id = "output"></div>

</html>

La sortie sera la suivante -

Le fichier HTML5 et JavaScript ci-dessus montre l'implémentation de deux événements de Web Socket, à savoir -

  • onLoad ce qui aide à la création d'objet JavaScript et à l'initialisation de la connexion.

  • onOpen établit la connexion avec le serveur et envoie également l'état.