【面试题精讲】什么是websocket?如何与前端通信?
有的时候博客内容会有变动,首发博客是最新的,其他博客地址可能会未同步,认准
https://blog.zysicyj.top
首发博客地址
系列文章地址
什么是WebSocket?
WebSocket是一种在Web应用程序中实现双向通信的协议。它允许在客户端和服务器之间建立持久的、全双工的连接,以便实时地发送数据。
传统的HTTP协议是一种无状态的请求-响应协议,客户端发送请求,服务器返回响应,然后连接立即关闭。这种模型适用于大多数Web应用程序,但对于需要实时数据更新或双向通信的应用程序来说,它并不理想。
WebSocket通过在客户端和服务器之间建立长久的TCP连接,提供了一种持久性的通信通道。它通过在HTTP握手过程中升级连接,从而允许在同一个连接上进行双向通信。
WebSocket的特点包括:
-
双向通信:WebSocket允许客户端和服务器之间双向发送数据,而不仅仅是客户端向服务器发送请求。
-
实时性:WebSocket提供了高效的实时数据传输,可以在数据可用时立即将其推送给客户端。
-
较低的开销:WebSocket使用较少的网络开销,因为它使用持久连接而不需要频繁的握手和头部信息。
-
兼容性:WebSocket协议已经得到了广泛的支持,现代的Web浏览器和服务器都可以很好地支持WebSocket。
WebSocket在许多实时应用程序中得到广泛应用,例如聊天应用程序、实时协作工具、股票市场报价、多人游戏等。它提供了一种强大的机制,使得开发者可以轻松实现实时和双向的Web应用程序。
Spring Boot如何实现WebSocket
在Spring Boot中,可以使用Spring WebSocket模块来实现WebSocket功能。以下是使用Spring Boot实现WebSocket的基本步骤:
-
添加依赖:在 pom.xml
文件中添加以下依赖,以引入Spring WebSocket和Tomcat WebSocket的支持:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-websocket</artifactId>
</dependency>
-
创建一个WebSocket处理器类:创建一个类,实现 org.springframework.web.socket.handler.TextWebSocketHandler
,并重写handleTextMessage
和afterConnectionEstablished
等方法来处理WebSocket事件。
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;
public class MyWebSocketHandler extends TextWebSocketHandler {
@Override
protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
// 处理收到的文本消息
}
@Override
public void afterConnectionEstablished(WebSocketSession session) throws Exception {
// 处理连接建立事件
}
}
-
配置WebSocket端点:创建一个配置类,继承自 org.springframework.web.socket.config.annotation.WebSocketConfigurer
,并重写registerWebSocketHandlers
方法来注册WebSocket处理器和端点。
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;
@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {
@Override
public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
registry.addHandler(new MyWebSocketHandler(), "/websocket").setAllowedOrigins("*");
}
}
-
启动应用程序:编写一个Spring Boot启动类,并添加 @SpringBootApplication
注解来启动应用程序。
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class MyApplication {
public static void main(String[] args) {
SpringApplication.run(MyApplication.class, args);
}
}
通过这些步骤,您可以在Spring Boot中实现WebSocket功能。客户端可以使用JavaScript的WebSocket
对象或其他WebSocket客户端库来连接到您的WebSocket端点。
请注意,上述代码只是一个基本示例,您可以根据实际需求进行更复杂的WebSocket实现。另外,还可以使用@MessageMapping
注解来处理特定消息类型,使用SimpMessagingTemplate
发送消息给订阅了特定主题的客户端等。
前端如何与websocket通信
在前端处理WebSocket连接和消息,您可以使用JavaScript的WebSocket API来实现。以下是基本的前端处理步骤:
-
创建WebSocket对象:使用 WebSocket
构造函数创建一个WebSocket对象,并传入WebSocket服务器的URL。
var socket = new WebSocket("ws://localhost:8080/your-application/websocket");
-
监听WebSocket事件:通过WebSocket对象的事件处理程序,监听WebSocket的连接状态和消息事件。
socket.onopen = function () {
// 连接建立后的操作
};
socket.onclose = function () {
// 连接关闭后的操作
};
socket.onerror = function (error) {
// 错误处理
};
socket.onmessage = function (event) {
var message = event.data;
// 处理收到的消息
};
-
发送消息:使用WebSocket对象的 send
方法发送消息到WebSocket服务器。
socket.send("Hello, server!");
-
关闭连接:使用WebSocket对象的 close
方法关闭WebSocket连接。
socket.close();
通过这些步骤,您可以在前端处理WebSocket连接和消息。您可以根据实际需求,在事件处理程序中实现您的业务逻辑,例如更新UI、发送和接收数据等。
请注意,WebSocket连接是异步的,所以您需要适当处理连接建立、关闭和错误事件。此外,还可以使用其他WebSocket库(如Socket.io、SockJS等)来简化WebSocket处理,并提供更多高级功能,如自动重连、心跳检测等。
如何使用Python与websocket通信
要实现Python和Spring Boot WebSocket的通信,可以使用Python的WebSocket客户端库与Spring Boot的WebSocket服务器进行通信。以下是一种常见的实现方式:
-
安装WebSocket客户端库:使用Python的包管理工具(如pip)安装websocket-client库。
pip install websocket-client
-
在Python中创建WebSocket连接:在Python代码中导入websocket库,并创建一个WebSocket连接到Spring Boot的WebSocket服务器。
import websocket
def on_message(ws, message):
# 处理收到的消息
print(f"Received: {message}")
def on_error(ws, error):
# 处理错误
print(f"Error: {error}")
def on_close(ws):
# 处理连接关闭
print("Connection closed")
def on_open(ws):
# 处理连接建立
print("Connection established")
# 发送消息
ws.send("Hello from Python!")
websocket.enableTrace(True)
ws = websocket.WebSocketApp("ws://localhost:8080/your-websocket-endpoint",
on_message=on_message,
on_error=on_error,
on_close=on_close)
ws.on_open = on_open
ws.run_forever()
-
在Spring Boot中处理WebSocket消息:在您的Spring Boot应用程序中创建WebSocket处理器类,处理来自Python客户端的消息。
import org.springframework.stereotype.Component;
import org.springframework.web.socket.handler.TextWebSocketHandler;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
@Component
public class MyWebSocketHandler extends TextWebSocketHandler {
@Override
protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
// 处理收到的消息
System.out.println("Received: " + message.getPayload());
// 发送消息给Python客户端
session.sendMessage(new TextMessage("Hello from Spring Boot!"));
}
}
确保WebSocket端点的URL路径在Python和Spring Boot代码中匹配,并根据实际情况进行调整。
通过这些步骤,您可以在Python和Spring Boot之间建立WebSocket通信。当Python客户端发送消息时,Spring Boot服务器将接收并处理该消息,并可以向Python客户端发送响应消息。
本文由 mdnice 多平台发布
相关文章:
【面试题精讲】什么是websocket?如何与前端通信?
有的时候博客内容会有变动,首发博客是最新的,其他博客地址可能会未同步,认准https://blog.zysicyj.top 首发博客地址 系列文章地址 什么是WebSocket? WebSocket是一种在Web应用程序中实现双向通信的协议。它允许在客户端和服务器之间建立持久…...

