热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

WebSocket实现数据库更新时前端页面刷新

这篇文章主要为大家详细介绍了WebSocket实现数据库更新时前端页面刷新,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了WebSocket实现数据库更新时前端页面刷新,供大家参考,具体内容如下

后台代码:

WebSocketConfig:

package com.x.common.websocket;
 
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.server.standard.ServerEndpointExporter;
 
@Configuration
public class WebSocketConfig {
 @Bean
 public ServerEndpointExporter serverEndpointExporter() {
 return new ServerEndpointExporter();
 }
}

WebSocketServlet:

package com.x.common.websocket;
import com.alibaba.fastjson.JSONObject;
import org.springframework.stereotype.Component;
 
import java.io.IOException;
import java.util.Map;
import java.util.concurrent.ConcurrentHashMap;
import javax.websocket.*;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;
 
@ServerEndpoint("/websocket/{userId}")
@Component
public class WebSocketServlet {
 
 private static int OnlineCount= 0;
 private static Map clients = new ConcurrentHashMap<>();
 private Session session;
 private String userId;
 
 @OnOpen
 public void onOpen(@PathParam("userId") String userId, Session session) throws IOException {
 
 this.userId = userId;
 this.session = session;
 
 addOnlineCount();
 clients.put(userId, this);
 System.out.println("已连接");
 }
 
 @OnClose
 public void onClose() throws IOException {
 clients.remove(userId);
 subOnlineCount();
 }
 
 @OnMessage
 public void onMessage(String message) throws IOException {
 
 JSONObject jsOnTo= JSONObject.parseObject(message);
 
 if (!jsonTo.get("To").equals("All")){
 sendMessageTo("给一个人", jsonTo.get("To").toString());
 }else{
 sendMessageAll("给所有人");
 }
 }
 
 @OnError
 public void onError(Session session, Throwable error) {
 error.printStackTrace();
 }
 
 public void sendMessageTo(String message, String To) throws IOException {
 // session.getBasicRemote().sendText(message);
 //session.getAsyncRemote().sendText(message);
 for (WebSocketServlet item : clients.values()) {
 if (item.userId.equals(To) ){
 item.session.getAsyncRemote().sendText(message);
 }
 }
 }
 
 public void sendMessageAll(String message) throws IOException {
 for (WebSocketServlet item : clients.values()) {
 item.session.getAsyncRemote().sendText(message);
 }
 }
 
 
 public static synchronized int getOnlineCount() {
 return onlineCount;
 }
 
 public static synchronized void addOnlineCount() {
 WebSocketServlet.onlineCount++;
 }
 
 public static synchronized void subOnlineCount() {
 WebSocketServlet.onlineCount--;
 }
 
 public static synchronized Map getClients() {
 return clients;
 }
}

JS代码:

var websocket = null;
 
//判断当前浏览器是否支持WebSocket
if ('WebSocket' in window) {
 websocket = new WebSocket("ws://localhost:8086/websocket/1");
} else {
 alert('当前浏览器 Not support websocket')
}
 
//连接发生错误的回调方法
websocket.Onerror= function() {
 console.log("WebSocket连接发生错误");
};
 
//连接成功建立的回调方法
websocket.Onopen= function() {
 console.log("WebSocket连接成功");
}
 
