Sockets & WebSockets

Sockets : c’est quoi ?

Un socket est une interface de programmation de réseau utilisée pour créer des connexions de communication entre deux ordinateurs sur un réseau. En Java, les sockets sont généralement utilisés pour créer des applications client-serveur.

import java.net.Socket;
Socket socket = new Socket("www.cours-devweb.numerosoft.fr", 80);

Le code ci-dessus crée un nouveau socket qui se connecte à l’hôte “www.example.com” sur le port 80. Une fois la connexion établie, le socket peut être utilisé pour envoyer et recevoir des données à travers la connexion réseau.

A quoi ça sert ?

Voici quelques exemples d’utilisation de sockets en Java :

Créer un serveur Web qui accepte des connexions de navigateurs client et renvoie des pages Web.
Créer un chat en temps réel entre plusieurs utilisateurs.
Créer un jeu en réseau permettant à plusieurs joueurs de jouer ensemble en ligne.
Transmettre des données en temps réel entre deux programmes exécutés sur différentes machines.

Les sockets peuvent être utilisés avec différents protocoles de réseau, tels que TCP et UDP pour créer des applications de différents types.

On peut utiliser un socket TCP pour créer une application de chat en temps réel où les messages doivent être transmis de manière fiable, tandis qu’on peut utiliser un socket UDP pour créer une application de jeu en réseau où la vitesse de transmission des données est plus importante que la qualité de transmission.

Exemple de communication entre un Client et un Serveur

Serveur :

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.io.PrintWriter;
import java.net.ServerSocket;
import java.net.Socket;

