WebSocket 入门案例

news2024/11/15 5:53:17

目录

  • WebSocket
    • 入门案例
      • WebSocket-server
        • 新增项目:
        • 添加依赖:
        • yml:
        • 启动类:
      • frontend-server
        • 前端项目:
        • 添加依赖:
        • 添加yml:
        • 启动类:
        • 前端引入JS:
        • 前端页面:
        • 后端代码:
        • 测试:

WebSocket

入门案例

WebSocket-server

**作用:**服务端给客户端主动推送数据,也支持客户端主动给服务端发送数据,是一个双向的功能。主要是用来服务端给客户端发送数据。

在这里插入图片描述

新增项目:

在这里插入图片描述

添加依赖:

websocket依赖

通过百度找到maven官网,搜索websocket,然后找一个自己要的版本进行拷贝。

https://mvnrepository.com/

在这里插入图片描述

在这里插入图片描述

添加父依赖和其他依赖

在这里插入图片描述

yml:

在这里插入图片描述

启动类:

在这里插入图片描述

frontend-server

前端项目:

在这里插入图片描述

添加依赖:

在这里插入图片描述

添加yml:

在这里插入图片描述

启动类:

在这里插入图片描述

前端引入JS:

在这里插入图片描述

前端页面:

js的if的判断理解

在这里插入图片描述

在这里插入图片描述

两个index页面是一样的,就是创建的uuid不一样而已,一个是123,一个是456

在这里插入图片描述

后端代码:

在这里插入图片描述

websocket连接后,会根据情形自动触发里面的方法,触发的条件是贴上对应的注解。

在这里插入图片描述

controller

服务端给客户端发送消息的方法

在这里插入图片描述

测试:

创建连接:

前端执行的代码流程:

在这里插入图片描述

后端执行代码:

客户端这边就会自动执行这个 onOpen方法

onOpen:当客户端和服务端成功建立连接,就会执行opPen方法

在这里插入图片描述

客户端向服务端发送消息

在这里插入图片描述

服务端向客户端发送消息

服务端向客户端发送消息,先走controller的方法,执行完就走前端的socket.js的onmessage方法。

在这里插入图片描述

在这里插入图片描述

服务端根据不同的uuid(客户端的标识),向客户端发送消息,都能成功。

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1114137.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

众和策略:地产板块发力走高,荣盛发展涨停,碧桂园等大幅拉升

地产板块20日盘中发力走高,到发稿,金科股份、荣盛展开涨停,中南建造、富丽家族涨超7%,华夏夸姣涨逾6%。 港服方面,内资地产股亦走强,到发稿,珠光控股涨超20%,碧桂园涨近10%&#xf…

PBA.常用人工智能预测分析算法

相同的数据型态,利用不同的方法分析,就可以解决不同的课题。例如目前已相当纯熟的人脸识别技术,在国防应用可以进行安保工作;企业可做员工门禁系统;可结合性别、年龄辨识让卖场进行市调分析,或结合追踪技术…

聚焦于先进电池技术等领域的前沿研究和应用,龙讯旷腾出席中国化学会第二届能源化学青年论坛

