WebSocket 前后端实时消息推送

lindroid 发布于2019-08-02 15:16 / 2498人阅读

摘要：要做一个通信监测方面的事情，需要实时进行前后端的的消息推送，这里不分析轮询和的区别，网上讲的挺多的，下图是两者的通信示意图，这里只写怎么用。

要做一个通信监测方面的事情，需要实时进行前后端的的消息推送，这里不分析Ajax轮询和WebSocket的区别，网上讲的挺多的，下图是两者的通信示意图，这里只写怎么用。

下图是我的一个页面简单展示

上代码
前端js
链接：https://pan.baidu.com/s/1gkdj...
提取码：c0q5
从上述连接下载必须的js
sockjs.min.js
stomp.min.js

后端使用
pom.xml配置


            org.springframework.boot
            spring-boot-starter-websocket

配置类

import org.springframework.context.annotation.Configuration;
import org.springframework.messaging.simp.config.MessageBrokerRegistry;
import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
import org.springframework.web.socket.config.annotation.StompEndpointRegistry;
import org.springframework.web.socket.config.annotation.WebSocketMessageBrokerConfigurer;

//springBoot2.0版本后使用 实现WebSocketMessageBrokerConfigurer接口；
//2.0以下版本继承AbstractWebSocketMessageBrokerConfigurer 类；
@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {
  @Override
  public void registerStompEndpoints(StompEndpointRegistry registry) {
      //注册一个Stomp 协议的endpoint指定URL为myWebSocket,并用.withSockJS()指定 SockJS协议。.setAllowedOrigins("*")设置跨域
      registry.addEndpoint("/myWebSocket").setAllowedOrigins("*").withSockJS();
  }
  @Override
  public void configureMessageBroker(MessageBrokerRegistry config) {
      //配置消息代理(message broker)
      //将消息传回给以‘/topic’开头的客户端
      config.enableSimpleBroker("/topic");
  }
}

private SimpMessagingTemplate simpMessage;

使用的时候直接用

simpMessage.convertAndSend("/topic/ip", "给前端推送的消息" );//这里的“topic/ip"是自己设定的地址，只要和前端保持一致就可以

如果有不清楚的地方可以给我发邮件：736812983@qq.com，也可以加qq

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/54013.html

WebSocket 前后端实时消息推送

摘要：要做一个通信监测方面的事情，需要实时进行前后端的的消息推送，这里不分析轮询和的区别，网上讲的挺多的，下图是两者的通信示意图，这里只写怎么用。要做一个通信监测方面的事情，需要实时进行前后端的的消息推送，这里不分析Ajax轮询和WebSocket的区别，网上讲的挺多的，下图是两者的通信示意图，这里只写怎么用。showImg(https://segmentfault.com/img/rem...

khs1994 2019-08-23 17:59 评论0 收藏0
WebSocket在容器化管理平台的应用

摘要：介绍是一个持久化协议，相对于这种非持久协议而言。其在容器化管理平台里主要有两个应用场景类型，一个是实时消息类，将实时日志业务监控等相关信息推送给客户端。那么我们在处理实时消息时就采用了与相结合的方式，快速实现将应用日志信息推送到端。介绍 Websocket是一个持久化协议，相对于HTTP这种非持久协议而言。它实现了浏览器与服务器全双工通信，能更好的节省服务器资源和带宽并达到实时通讯的...

superPershing 2019-06-28 15:46 评论0 收藏0
websocket学习和群聊实现

摘要：协议可以实现前后端全双工通信，从而取代浪费资源的长轮询。而就可以使得前后端进行全双工通信两方都可以向对方进行数据推送，是真正的平等对话。 WebSocket协议可以实现前后端全双工通信，从而取代浪费资源的长轮询。在此协议的基础上，可以实现前后端数据、多端数据，真正的实时响应。在学习WebSocket的过程中，实现了一个简化版群聊，过程和代码详细记录在这篇文章中。本篇文章来自董沅鑫的...

fantix 2019-08-26 12:16 评论0 收藏0
八问WebSocket协议：为你快速解答WebSocket热门疑问

一、引言 WebSocket是一种比较新的协议，它是伴随着html5规范而生的，虽然还比较年轻，但大多主流浏览器都已经支持。它使用方面、应用广泛，已经渗透到前后端开发的各种场景中。对http一问一答中二式流程（就是从所周之的长轮询技要啦）的不满，催生了支持双向通信的WebSocket诞生。WebSocket是个不太干净协议。本文将从8个常见的疑问入手，为还不了解WebSocket协议的开发者快...

Zoom 2019-08-05 16:49 评论0 收藏0
Web 实时推送技术的总结

摘要：本文对过去和现在流行的实时推送技术进行了比较与总结。以上我们介绍了三种实时推送技术，然而各自的缺点很明显，使用起来并不理想，接下来我们着重介绍另一种技术它是比较理想的双向通信技术。前言随着 Web 的发展，用户对于 Web 的实时推送要求也越来越高，比如，工业运行监控、Web 在线通讯、即时报价系统、在线游戏等，都需要将后台发生的变化主动地、实时地传送到浏览器端，而不需要用户手动...

Rocture 2019-08-23 15:53 评论0 收藏0