unity tolua热更新框架教程(2)
Lua启动流程 增加脚本luamain,继承luaclient 建立第一个场景GameMain,在对象GameMain挂载脚本LuaMain,启动场景 看到打印,lua被成功加载 lua入口及调用堆栈 这里会执行main.lua文件的main函数 C#接口导出 在此处配置C#导出的代码 …...

【0904作业】QT 完成登陆界面跳转到聊天室+完成学生管理系统的查找和删除功能
一、完成登陆界面跳转到聊天室 1> 项目结构 2> 源码 ① .pro ②main #include "mywnd.h" #include"chatCli.h" #include <QApplication>int main(int argc, char *argv[]) {QApplication a(argc, argv);MyWnd w;w.show();Form f;QObject::co…...
ceph源码阅读 buffer
ceph::buffer是ceph非常底层的实现,负责管理ceph的内存。ceph::buffer的设计较为复杂,但本身没有任何内容,主要包含buffer::list、buffer::ptr、buffer::hash。这三个类都定义在src/include/buffer.h和src/common/http://buffer.cc中。 buffe…...

基本介绍——数据挖掘
1.数据挖掘的定义 数据挖掘是采用数学的、统计的、人工智能和神经网络等领域的科学方法,如记忆推理、聚类分析、关联分析、决策树、神经网络、基因算法等技术,从大量数据中挖掘出隐含的、先前未知的、对决策有潜在价值的关系、模式和趋势,并…...
Navicat连接postgresql时出现‘datlastsysoid does not exist‘报错
当使用 Navicat 连接 PostgreSQL 数据库时出现 ‘datlastsysoid does not exist’ 的错误报错,这可能是由于 Navicat 版本与 PostgreSQL 版本不兼容所致。 这是因为在较新的 PostgreSQL 版本中移除了 ‘datlastsysoid’ 列,但可能较旧版本的 Navicat 尚…...