成都站电催化培训 2023年龙讯团队线下培训已走过北京、西安等城市,前几期均以定向邀请非公开的形式培训,应大家的积极号召,本期电催化成都站的培训我们将以公开招募的形式举办,并且保留前几期的优惠(前30位免费&#…

html网页代码块高亮加行号

程序示例精选 html网页代码块高亮加行号 如需安装运行环境或远程调试,见文章底部个人QQ名片,由专业技术人员远程协助! 前言 这篇博客针对《html网页代码块高亮加行号》编写代码,代码整洁,规则,易读。 学习…

shopee平台现在好做吗

Shopee 是一家知名的电子商务平台,特别在东南亚地区非常流行。是否在 Shopee 平台做生意是否好做取决于多种因素,包括你的产品、市场竞争、营销策略和运营能力等。 以下是一些考虑因素: 1、产品选择:选择畅销的产品或具有市场需求…

需要在 MySQL 服务器中监控的重要指标

MySQL是一个开源的关系数据库管理系统,它基于客户端-服务器模型运行,使用SQL作为其通信模式。它具有灵活性和可扩展性、高安全性、易用性以及无缝处理大型数据集的能力,由于其广泛的功能,MySQL 被用作数据库管理系统的一部分。 什…

初识Java 14-2 测试

目录 测试驱动开发(TDD) 日志 调试 使用JDB进行调试 基准测试 微基准测试 Java微基准测试工具(JMH) 分析和优化 重构 本笔记参考自: 《On Java 中文版》 测试驱动开发(TDD) 测试驱动开…

高博学子参加第二届火焰杯软件测试高校就业选拔赛喜获佳绩

近日,高博软件学院软件工程教研室组织指导全院近80名学生参加第二届火焰杯软件测试高校就业选拔赛。经过初赛、决赛,共有13名同学获优秀奖。获奖名单如下:(排名不分先名):滕美妙、陈虹霖、陆春媚、陈媛、周…

厚壁菌门/拟杆菌门——肠道菌群的阴阳面,代表什么

在研究肠道菌群或复杂微生物样本构成时,“门"(Phylum)是细菌分类的高级分类单位之一。 细菌分类依次为门纲目科属种亚种,最大的分类层面是门,以前写过人群肠道菌群构成主要是以拟杆菌门和厚壁菌门为主&#xff0c…

基于YOLOv5[n/s/m/l/x]全系列参数模型开发构建小麦麦穗颗粒智能化精准检测识别计数系统

小麦麦穗颗粒或者是其他农作物颗粒计数本身是一件很繁琐枯燥的事情,这种事情交给程序来做是最好不过的了,最近正好在做课题项目,导师给的题目就是跟农业相关的,这里想的就是基于目标检测模型来开发构建一套智能化的精准检测计数系…

影像科室图像存储与传输系统源码 智能化影像报告系统源码

影像科室信息管理系统源码 RIS/PACS系统源码 PACS三维影像处理系统源码 影像科室信息管理系统,它包括RIS系统、PACS工作站和PACS服务器系统。提供强大的结构和智能化的影像报告系统、支持各种图象操作,以及实现图像的路由、预取、多级多层次存储。 系统特…

Selenium实战教程----Selenium中的动作

Selenium中针对元素进行的动作在代码中可以分为两类: Selenium::WebDriver::ActionBuilder类中的动作方法Selenium::WebDriver::Element类中的动作方法 其中ActionBuilder类中的动作方法比较丰富,基本涵盖了所有可以进行的操作。 而Element类的动作比较…

ERR_PNPM_JSON_PARSE Unexpected end of JSON input while parsing empty string in

终端报错:  ERR_PNPM_JSON_PARSE  Unexpected end of JSON input while parsing empty string in   报错原因:依赖没有删除干净  解决办法:  ①删除node_modules  ②在package.json的dependencies删除不需要依赖  ③重新pnpm i

干货 | 锁向环到底是什么?是怎么进行倍频的?

你们有没有这样一个疑问,就是CPU的主频怎么做到几个GHz呢? 每一秒要给处理器几亿个脉冲,就拿11代I7处理器来说,它的基本频率就可达2.5GHz,但在我们常规的认知中,频率的大小取决于晶振的频率,比…

速成offer收割机,接口自动化测试面试题,精准打击面试...

目录:导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结(尾部小惊喜) 前言 1、我们测试的接口…

虚拟机灾备建设中NFS存储直接访问技术应用

NFS(Network File System)是一种网络文件系统,允许不同计算机之间共享文件和目录。在Linux系统中,可以使用NFS协议来访问网络存储。 当新服务器硬盘不足时,旧的服务器硬盘容量大,不拔硬盘的情况下&#xf…

5VUSB输入双节磷酸铁锂电池串联应用升压充电管理IC-YB5081

5VUSB输入双节磷酸铁锂电池串联应用升压充电管理IC 概要: YB5081是一款5V输入,支持双节磷酸铁锂电池的升压充电管理IC.YB5081集成功率Mos,采用异步开关架构。使其在应用时仅需极少的外圈器件,可有效减少整体方案尺寸,降低BOM成本…

2023年起重机司机(限门式起重机)证考试题库及起重机司机(限门式起重机)试题解析

题库来源:安全生产模拟考试一点通公众号小程序 2023年起重机司机(限门式起重机)证考试题库及起重机司机(限门式起重机)试题解析是安全生产模拟考试一点通结合(安监局)特种作业人员操作证考试大纲和(质检局)特种设备作…

2023年施工升降机司机(建筑特殊工种)证模拟考试题库及施工升降机司机(建筑特殊工种)理论考试试题

题库来源:安全生产模拟考试一点通公众号小程序 2023年施工升降机司机(建筑特殊工种)证模拟考试题库及施工升降机司机(建筑特殊工种)理论考试试题是由安全生产模拟考试一点通提供,施工升降机司机(建筑特殊工种)证模拟考试题库是根据施工升降机司机(建筑特…

TS使用echarts柱状图鼠标放上去并弹出

效果 代码 <template><div><Chart style"width: 100%; height: 344px" :option"chartOption" /></div> </template><script lang"ts" setup>import { ref } from vue;import { ToolTipFormatterParams } f…