通过WebSocket和STOMP实现浏览器和服务器的消息通信

最新推荐文章于 2024-07-19 11:10:22 发布

wuqi_seu

最新推荐文章于 2024-07-19 11:10:22 发布

阅读量2k

点赞数

分类专栏： web 文章标签： WebSocket STOMP 消息服务端和浏览器通信

本文链接：https://blog.csdn.net/wuqi_seu/article/details/80916077

版权

本文介绍了如何通过WebSocket和STOMP协议实现实时的浏览器与服务端双向通信。讲解了WebSocket的基本概念，Spring框架下WebSocketAPI的使用，包括客户端和服务端的配置与交互。此外，还详细阐述了STOMP协议在WebSocket上的应用，以及如何发送和接收消息，包括前端订阅和服务端消息发送的方法。

摘要由CSDN通过智能技术生成

异步消息

异步消息有两个重要的概念， 消息代理（broker）和 目的地（destination）。

消息代理：当一个应用发送消息时，需要制定发送的目的地，然后将消息交给消息代理（类似邮局），消息代理会确保消息发送到指定的目的地。

目的地：不同的消息系统有不同的消息路由模式，但是有两种通用的目的地：队列（queue）和主题（topic），分别对应两种消息模型：点对点模型和发布/订阅模型

点对点模型：

队列可以有多个接收者，但是消息只能被一个接收者取走。

发布-订阅消息模型：

主题里的消息可以发送给多个订阅者。

WebSockt实现浏览器和服务端通信

WebSocket协议提供了通过套接字实现全双工、异步通信的功能。首先，浏览器的JavaScript客户端创建一个socket并连接到服务端，接下来，客户端和服务端之间可以通过这个通道发送和接收消息，服务端可以通过这个链接发送更新到客户端。

通过Spring的WebSocketAPI实现

客户端代码：

<html>
  <head>
    <title>Home</title>
    <script th:src="@{/webjars/sockjs-client/0.3.4/sockjs.min.js}"></script>
    <script th:src="@{/webjars/jquery/2.0.3/jquery.min.js}"></script>
  </head>
  <body>
    <button id="stop">Stop</button>
  
    <script th:inline="javascript">
      var sock = new SockJS([[@{/marco}]]);//SockJS是对WebSocket技术的一种模拟，在浏览器不支持WebSocket通信时，
      提供其他的通信方式。
      sock.onopen =