冯诺依曼体系结构/什么是OS?
一、体系结构图 示意图 控制器可以控制其它4个硬件,四个硬件直接可以进行数据传输。 5大硬件 但是这些个体需要用“线”连接。 为什么要有存储器? 如果没有,实际速度则为输入、输出设备的速度。 加上后,变为内存的速度。&#…...
SD卡/TF卡简记
文章目录 MicroSD卡与SD卡关系与区别对比NM卡、XQD卡、CFexpress卡SD规格标识FAQ拍摄1080p或2k视频需要什么速度的sd卡?拍摄4k视频需要什么速度的sd卡?拍摄8k视频需要什么速度的sd卡? MicroSD卡与SD卡关系与区别 MicroSD卡原名为Trans-flash…...
Dockerfile COPY的奇怪行为:自动解包一级目录
记录一下今天遇到的坑:Dockerfile 这两天在部署项目的时候,新加进去了一个驱动,需要将2个文件夹以及1个文件COPY进镜像,大刀阔斧一个Dockerfile就写完了,结果COPY进去的文件有问题,Dockerfile的内容如下&am…...
【每日一题Day311】LC1761一个图中连通三元组的最小度数 | 枚举
一个图中连通三元组的最小度数【LC1761】 给你一个无向图,整数 n 表示图中节点的数目,edges 数组表示图中的边,其中 edges[i] [ui, vi] ,表示 ui 和 vi 之间有一条无向边。 一个 连通三元组 指的是 三个 节点组成的集合且这三个点…...
前端日期减一天的笑话
vue日期减一天 给大家讲一个真实的笑话。最近做的一个项目,要统计不同年月日期的关联交易数量,由于和银行内数据对接取得数据都是T-1的,所以在首页根据日期统计一些交易数据量时默认是统计昨日的数据量。所以当时和前端约定好的让前端的妹子做…...

高效能,一键批量剪辑,AI智剪让创作更轻松
在今天的数字化时代,视频制作已经成为各种行业和领域的必备技能。然而,视频剪辑过程往往繁琐且耗时,大大降低了我们的工作效率。幸运的是,随着人工智能技术的发展,我们有了新的解决方案——AI智剪软件。 AI智剪软件&am…...

手写Mybatis:第15章-返回Insert操作自增索引值
文章目录 一、目标:Insert自增索引值二、设计:Insert自增索引值三、实现:Insert自增索引值3.1 工程结构3.2 Insert自增索引值类图3.3 修改执行器3.3.1 修改执行器接口3.3.2 抽象执行器基类 3.4 键值生成器3.4.1 键值生成器接口3.4.2 不用键值…...
【数据结构】动态数组(vector)的基本操作,包括插入、删除、扩容、输出、释放内存等。以下是代码的解释和注释:
这段C代码实现了一个动态数组(vector)的基本操作,包括插入、删除、扩容、输出、释放内存等。以下是代码的解释和注释: // 引入标准输入输出库和标准库函数,用于后续的内存分配和打印输出等操作 #include <stdio.…...

[unity]三角形顶点顺序
序 详见官方文档:Unity - Manual: Mesh data (unity3d.com) Topology:拓扑结构 翻译: 拓扑描述网格具有的面类型。 网格的拓扑定义了索引缓冲区的结构,索引缓冲区又描述了顶点位置如何组合成面。每种类型的拓扑都使用索引数组中…...

【python爬虫】14.Scrapy框架讲解
文章目录 前言Scrapy是什么Scrapy的结构Scrapy的工作原理 Scrapy的用法明确目标与分析过程代码实现——创建项目代码实现——编辑爬虫代码实现——定义数据代码实操——设置代码实操——运行 复习 前言 前两关,我们学习了能提升爬虫速度的进阶知识——协程…...

