Java中使用websocket实现在线聊天功能

下面我将为您详细讲解如何使用WebSocket实现Java Web应用中的在线聊天功能。

简介

WebSocket是一种协议，它允许客户端与服务端之间建立一个持久性的套接字连接，以实现双方之间的实时通信。

相对于HTTP请求/响应模式，WebSocket的优势在于：
- 更少的网络流量。与每次发送HTTP请求并接收响应的通信形式不同，WebSocket允许建立一次连接，之后双方可一直进行实时通信，节省了许多数据传输的开销。
- 更快的响应速度。WebSocket支持全双工通信，服务器可以主动向客户端发送消息，双方交互更为顺畅和高效。
- 更多的数据类型和格式。WebSocket不仅支持文本数据，也可以传输二进制数据，且支持多种数据格式，如JSON、XML等。

实现步骤

下面给出Java实现WebSocket的步骤：

1. 添加依赖

在pom.xml文件中添加以下依赖：

<dependency>
  <groupId>javax.websocket</groupId>
  <artifactId>javax.websocket-api</artifactId>
  <version>1.1</version>
</dependency>
<dependency>
  <groupId>org.glassfish.tyrus</groupId>
  <artifactId>tyrus-server</artifactId>
  <version>1.13</version>
</dependency>

1. WebSocket服务端实现

创建一个WebSocketServer类继承javax.websocket.server.Endpoint，实现以下方法：

@ServerEndpoint(value = "/chat")
public class WebSocketServer {
    private Session session;

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

    @OnMessage
    public void onMessage(String message, Session session) {
        // 处理收到的消息
    }

    @OnClose
    public void onClose(Session session) {
        // 关闭连接
    }
}

通过注解@ServerEndpoint(value = "/chat")指定WebSocket服务的URI。

@OnOpen注解表示该方法在建立连接时被调用，通过参数Session session可以获取WebSocket连接的会话。

@OnMessage注解表示该方法在接收到客户端发送的消息时被调用，参数String message表示收到的消息。

@OnClose注解表示该方法在断开连接时被调用，同样通过Session session参数获取连接会话。

1. 客户端实现

创建一个WebSocket对象，连接到WebSocket服务端：

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

通过socket.send(message)方法发送消息，通过socket.onmessage监听服务端的消息推送。

1. 部署和测试

将项目打包成war包并部署到Tomcat服务器上，启动Tomcat服务器。在浏览器中打开多个窗口，加载应用程序页面，输入消息并发送，窗口之间可以实时收发消息。

示例说明

以下是两个示例说明，用于更加具体地了解WebSocket的应用。

示例1：汇率实时更新

需求：在Web页面上显示汇率情况，每隔1秒实时更新一次。

实现思路：前端页面通过WebSocket连接到汇率服务器，服务器每隔1秒向所有客户端推送汇率信息。

1. 后端实现

创建一个ExchangeRateServer类，实现以下方法：

@ServerEndpoint(value = "/exchangerate")
public class ExchangeRateServer {
    private static final Set<Session> sessions = Collections.synchronizedSet(new HashSet<>());

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

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

    @Scheduled(fixedDelay = 1000)
    public void pushExchangeRate() {
        sessions.forEach(session -> {
            try {
                session.getBasicRemote().sendText(getExchangeRate());
            } catch (IOException e) {
                e.printStackTrace();
            }
        });
    }

    private String getExchangeRate() {
        // 获取实时汇率信息
    }
}

@ServerEndpoint(value = "/exchangerate")定义WebSocket服务URI。

@OnOpen和@OnClose方法分别在连接/断开时被调用，并将连接保存在一个集合中。

@Scheduled(fixedDelay = 1000)用于定期向客户端发送汇率信息。其中sessions保存了所有连接，session.getBasicRemote().sendText()可以将消息推送到客户端。

1. 前端实现

在Web页面中添加如下JS代码：

var socket = new WebSocket("ws://localhost:8080/exchangerate");
socket.onmessage = function(event) {
  var data = JSON.parse(event.data);
  // 更新汇率信息
};

每次接收到服务端推送的消息，即更新一次汇率信息。

示例2：博客评论实时更新

需求：在博客页面上同步显示最新的评论，实现与已有评论的实时互动。

实现思路：前端页面通过WebSocket连接到服务器，服务器将收到的新评论实时推送给所有与该博客关联的客户端。

1. 后端实现

创建一个BlogCommentsServer类，实现以下方法：

@ServerEndpoint(value = "/blog/comments/{blogId}")
public class BlogCommentsServer {
    private static final Map<String, Set<Session>> clients = new HashMap<>();

    @OnOpen
    public void onOpen(Session session, @PathParam("blogId") String blogId) {
        clients.computeIfAbsent(blogId, k -> Collections.synchronizedSet(new HashSet<>()));
        clients.get(blogId).add(session);
    }

    @OnClose
    public void onClose(Session session, @PathParam("blogId") String blogId) {
        clients.get(blogId).remove(session);
    }

    public static void pushNewComment(String blogId, Comment newComment) {
        clients.computeIfPresent(blogId, (k, sessions) -> {
            sessions.parallelStream().forEach(session -> {
                try {
                    session.getBasicRemote().sendText(newComment.toJSON());
                } catch (IOException e) {
                    e.printStackTrace();
                }
            });
            return sessions;
        });
    }
}

@ServerEndpoint(value = "/blog/comments/{blogId}")定义WebSocket服务URI。URI中的blogId表示与该博客关联的所有客户端。

@OnOpen和@OnClose方法记录每个客户端与哪些博客绑定在一起，以便于后面的推送。

BlogCommentsServer.pushNewComment()方法在收到新评论时，将该评论推送给与博客关联的所有客户端。

1. 前端实现

在博客页面的JS代码中，添加如下代码：

var socket = new WebSocket("ws://localhost:8080/blog/comments/" + blogId);
socket.onmessage = function(event) {
  var data = JSON.parse(event.data);
  // 实时更新新评论
};

每次接收到服务端推送的消息，即添加一条新评论。