服务器给前端实时推送数据轻量化解决方案eventSource+Springboot
一、前端代码
body代码
<div id="result"></div>
js代码
$(function(){if(typeof(EventSource) != "undefined"){var source = new EventSource("/demo/getTime");source.onmessage = function(event) {console.log(event.data);$("#result").html(event.data);};source.addEventListener('error', function (event) {console.log("错误:" + event);});source.addEventListener('open', function (event) {console.log("建立连接:" + event);});} else {document.getElementById("result").innerHTML="抱歉,你的浏览器不支持 server-sent 事件...";}
})
二、后端代码
WebFlux 框架依赖jar包
<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-webflux</artifactId>
</dependency>
控制器代码
@GetMapping(value = "/getTime",produces="text/event-stream;charset=UTF-8")
@ApiOperationSupport(order = 1)
@ApiOperation(value = "详情", notes = "传入name")
public Flux<String> getTime() {return Flux.interval(Duration.ZERO,Duration.ofSeconds(1)).map(i -> "最新时间:" + DateUtil.time() + "-" + i);
}
Flux.interval(Duration.ZERO,Duration.ofSeconds(1)),等待0秒开始,间隔1秒,Flux流数据里面的数字加1
三、效果展示
时间和数字一直在增加,后端在不断推送,前端订阅到数据更新到页面
相对于websocket简单很多,只需要很少的代码就实现前端数据的实时刷新,只不过eventSource是单向数据通信,websocket可实现双向通信。
相关文章:
服务器给前端实时推送数据轻量化解决方案eventSource+Springboot
一、前端代码 body代码 <div id"result"></div>js代码 $(function(){if(typeof(EventSource) ! "undefined"){var source new EventSource("/demo/getTime");source.onmessage function(event) {console.log(event.data);$(&qu…...
数据结构与算法:数据结构基础
目录 数组 定义 形式 顺序存储 基本操作 读取元素 更新元素 插入元素 删除元素 扩容 初始化 时机 步骤 优劣势 链表 定义 单向链表 特点 双向链表 随机存储 基本操作 查找节点 更新节点 插入节点 删除元素 数组VS链表 栈与队列 栈 定义 基本操作…...
virtualbox虚拟机中安装FreeDOS系统和DJGPP编译环境
一、安装FreeDOS系统 1、从官网下载FreeDOS系统镜像,下载的压缩包中包含两个文件:后缀为.iso和.img的镜像 下载页面 http://www.freedos.org/download/ 直接下载链接 https://www.ibiblio.org/pub/micro/pc-stuff/freedos/files/distributions/1.…...
JAVASE事件监听
代码: import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import java.util.Scanner;import javax.swing.JButton; import javax.…...
ubuntu14.04改静态ip
现在可能已经用ubuntu14.04的人已经不多了,这里讲一下Ubuntu14.04怎么改静态ip 第一步:输入ifconfig查看ip和子网掩码 第二步:输入route -n查看网关 上面ip是192.168.88.136,子网掩码是255.255.255.0,网关是192.168.…...
“文件的上传与下载:实现与优化“
目录 引言1.文件的上传2.文件的下载3. JRebel安装使用4. 文件批量上传总结 引言 在开发过程中,文件的上传与下载是常见的需求。本篇博客将以CSND为例,介绍文件上传与下载的常见方式,以及如何通过优化提升性能和用户体验。 1.文件的上传 使…...
uboot顶层Makefile前期所做工作说明三
一. uboot顶层 Makefile文件 uboot顶层 Makefile,就是 uboot源码工程的根目录下的 Makefile文件。 本文继续对 uboot顶层 Makefile的前期准备工作进行介绍。续上一篇文章内容的学习,如下: uboot顶层Makefile前期所做工作说明二_凌肖战的博…...
Mysql树形表的两种查询方案(递归与自连接)
你有没有遇到过这样一种情况: 一张表就实现了一对多的关系,并且表中每一行数据都存在“爷爷-父亲-儿子-…”的联系,这也就是所谓的树形结构 对于这样的表很显然想要通过查询来实现价值绝对是不能只靠select * from table 来实现的࿰…...
text-align和text-align-last的属性值
text-algin 文本对齐方式: (1)left:左对齐; (2)right:右对齐; (3)center:居中对齐; (4)start&…...
SpringMVC的注解、参数传递、页面跳转
一.SpringMvc常用注解 常用注解 RequestMapping:RequestMapping注解是一个用来处理请求地址映射的注解,可用于映射一个请求或一个方法,可以用在类或方法上。 RequestParam:RequestParam主要用于将请求参数区域的数据映射到控制层方法的参数上 ModelAttr…...
OAK相机:启动报错X_LINK_DEVICE_NOT_FOUND
OAK相机:启动报错X_LINK_DEVICE_NOT_FOUND 环境报错原因与解决未设置 udev 规则USB崩溃排线接触不良或相机模块时钟干扰 环境 硬件: 4✖️OV9782相机模组OAK-FFC-4P驱动模组笔记本电脑 软件: Ubuntu18.04python 3.9depthai 2.21.2.0 报错…...
Python异常处理——走BUG的路,让BUG无处可走
作者:Insist-- 个人主页:insist--个人主页 本文专栏:Python专栏 专栏介绍:本专栏为免费专栏,并且会持续更新python基础知识,欢迎各位订阅关注。 目录 一、了解python异常 1、BUG 单词的由来 2、什么是异…...
如何解决iOS打包工具AppUploader登录权限问题?
摘要:在iOS技术博主的指导下,了解如何解决使用AppUploader打包时出现的权限问题。本文将深入探讨此问题,为你提供详细的解决方案。 引言: 作为iOS开发者,我们经常需要使用工具来打包和上传应用程序。AppUploader 是一…...
leetcode分类刷题:基于数组的双指针(四、小的移动)
leetcode上有些题是真的太难了,正常读题之后完全想不到要用双指针来求解,本次博客总结的题目是双指针初始时位于数组两端,哪个元素小就移动哪个指针 11. 盛最多水的容器 1、这道题放在42. 接雨水的相似题目里,可能是因为它们都有相…...
eclipse
快捷键 F4: 继承树 F3: 查看变量、方法、类的定义, 跳到光标所在标识符的定义代码。(Ctrl左键) CtrlShiftG: 在工作空间中查找引用了光标所在标识符的位置。与F3相反的快捷键。当按类定义进行阅读时,当前类方法或者函数在被哪些地方调用 controlTAB: 切…...
VIT中的einops包详解
‘’‘einops有三个常用方法:rearrange,repeat,reduce’‘’ rearrange的操作相当于转置 rearrange(image,‘h w c -> w h c’) 高和宽转置 path ../data/cat_and_mouse.jpg image cv2.imread(path) h,w,c image.shape # shape第一个值是h,第二个是w image…...
目标检测笔记(十三): 使用YOLOv5-7.0版本对图像进行目标检测完整版(从自定义数据集到测试验证的完整流程))
文章目录 一、目标检测介绍二、YOLOv5介绍2.1 和以往版本的区别 三、代码获取3.1 视频代码介绍 四、环境搭建五、数据集准备5.1 数据集转换5.2 数据集验证 六、模型训练七、模型验证八、模型测试九、评价指标 一、目标检测介绍 目标检测(Object Detectionÿ…...
【数据结构】设计环形队列
环形队列是一种线性数据结构,其操作表现基于 FIFO(先进先出)原则并且队尾被连接在队首之后以形成一个循环。它也被称为“环形缓冲器”。 环形队列的一个好处是我们可以利用这个队列之前用过的空间。在一个普通队列里,一旦一个队列…...
无涯教程-JavaScript - COUPDAYSNC函数
描述 COUPDAYSNC函数返回从结算日期到下一个息票日期的天数。 语法 COUPDAYSNC (settlement, maturity, frequency, [basis])争论 Argument描述Required/OptionalSettlement 证券的结算日期。 证券结算日期是指在发行日期之后将证券交易给买方的日期。 RequiredMaturity 证…...
python 随机生成emoji表情
问答板块觉得比较有意思的问题 当时搜了些网上的发现基本都不能用,不知道是版本的问题还是咋的就开始自己研究 python随机生成emoji 问题的产生解决官网文档数据类型实现思路实现前提:具体实现: 其他常见用法插入 Emoji 表情:解析…...
AudioSeal效果展示:实测音频隐形水印,听不出区别但能精准检测
AudioSeal效果展示:实测音频隐形水印,听不出区别但能精准检测 1. 音频水印技术概述 1.1 什么是音频隐形水印 音频隐形水印是一种将数字标识信息嵌入到音频信号中的技术,这些信息对人类听觉系统几乎不可感知,但可以通过专用算法…...
Flux.1-Dev深海幻境作品集:LSTM时序灵感驱动的系列艺术创作
Flux.1-Dev深海幻境作品集:LSTM时序灵感驱动的系列艺术创作 最近在尝试一些AI艺术创作的新玩法,发现了一个特别有意思的组合:用LSTM模型来“读”故事,再用Flux.1-Dev模型来“画”故事。听起来有点抽象?简单说…...
Qwen3.5小尺寸模型开源,9B碾压GPT开源版,消费级显卡就能跑
AI圈又出大新闻了✨ 阿里通义千问3.5系列小尺寸模型正式亮相,直接打破“小模型能力弱”的固有认知,甚至实现了“以小胜大”的逆袭,本地部署门槛直接拉到平民级! 先上核心干货——这次千问3.5一口气推出了4款小尺寸模型,…...
dfs:飞机降落
题目:P9241 [蓝桥杯 2023 省 B] 飞机降落 - 洛谷 做题目之前一定要先看数据范围。这道题的数据范围,T,N均<10,可以用暴力搜索。 这道题是排序,假设有3辆飞机。顺序可以是123,132,213,231&am…...
基于ZLMediaKit API的Java流媒体服务实战:从配置到核心功能封装
1. ZLMediaKit快速入门与环境搭建 第一次接触ZLMediaKit时,我被它的轻量级和高性能所吸引。作为一款开源的流媒体服务器,它支持RTSP、RTMP、HLS等多种协议,特别适合中小型视频项目的快速部署。记得当时为了测试性能,我在一台2核4G…...
Windows下OpenClaw全流程指南:GLM-4.7-Flash模型接入与自动化测试
Windows下OpenClaw全流程指南:GLM-4.7-Flash模型接入与自动化测试 1. 为什么选择OpenClawGLM-4.7-Flash组合 去年我在处理一个Python数据分析项目时,每天要重复执行十几个脚本并整理结果。当我第三次因为手工操作失误导致数据错乱后,终于决…...
Linux驱动开发实战:从设备树到内核调试全解析
Linux驱动工程师实战经验分享:从入门到进阶的技术要点解析1. 设备树系统的深入理解1.1 设备树的基本概念在Linux驱动开发初期,大多数工程师都是从最简单的模块开发开始。典型的入门流程包括:#include <linux/module.h> #include <li…...
极简OpenClaw技能开发:给Qwen3-32B-Chat扩展Excel处理能力
极简OpenClaw技能开发:给Qwen3-32B-Chat扩展Excel处理能力 1. 为什么需要自定义Excel处理技能 去年我接手了一个数据分析项目,每天需要处理几十份Excel报表。手动操作不仅耗时,还容易出错。当我尝试用OpenClaw自动化这个流程时,…...
PostgreSQL 冻结(Freeze)机制深度解析
PostgreSQL 冻结(Freeze)机制深度解析一、为什么需要冻结 1.1 事务 ID 的本质 PostgreSQL 用 32 位无符号整数表示事务 ID(XID),范围 0 ~ 2^32-1(约 42 亿)。 其中有三个特殊 XID:XI…...
Mojo调用Python模块性能翻倍?深度剖析混合编程内存管理、GIL绕过与ABI兼容性(附实测基准数据)
第一章:Mojo与Python混合编程案例源码分析Mojo 作为兼具 Python 兼容性与系统级性能的新一代编程语言,其与 Python 的混合编程能力是实际工程落地的关键。以下通过一个典型场景——在 Python 主程序中调用 Mojo 实现的高性能向量加法函数——展开源码级剖…...
