Comment envoyer et recevoir des données à l'aide de WebSocket

WebSocket est une technologie qui permet une communication bidirectionnelle en gardant le serveur et le client toujours connectés, de sorte que WebSocket peut à la fois envoyer et recevoir des données. Dans cet article, nous verrons comment envoyer. et recevez des données à l'aide de WebSocket.

Voyons d'abord Comment envoyer des données texte ?

Utilisez le site echo.websocket.org disponible gratuitement comme exemple

L'exemple spécifique est le suivant

var connection = new WebSocket('wss://echo.websocket.org');
 
connection.send('样本数据');

Dans cet exemple, pour voir ce qui se passe Créez une instance WebSocket et envoyez des données à l'aide de la méthode send().

Cependant, les données doivent généralement être transférées à tout moment.

Donc, si vous souhaitez envoyer les données saisies dans le formulaire en cliquant sur un bouton, vous pouvez les écrire comme suit.

btn.addEventListener('click', function(e) {
  var text = document.getElementById('text');
 
  connection.send(text.value);
})

Dans cet exemple, nous récupérons la chaîne saisie dans le formulaire et l'appliquons à l'argument de send().

De cette façon, vous pouvez envoyer n'importe quelle donnée texte.

Comment recevoir des données texte ?

Le serveur de test Echo.websocket.org utilisé cette fois renverra les données transmises telles quelles.

Le code est le suivant

connection.onmessage = function(e) {
    console.log(e.data);
};

Nous utilisons l'événement onmessage(), qui est utilisé pour recevoir des messages de quatre types de traitement d'événements.

Bien qu'il s'agisse d'une simple description, celle-ci seule recevra les données renvoyées par le serveur.

D'ailleurs, lorsque vous utilisez la méthode close() ensemble, l'encodage est le suivant

connection.onmessage = function(e) {
    console.log(e.data);
    connection.close();
};

Dans ce cas, la communication est déconnectée immédiatement après la réception des données.

À ce stade, il convient de noter que si close() déconnecte la communication, la communication ne sera possible que si la connexion est à nouveau établie avec WebSocket !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!