Maison > Article > Java > Comment utiliser WebSocket pour implémenter la fonction de chat instantané en Java

Comment utiliser WebSocket pour implémenter la fonction de chat instantané en Java

王林original: 2023-12-18 08:43:581097parcourir

Avec le développement rapide d'Internet, la messagerie instantanée est devenue un élément indispensable de la vie des gens. En tant que protocole de communication full-duplex, WebSocket a progressivement remplacé le protocole HTTP traditionnel et est devenu l'une des technologies importantes pour réaliser des fonctions de messagerie instantanée. Cet article explique comment utiliser WebSocket pour implémenter la fonction de chat instantané en Java et fournit des exemples de code spécifiques.

Tout d'abord, nous devons préparer l'environnement et les outils suivants :

JDK 1.8 ou supérieur
Outil de build Maven
IDE, tel qu'Eclipse ou IntelliJ IDEA

Ensuite, nous commençons à implémenter la fonction de chat instantané.

Étape 1 : Créer un serveur WebSocket basé sur Java
Nous utilisons le framework Spring Boot en Java pour créer le serveur WebSocket. Spring Boot fournit l'API conviviale pour les développeurs de WebSocket et une configuration pratique. Avant de créer le serveur WebSocket, nous devons créer un projet Spring Boot.

Tout d'abord, créez un nouveau projet Spring Boot dans l'IDE et introduisez les dépendances suivantes :

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

Ensuite, créez une classe de configuration nommée WebSocketConfig et ajoutez le code suivant :

@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {

    @Override
    public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
        registry.addHandler(chatWebSocketHandler(), "/chat").setAllowedOrigins("*");
    }

    @Bean
    public WebSocketHandler chatWebSocketHandler() {
        return new ChatWebSocketHandler();
    }

}

Dans le code ci-dessus, on passe L'annotation @EnableWebSocket active WebSocket et enregistre un gestionnaire WebSocket nommé chatWebSocketHandler via la méthode registerWebSocketHandlers. Le chemin du processeur est "/chat", nous pouvons personnaliser le chemin selon nos besoins. @EnableWebSocket注解启用WebSocket，并通过registerWebSocketHandlers方法注册了一个名为chatWebSocketHandler的WebSocket处理器。处理器的路径是"/chat"，我们可以根据需要自定义路径。

第二步：实现WebSocket处理器
接下来，我们需要实现WebSocket处理器来处理和管理WebSocket连接。在这个处理器中，我们将实现接收和发送消息的功能。

创建一个名为ChatWebSocketHandler的类，并实现WebSocketHandler接口。在这个类中，我们需要重写一些方法：

public class ChatWebSocketHandler extends TextWebSocketHandler {

    private static final List<WebSocketSession> sessions = new CopyOnWriteArrayList<>();

    @Override
    public void afterConnectionEstablished(WebSocketSession session) throws Exception {
        sessions.add(session);
    }

    @Override
    protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
        for (WebSocketSession webSocketSession : sessions) {
            webSocketSession.sendMessage(message);
        }
    }

    @Override
    public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
        sessions.remove(session);
    }
}

在上述代码中，我们使用了一个sessions列表来管理所有连接的WebSocket会话。afterConnectionEstablished方法在建立连接后会被调用，我们将会话添加到列表中。handleTextMessage方法用于接收和处理消息，我们将接收到的消息发送给所有连接的会话。afterConnectionClosed方法在连接关闭后会被调用，我们需要将会话从列表中移除。

第三步：前端页面
最后，我们需要创建一个前端页面来实现用户的即时聊天功能。

在项目的static文件夹中创建一个名为chat.html的HTML文件，并添加以下代码：

<!DOCTYPE html>
<html>
<head>
    <title>Chat</title>
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
    <div id="messages"></div>
    <input id="input" type="text" />
    <button id="send">Send</button>

    <script>
        var socket = new WebSocket("ws://localhost:8080/chat");

        socket.onmessage = function(event) {
            var message = event.data;
            $("#messages").append("<p>" + message + "</p>");
        };

        $("#send").click(function() {
            var message = $("#input").val();
            socket.send(message);
            $("#input").val("");
        });
    </script>
</body>
</html>

在上述代码中，我们通过WebSocket对象与服务器建立连接，并使用onmessage事件处理接收到的消息。当用户点击Send按钮时，我们将输入框中的文本发送给服务器。

到此为止，我们已经完成了在Java中利用WebSocket实现即时聊天功能的全部代码。接下来，我们对整个流程进行一下简单的说明。

用户通过浏览器访问chat.html页面，与服务器建立WebSocket连接。当用户在输入框中输入消息并点击Send按钮时，浏览器将发送消息给服务器。服务器收到消息后，会将消息发送给所有连接的会话。会话收到消息后，会将其展示在页面上。

运行项目后，多个用户可以通过访问chat.html

Étape 2 : Implémenter le processeur WebSocket

Ensuite, nous devons implémenter le processeur WebSocket pour gérer et gérer les connexions WebSocket. Dans ce processeur, nous implémenterons la fonctionnalité de réception et d'envoi de messages.

🎜Créez une classe nommée ChatWebSocketHandler et implémentez l'interface WebSocketHandler. Dans cette classe, nous devons surcharger certaines méthodes : 🎜rrreee🎜Dans le code ci-dessus, nous utilisons une liste sessions pour gérer toutes les sessions WebSocket connectées. La méthode afterConnectionEstablished sera appelée une fois la connexion établie et nous ajouterons la session à la liste. La méthode handleTextMessage est utilisée pour recevoir et traiter les messages. Nous envoyons les messages reçus à toutes les sessions connectées. La méthode afterConnectionClosed sera appelée après la fermeture de la connexion et nous devons supprimer la session de la liste. 🎜🎜Étape 3 : Page frontale🎜Enfin, nous devons créer une page frontale pour implémenter la fonction de chat instantané de l'utilisateur. 🎜🎜Créez un fichier HTML nommé chat.html dans le dossier statique du projet et ajoutez le code suivant : 🎜rrreee🎜Dans le code ci-dessus, on passe WebSocket L'objet établit une connexion avec le serveur et gère le message reçu à l'aide de l'événement onmessage. Lorsque l'utilisateur clique sur le bouton Envoyer, nous envoyons le texte dans la zone de saisie au serveur. 🎜🎜Jusqu'à présent, nous avons terminé tout le code pour implémenter la fonction de chat instantané à l'aide de WebSocket en Java. Ensuite, nous donnons une brève explication de l’ensemble du processus. 🎜🎜L'utilisateur accède à la page chat.html via le navigateur et établit une connexion WebSocket avec le serveur. Lorsque l'utilisateur saisit un message dans la zone de saisie et clique sur le bouton Envoyer, le navigateur enverra le message au serveur. Une fois que le serveur a reçu le message, il l'envoie à toutes les sessions connectées. Une fois que la session a reçu le message, elle l'affiche sur la page. 🎜🎜Après avoir exécuté le projet, plusieurs utilisateurs peuvent implémenter la fonction de chat instantané en accédant à la page chat.html. 🎜🎜Pour résumer, cet article explique comment utiliser WebSocket pour implémenter la fonction de chat instantané en Java et fournit des exemples de code spécifiques. J'espère que cet article vous aidera ! 🎜

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!

Java spring spring boot html eclipse maven Static 接口对象事件 ide idea intellij idea http websocket

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：La combinaison de Java et WebSocket : comment réaliser une communication audio en temps réelArticle suivant：La combinaison de Java et WebSocket : comment réaliser une communication audio en temps réel

Articles Liés

Voir plus