功率放大器主要作用是什么呢
功率放大器是一种电子设备,主要作用是将输入信号的功率增加到更高的水平,以便能够驱动高功率负载。在许多应用中,信号源产生的信号往往具有较低的功率,无法直接满足一些要求较高的设备或系统的需求。而功率放大器则可以增强信号的…...
SpringBoot ApplicationEvent详解
ApplicationStartingEvent 阶段 LoggingApplicationListener#onApplicationStartingEvent 初始化日志工厂,LoggingSystemFactory接口,可以通过spring.factories进行定制 可以通过System.setProperty("org.springframework.boot.logging.LoggingSystem",&q…...
WebSocket 报java.io.IOException: 远程主机强迫关闭了一个现有的连接。
在客户端强制关闭时,或者窗口强制关闭时,后端session没有关闭。 有时还会报:java.io.EOFException: 这个异常 前端心跳没有收到信息,还在心跳。 CloseReason close new CloseReason(CloseReason.CloseCodes.NORMAL_CLOSURE, &…...

关于git约定式提交IDEA
背景 因为git提交的消息不规范导致被乱喷,所以领导统一规定了约定式提交 官话 约定式提交官网地址 约定式提交规范是一种基于提交信息的轻量级约定。 它提供了一组简单规则来创建清晰的提交历史; 这更有利于编写自动化工具。 通过在提交信息中描述功能…...
【根据当天日期输出明天的日期(需对闰年做判定)。】2022-5-15
缘由根据当天日期输出明天的日期(需对闰年做判定)。日期类型结构体如下: struct data{ int year; int month; int day;};-编程语言-CSDN问答 struct mdata{ int year; int month; int day; }mdata; int 天数(int year, int month) {switch (month){case 1: case 3:…...

docker详细操作--未完待续
docker介绍 docker官网: Docker:加速容器应用程序开发 harbor官网:Harbor - Harbor 中文 使用docker加速器: Docker镜像极速下载服务 - 毫秒镜像 是什么 Docker 是一种开源的容器化平台,用于将应用程序及其依赖项(如库、运行时环…...
【SpringBoot】100、SpringBoot中使用自定义注解+AOP实现参数自动解密
在实际项目中,用户注册、登录、修改密码等操作,都涉及到参数传输安全问题。所以我们需要在前端对账户、密码等敏感信息加密传输,在后端接收到数据后能自动解密。 1、引入依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId...
线程与协程
1. 线程与协程 1.1. “函数调用级别”的切换、上下文切换 1. 函数调用级别的切换 “函数调用级别的切换”是指:像函数调用/返回一样轻量地完成任务切换。 举例说明: 当你在程序中写一个函数调用: funcA() 然后 funcA 执行完后返回&…...

江苏艾立泰跨国资源接力:废料变黄金的绿色供应链革命
在华东塑料包装行业面临限塑令深度调整的背景下,江苏艾立泰以一场跨国资源接力的创新实践,重新定义了绿色供应链的边界。 跨国回收网络:废料变黄金的全球棋局 艾立泰在欧洲、东南亚建立再生塑料回收点,将海外废弃包装箱通过标准…...

srs linux
下载编译运行 git clone https:///ossrs/srs.git ./configure --h265on make 编译完成后即可启动SRS # 启动 ./objs/srs -c conf/srs.conf # 查看日志 tail -n 30 -f ./objs/srs.log 开放端口 默认RTMP接收推流端口是1935,SRS管理页面端口是8080,可…...

Nuxt.js 中的路由配置详解
Nuxt.js 通过其内置的路由系统简化了应用的路由配置,使得开发者可以轻松地管理页面导航和 URL 结构。路由配置主要涉及页面组件的组织、动态路由的设置以及路由元信息的配置。 自动路由生成 Nuxt.js 会根据 pages 目录下的文件结构自动生成路由配置。每个文件都会对…...
在鸿蒙HarmonyOS 5中使用DevEco Studio实现录音机应用
1. 项目配置与权限设置 1.1 配置module.json5 {"module": {"requestPermissions": [{"name": "ohos.permission.MICROPHONE","reason": "录音需要麦克风权限"},{"name": "ohos.permission.WRITE…...

【开发技术】.Net使用FFmpeg视频特定帧上绘制内容
目录 一、目的 二、解决方案 2.1 什么是FFmpeg 2.2 FFmpeg主要功能 2.3 使用Xabe.FFmpeg调用FFmpeg功能 2.4 使用 FFmpeg 的 drawbox 滤镜来绘制 ROI 三、总结 一、目的 当前市场上有很多目标检测智能识别的相关算法,当前调用一个医疗行业的AI识别算法后返回…...
Rapidio门铃消息FIFO溢出机制
关于RapidIO门铃消息FIFO的溢出机制及其与中断抖动的关系,以下是深入解析: 门铃FIFO溢出的本质 在RapidIO系统中,门铃消息FIFO是硬件控制器内部的缓冲区,用于临时存储接收到的门铃消息(Doorbell Message)。…...