public class Server {
  public static void main(String[] args) throws IOException {
    int portNumber = 9099;
    ServerSocket serverSocket = new ServerSocket(portNumber);
    Socket clientSocket = serverSocket.accept();
    PrintWriter out = new PrintWriter(clientSocket.getOutputStream(), true);
    BufferedReader in = new BufferedReader(new InputStreamReader(clientSocket.getInputStream()));
    String inputLine;
    while ((inputLine = in.readLine()) != null) {
      out.println(inputLine);
    }
  }u

Client :

```java
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.io.PrintWriter;
import java.net.Socket;
import java.net.UnknownHostException;

public class Client {
  public static void main(String[] args) throws UnknownHostException, IOException {
    String hostName = "localhost";
    int portNumber = 9099;
    Socket socket = new Socket(hostName, portNumber);
    PrintWriter out = new PrintWriter(socket.getOutputStream(), true);
    BufferedReader in = new BufferedReader(new InputStreamReader(socket.getInputStream()));
    BufferedReader stdIn = new BufferedReader(new InputStreamReader(System.in));
    String userInput;
    while ((userInput = stdIn.readLine()) != null) {
      out.println(userInput);
      System.out.println("echo: " + in.readLine());
    }
  }
}

Pour exécuter cet exemple, vous devez d’abord lancer le serveur en exécutant la classe Serveur. Ensuite, vous pouvez lancer le client en exécutant la classe Client. Le client envoie des messages au serveur, qui les renvoie en utilisant la même connexion de socket. Cet exemple illustre une communication simple client-serveur en utilisant les sockets en Java.

Exécution en console ou avec un IDE

Pour exécuter le serveur et le client de l’exemple de communication client-serveur que je vous ai donné, vous devez d’abord compiler les classes Serveur et Client en utilisant l’outil de compilation javac . Vous pouvez le faire en ouvrant une invite de commandes et en naviguant vers le répertoire où se trouvent les fichiers sources, puis en utilisant la commande suivante :

javac Serveur.java Client.java

Les fichiers Serveur.class et Client.class sont générés (binaires exécutables).

Pour exécuter le serveur, ouvrez une invite de commandes et naviguez vers le répertoire où se trouve le fichier Serveur.class.

Ensuite, utilisez la commande suivante :

java Serveur

Le serveur est lancé et il attend une connexion de la part d’un client !

Pour exécuter votre client, ouvrez une autre terminal pour trouver le fichier Client.class.

Utilisez la commande ci-dessous :

java Client

Cela lancera le client et vous pourrez entrer des messages dans l’invite de commandes.

Le client enverra ces messages au serveur, qui les renverra en utilisant la même connexion de socket.

Vous verrez alors les messages que vous avez envoyés affichés dans l’invite de commandes du client.

Et Voilà !

webSocket : c’est qui ?

C’est une technologie de réseau qui permet d’établir une connexion de communication bidirectionnelle et persistante entre un client et un serveur sur le Web.

Elle a été conçue pour remplacer les technologies de communication de données asynchrones telles que les longues requêtes HTTP et les technologies de notification en temps réel telles que Comet.

Les WebSockets permettent aux clients de se connecter au serveur en utilisant une requête HTTP standard, puis de passer à un mode de communication de données en temps réel en utilisant le même canal de communication. Cela permet aux clients de recevoir des données en temps réel du serveur sans avoir à effectuer de nouvelles requêtes HTTP.

Les WebSockets sont souvent utilisés dans les applications en temps réel telles que les chats, les jeux en réseau et les applications de collaboration en temps réel.

En Java, vous pouvez utiliser la bibliothèque WebSocket pour créer des applications :

Voici un exemple de création d’un serveur WebSocket :

import javax.websocket.OnMessage;
import javax.websocket.server.ServerEndpoint;

@ServerEndpoint("/echo")
public class EchoServer {
  @OnMessage
  public String handleMessage(String message) {
    return "Echo: " + message;
  }
}

Et voici un exemple de création d’un client WebSocket :

import java.net.URI;
import javax.websocket.ClientEndpoint;
import javax.websocket.ContainerProvider;
import javax.websocket.OnMessage;
import javax.websocket.Session;
import javax.websocket.WebSocketContainer;

@ClientEndpoint
public class EchoClient {
private Session session;

public EchoClient(URI endpointURI) {
try {
WebSocketContainer container = ContainerProvider.getWebSocketContainer();
container.connectToServer(this, endpointURI);
} catch (Exception e) {
throw new RuntimeException(e);
}
}

@OnOpen
public void onOpen(Session session) {
this.session = session;
}

@OnMessage
public void onMessage(String message) {
System.out.println("Received message: " + message);
}

public void sendMessage(String message) {
session.getAsyncRemote().sendText(message);
}
}

Pour utiliser ces exemples, vous devez d’abord compiler les classes en utilisant l’outil javac de Java. Ensuite, vous pouvez lancer le serveur en exécutant la classe EchoServer et le client en exécutant la classe EchoClient. Le client enverra des messages au serveur via la connexion WebSocket, et le serveur renverra ces messages en utilisant la même connexion. Cet exemple illustre une communication simple client-serveur en utilisant les WebSockets en Java.

Il est évident que si vous utilisez Eclipse ou Intellij, pas besoin d’effectuer les tâches de compilation puis d’exécution, votre IDE le fait pour vous ;)

Les Différences entre les 2

Il y a plusieurs différences entre les sockets et les WebSockets :

Protocol : Les sockets sont généralement utilisés avec des protocoles de réseau tels que TCP et UDP, tandis que les WebSockets sont basés sur le protocole HTTP et utilisent une nouvelle couche de WebSocket au-dessus de TCP.
Connexion : Les sockets nécessitent généralement une adresse IP et un port pour établir une connexion, tandis que les WebSockets utilisent une URI de type “ws” ou “wss” (pour les connexions sécurisées via SSL) pour se connecter au serveur.
Data transfer : Les sockets permettent la transmission de données binaires et de texte, tandis que les WebSockets ne permettent que la transmission de données de texte.
Compatibilité : Les sockets sont généralement utilisés dans des applications de réseau gérées par l’application, tandis que les WebSockets sont conçus pour être utilisés dans les applications Web et sont donc compatibles avec les navigateurs Web.

En résumé, les sockets sont une interface de programmation de réseau générique qui peut être utilisée avec différents protocoles de réseau pour créer des applications de réseau, tandis que les WebSockets sont une technologie spécifique conçue pour créer des applications de communication en temps réel dans le navigateur Web.

WebSocket et application de chat

Serveur :

import java.util.Collections;
import java.util.HashSet;
import java.util.Set;
import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;

@ServerEndpoint("/chatestula")
public class ChatServeur {
  private static Set<Session> sessions = Collections.synchronizedSet(new HashSet<Session>());

  @OnOpen
  public void onOpen(Session session) {
    sessions.add(session);
  }

  @OnClose
  public void onClose(Session session) {
    sessions.remove(session);
  }

  @OnMessage
  public void onMessage(String message, Session session) {
    for (Session s : sessions) {
      s.getAsyncRemote().sendText(message);
    }
  }
}

Client :

import javax.websocket.ClientEndpoint;
import javax.websocket.ContainerProvider;
import javax.websocket.OnMessage;
import javax.websocket.Session;
import javax.websocket.WebSocketContainer;
import java.net.URI;
import java.util.Scanner;

@ClientEndpoint
public class ChatClient {
  private Session session;

  public ChatClient(URI endpointURI) {
    try {
      WebSocketContainer container = ContainerProvider.getWebSocketContainer();
      container.connectToServer(this, endpointURI);
    } catch (Exception e) {
      throw new RuntimeException(e);
    }
  }

  @OnMessage
  public void onMessage(String message) {
    System.out.println(message);
  }

  public void sendMessage(String message) {
    session.getAsyncRemote().sendText(message);
  }

  public static void main(String[] args) throws Exception {
    ChatClient client = new ChatClient(new URI("ws://localhost:8080/chatestula"));
    Scanner scanner = new Scanner(System.in);
    while (true) {
      String message = scanner.nextLine();
      if (message.equals("exit")) {
        break;
      }
      client.sendMessage(message);
    }
  }
}

Compiler les 2 classes :

javac ChatServeur.java ChatClient.java

Exécuter ChatServeur :

java ChatServer

Exécuter ChatClient :

java ChatClient

Cela lancera le client et vous pourrez entrer des messages dans l’invite de commandes. Le client enverra ces messages au serveur via la connexion WebSocket, et le serveur les renverra à tous les clients connectés en utilisant la même connexion. Vous verrez alors les messages que vous avez envoyés affichés dans l’invite de commandes des autres clients.

Vous pouvez également lancer plusieurs clients et envoyer des messages entre eux via le serveur. Pour arrêter le client, entrez la commande exit dans l’invite de commandes.

WebSocket avec SpringBoot

Vous pouvez facilement utiliser les WebSockets avec Spring Boot en suivant ces étapes :

Ajoutez la dépendance Spring WebSocket à votre projet en utilisant Maven ou Gradle. Pour Maven, ajoutez cette ligne au fichier pom.xml de votre projet :

<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-websocket</artifactId>
</dependency>

Pour Gradle, ajoutez cette ligne au fichier build.gradle de votre projet :

compile("org.springframework.boot:spring-boot-starter-websocket")

Créez une classe de configuration qui étend AbstractWebSocketMessageBrokerConfigurer. Cette classe configurera les WebSockets dans votre application Spring Boot :

import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.config.annotation.AbstractWebSocketMessageBrokerConfigurer;
import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
import org.springframework.web.socket.config.annotation.StompEndpointRegistry;

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {
  @Override
  public void registerStompEndpoints(StompEndpointRegistry registry) {
    registry.addEndpoint("/ws").withSockJS();
  }
}

Cette configuration active le message broker WebSocket et enregistre un point de terminaison de WebSocket avec SockJS à l’URL /ws.

Créez un contrôleur de WebSocket qui gère les messages envoyés et reçus par le serveur. Par exemple, voici comment créer un contrôleur de chat simple :

import org.springframework.messaging.handler.annotation.MessageMapping;
import org.springframework.messaging.handler.annotation.SendTo;
import org.springframework.stereotype.Controller;

@Controller
public class ChatController {
  @MessageMapping("/sendMessage")
  @SendTo("/topic/messages")
  public String sendMessage(String message) {
    return message;
  }
}

Ce contrôleur a une méthode sendMessage qui est mappée à l’URL /sendMessage. Lorsque le serveur reçoit un message à cette URL, il appelle cette méthode et renvoie le message à tous les clients connectés en utilisant le topic /topic/messages.

Créez une vue HTML qui utilise JavaScript pour se connecter au serveur WebSocket et envoyer et recevoir des messages. Voici un exemple de vue HTML simple qui utilise SockJS et STOMP.js pour se connecter au serveur et envoyer et recevoir des messages :

<html>
<head>
  <title>Chat</title>
  <script src="/webjars/sockjs-client/sockjs.min.js"></script>
  <script src="/webjars/stomp-websocket/stomp.min.js"></script>
</head>
<body>
  <form id="chatForm">
    <input id="messageInput" type="text" />
    <button type="submit">Send</button>
  </form>
  <ul id="messages"></ul>
  <script>
    var socket = new SockJS("/ws");
    var stompClient = Stomp.over(socket);
    stompClient.connect({}, function(frame) {
      console.log("Connected: " + frame);
      stompClient.subscribe("/topic/messages", function(message
{
    var li = document.createElement("li");
    li.textContent = message.body;
    document.getElementById("messages").appendChild(li);
    });

document.getElementById("chatForm").addEventListener("submit", function(e) {
e.preventDefault();
var messageInput = document.getElementById("messageInput");
var message = messageInput.value;
stompClient.send("/app/sendMessage", {}, message);
messageInput.value = "";
});
});
</script>
</body>
</html>

Voilà, il y a plus qu’à tester !