//接收到消息的回调方法
websocket.Onmessage= function(event) {
 //返回数据转JSON
 var json=JSON.parse(event.data);
 //result为bootstrap table 返回数据
 var rows=result.rows;
 for(var i=0;i

返回前台是调用方法:

@Autowired
private WebSocketServlet scoket;
 
//学生信息
XStudentInfoEntity student = xStudentInfoService.getObjectById(id.replace("\"",""));
//提醒学生数据发生改变
scoket.sendMessageAll(JSONObject.toJSONString(student));

pom.xml: 


 org.springframework
 spring-websocket

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


推荐阅读
  • 本文详细解析了JSONP(JSON with Padding)的跨域机制及其工作原理。JSONP是一种通过动态创建``标签来实现跨域请求的技术,其核心在于利用了浏览器对``标签的宽松同源策略。文章不仅介绍了JSONP的产生背景,还深入探讨了其具体实现过程,包括如何构造请求、服务器端如何响应以及客户端如何处理返回的数据。此外,还分析了JSONP的优势和局限性,帮助读者全面理解这一技术在现代Web开发中的应用。 ... [详细]
  • 在 CentOS 7 上部署和配置 RabbitMQ 消息队列系统时,首先需要安装 Erlang,因为 RabbitMQ 是基于 Erlang 语言开发的。具体步骤包括:安装必要的依赖项,下载 Erlang 源码包(可能需要一些时间,请耐心等待),解压源码包,解决可能出现的错误,验证安装是否成功,并将 Erlang 添加到环境变量中。接下来,下载 RabbitMQ 的 tar.xz 压缩包,并进行解压和安装。确保每一步都按顺序执行,以保证系统的稳定性和可靠性。 ... [详细]
  • 本文探讨了Android系统中支持的图像格式及其在不同版本中的兼容性问题,重点涵盖了存储、HTTP传输、相机功能以及SparseArray的应用。文章详细分析了从Android 10 (API 29) 到Android 11 的存储规范变化,并讨论了这些变化对图像处理的影响。此外,还介绍了如何通过系统升级和代码优化来解决版本兼容性问题,以确保应用程序在不同Android版本中稳定运行。 ... [详细]
  • 利用树莓派畅享落网电台音乐体验
    最近重新拾起了闲置已久的树莓派,这台小巧的开发板已经沉寂了半年多。上个月闲暇时间较多,我决定将其重新启用。恰逢落网电台进行了改版,回忆起之前在树莓派论坛上看到有人用它来播放豆瓣音乐,便萌生了同样的想法。通过一番调试,终于实现了在树莓派上流畅播放落网电台音乐的功能,带来了全新的音乐享受体验。 ... [详细]
  • 本文探讨了利用Java实现WebSocket实时消息推送技术的方法。与传统的轮询、长连接或短连接等方案相比,WebSocket提供了一种更为高效和低延迟的双向通信机制。通过建立持久连接,服务器能够主动向客户端推送数据,从而实现真正的实时消息传递。此外,本文还介绍了WebSocket在实际应用中的优势和应用场景,并提供了详细的实现步骤和技术细节。 ... [详细]
  • 在CentOS 7上部署WebRTC网关Janus
    在CentOS 7上部署WebRTC网关Janus ... [详细]
  • Go 项目中数据库配置文件的优化与应用 ... [详细]
  • 《精通 jQuery》第六章:深入解析与实战应用
    《精通 jQuery》第六章:深入解析与实战应用本章详细探讨了 Ajax 技术的核心机制及其实际应用。Ajax 通过 XMLHttpRequest 对象实现客户端与服务器之间的异步数据交换,从而在不重新加载整个页面的情况下更新部分内容。这种技术不仅提升了用户体验,还提高了应用的响应速度和效率。此外,本章还介绍了如何利用 jQuery 简化 Ajax 操作,并提供了多个实战案例,帮助读者更好地理解和掌握这一重要技术。 ... [详细]
  • 在Linux环境下编译安装Heartbeat时,常遇到依赖库缺失的问题。为确保顺利安装,建议预先通过yum安装必要的开发库,如glib2-devel、libtool-ltdl-devel、net-snmp-devel、bzip2-devel和ncurses-devel等。这些库是编译过程中不可或缺的组件,能够有效避免编译错误,确保Heartbeat的稳定运行。 ... [详细]
  • PyQt5 QTextEdit:深入解析Python中多功能GUI库的应用与实现
    本文详细探讨了 PyQt5 中 QTextEdit 组件在 Python 多功能 GUI 库中的应用与实现。PyQt5 是 Qt 框架的 Python 绑定,提供了超过 620 个类和 6000 个函数及方法,广泛应用于跨平台应用程序开发。QTextEdit 作为其中的重要组件,支持丰富的文本编辑功能,如富文本格式、文本高亮和自定义样式等。PyQt5 的流行性不仅在于其强大的功能,还在于其易用性和灵活性,使其成为开发复杂用户界面的理想选择。 ... [详细]
  • 在尝试对从复杂 XSD 生成的类进行序列化时,遇到了 `NullReferenceException` 错误。尽管已经花费了数小时进行调试和搜索相关资料,但仍然无法找到问题的根源。希望社区能够提供一些指导和建议,帮助解决这一难题。 ... [详细]
  • 深入解析 Android 选择器与形状绘制技术
    本文深入探讨了 Android 中选择器(Selector)与形状绘制(Shape Drawing)技术的应用与实现。重点分析了 `Selector` 的 `item` 元素,其中包括 `android:drawable` 属性的使用方法及其在不同状态下的表现。此外,还详细介绍了如何通过 XML 定义复杂的形状和渐变效果,以提升 UI 设计的灵活性和美观性。 ... [详细]
  • 如何在jqGrid中调整shrinkToFit以避免水平滚动条,并解决页面存在垂直滚动条时表格超出父容器的问题
    1、下图右侧为表格超出panel部分页面html代码:jggrid-class ... [详细]
  • 请在电脑上打开以下链接进行下载w3cschool离线版(chm):http:pan.baidu.coms1bniwRCV(最新,2014年10月21日更新)w3cschool离线版(ht ... [详细]
  • 一文讲透Cluster API的前世、今生与未来
    一文,讲,透,cluster,api,的, ... [详细]
author-avatar
欣荣_75229
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有