Intro aux WebSockets avec Spring

Introduction aux WebSockets avec Spring

1. Vue d'ensemble

Dans cet article, nous allons créer une application Web simple qui implémente la messagerie à l'aide desnew WebSocket capabilities introduits avec Spring Framework 4.0.

WebSockets est unbi-directional,full-duplex,persistent connection entre un navigateur Web et un serveur. Une fois la connexion WebSocket établie, la connexion reste ouverte jusqu'à ce que le client ou le serveur décide de fermer cette connexion.

Un cas d'utilisation typique pourrait être lorsqu'une application implique que plusieurs utilisateurs communiquent entre eux, comme dans une discussion en ligne. [#result_box]#We will build a simple chat client in our example. #

2. Dépendances Maven

Puisqu'il s'agit d'un projet basé sur Maven, nous ajoutons d'abord les dépendances requises auxpom.xml:


    org.springframework
    spring-websocket
    4.2.4.RELEASE



    org.springframework
    spring-messaging
    4.2.4.RELEASE

De plus, comme nous utiliseronsJSON pour construire le corps de nos messages, nous devons ajouter les dépendances deJackson. Cela permet à Spring de convertir notre objet Java vers / depuisJSON:


    com.fasterxml.jackson.core
    jackson-core
    2.7.3



    com.fasterxml.jackson.core
    jackson-databind
    2.7.3

Si vous souhaitez obtenir la dernière version des bibliothèques ci-dessus, recherchez-les surMaven Central.

3. Activer WebSocket au printemps

La première chose à faire est d'activer les fonctionnalités WebSocket. Pour ce faire, nous devons ajouter une configuration à notre application et annoter cette classe avec@EnableWebSocketMessageBroker.

Comme son nom l'indique, il permet la gestion des messages WebSocket, appuyée par un courtier de messages:

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {

    @Override
    public void configureMessageBroker(MessageBrokerRegistry config) {
        config.enableSimpleBroker("/topic");
        config.setApplicationDestinationPrefixes("/app");
    }

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
         registry.addEndpoint("/chat");
         registry.addEndpoint("/chat").withSockJS();
    }
}

Here, we can see that la méthodeconfigureMessageBroker est utilisée pourconfigure the message broker. Tout d'abord, nous permettons à un courtier de messages en mémoire de ramener les messages au client sur des destinations préfixées par «/ topic».

Configuration de We complete our simple en désignant le préfixe «/ app» pour filtrer les destinations ciblant les méthodes annotées de l'application (via@MessageMapping).

La méthoderegisterStompEndpoints enregistre le point de terminaison «/ chat», activantSpring’s STOMP support. N'oubliez pas que nous ajoutons également ici un point d'extrémité fonctionnant sans SockJS pour des raisons d'élasticité.

Ce point de terminaison, lorsqu'il est préfixé par «/ app», est le point de terminaison que la méthodeChatController.send() est mappée pour gérer.

Il est égalementenables the SockJS fallback options, afin que des options de messagerie alternatives puissent être utilisées si les WebSockets ne sont pas disponibles. Cela est utile car WebSocket n'est pas encore pris en charge par tous les navigateurs et peut être empêché par des proxys réseau restrictifs.

Les solutions de secours permettent aux applications d'utiliser une API WebSocket mais se dégradent gracieusement en alternatives non WebSocket lorsque cela est nécessaire au moment de l'exécution.

4. Créer le modèle de message

Maintenant que nous avons configuré le projet et les capacités WebSocket, nous devons créer un message à envoyer.

Le noeud final acceptera les messages contenant le nom de l'expéditeur et un texte dans un message STOMP dont le corps est un objetJSON.

Le message pourrait ressembler à ceci:

{
    "from": "John",
    "text": "Hello!"
}

Pour modéliser le message portant le texte, nous pouvons créer une simple propriété_ Java object with _from ettext:

public class Message {

    private String from;
    private String text;

    // getters and setters
}

Par défaut, Spring utilisera la bibliothèqueJackson pour convertir notre objet modèle vers et depuis JSON.

5. Créer un contrôleur de messagerie

Comme nous l'avons vu, l'approche de Spring pour travailler avec la messagerie STOMP consiste à associer une méthode de contrôleur au point de terminaison configuré. Ceci est rendu possible grâce à l'annotation@MessageMapping.

L'association entre le noeud final et le contrôleur nous donne la possibilité de gérer le message si nécessaire:

@MessageMapping("/chat")
@SendTo("/topic/messages")
public OutputMessage send(Message message) throws Exception {
    String time = new SimpleDateFormat("HH:mm").format(new Date());
    return new OutputMessage(message.getFrom(), message.getText(), time);
}

For the purposes of our example, we’ll create another model object named OutputMessage to represent the output message sent to the configured destination. Nous peuplons notre objet avec l'expéditeur et le texte du message extrait du message entrant et l'enrichissons d'un horodatage.

Après avoir traité notre message, nous l'envoyons à la destination appropriée définie avec l'annotation@SendTo. Tous les abonnés de la destination «/topic/messages» recevront le message.

6. Créer un client navigateur

Après avoir effectué nos configurations côté serveur, nous utiliserons lessockjs-client library pour créer une page HTML simple qui interagit avec notre système de messagerie.

Tout d'abord, nous devons importer les bibliothèques clientes Javascript desockjs etstomp. Ensuite, nous pouvons créer une fonctionconnect() pour ouvrir la communication avec notre endpoint, une fonctionsendMessage() pour envoyer notre message STOMP et une fonctiondisconnect() pour fermer la communication:


    
        Chat WebSocket
        
        
        
    
    
        


7. Tester l'exemple

Pour tester notre exemple, nous pouvons ouvrir quelques fenêtres de navigateur et accéder à la page de discussion à l'adresse suivante:

http://localhost:8080/spring-mvc-java/resources/chat.html

Une fois que cela est fait, nous pouvons rejoindre le chat en entrant un surnom et en appuyant sur le bouton de connexion. Si nous composons et envoyons un message, nous pouvons le voir dans toutes les sessions de navigateur qui ont rejoint le chat.

[#result_box .short_text] # Jetez un œil à la capture d'écran pour voir un exemple: #

screenshot

8. Conclusion

Dans ce didacticiel,we’ve explored Prise en charge de WebSocket de Spring. Nous avons vu sa configuration côté serveur et construit un simplecounterpart côté client avec l'utilisation des bibliothèques Javascriptsockjs etstomp.

L'exemple de code peut être trouvé dans lesGitHub project.