当前位置: 首页 > news >正文

WebSocket介绍和入门案例

目录

  • 一、WebSocket 详解
    • 1. 定义与特点:
    • 2. 工作原理:
    • 3. 应用场景:
  • 二、入门案例

一、WebSocket 详解

1. 定义与特点:

  • WebSocket 是一种在单个 TCP 连接上进行全双工通信的协议。它允许客户端和服务器之间进行实时、双向的数据传输,克服了传统 HTTP 协议只能由客户端发起请求、服务器响应的单向通信模式的局限性。
  • 特点包括低延迟、实时性强、减少不必要的网络流量和服务器资源消耗等。
  • HTTP协议和WebSocket协议对比:
  • HTTP是短连接
  • WebSocket是长连接
  • HTTP通信是单向的,基于请求响应模式(浏览器发送请求给服务器)
  • WebSocket支持双向通信
  • HTTP和WebSocket底层都是TCP连接

2. 工作原理:

  • 建立连接:客户端向服务器发起 WebSocket 连接请求,该请求通过 HTTP 协议进行握手。如果服务器支持 WebSocket,它会返回一个特殊的 HTTP 响应,通知客户端可以将连接升级为 WebSocket 连接。
  • 数据传输:一旦连接建立,客户端和服务器可以随时双向发送数据。数据以帧的形式进行传输,可以是文本数据或二进制数据。
  • 连接关闭:任何一方都可以发送关闭连接的请求,关闭连接后双方不能再进行数据传输。

**思考**:既然WebSocket支持双向通信,功能看似比HTTP强大,那么我们是不是可以基于WebSocket开发所有的业务功能?

WebSocket缺点

  • 服务器长期维护长连接需要一定的成本
  • 各个浏览器支持程度不一
  • WebSocket 是长连接,受网络限制比较大,需要处理好重连

结论:WebSocket并不能完全取代HTTP,它只适合在特定的场景下使用

3. 应用场景:

  • 实时聊天应用:实现用户之间的即时通信,消息实时推送。
  • 在线游戏:同步游戏状态,实时交互。
  • 金融交易平台:实时显示股票价格、交易数据等。
  • 监控系统:实时反馈系统状态、设备运行数据等。
  • 弹幕的实现

二、入门案例

以下是一个使用 Java 和 Spring Boot 实现的简单 WebSocket 入门案例:

  1. 创建一个 Spring Boot 项目,并在项目的依赖管理文件(如 pom.xml)中添加 Spring Boot WebSocket 的依赖:
<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
  1. 配置 WebSocket:

创建一个配置类,用于配置 WebSocket 端点:

import org.springframework.context.annotation.Bean;
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 {@Overridepublic void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {registry.addHandler(sampleWebSocketHandler(), "/ws").setAllowedOrigins("*");}@Beanpublic SampleWebSocketHandler sampleWebSocketHandler() {return new SampleWebSocketHandler();}
}
  1. 创建 WebSocket 处理类:
import org.springframework.stereotype.Component;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;import java.io.IOException;
import java.util.ArrayList;
import java.util.List;@Component
public class SampleWebSocketHandler extends TextWebSocketHandler {private List<WebSocketSession> sessions = new ArrayList<>();@Overridepublic void handleTextMessage(WebSocketSession session, TextMessage message) throws IOException {// 当接收到客户端消息时,可以进行处理并向所有连接的客户端广播String payload = message.getPayload();for (WebSocketSession s : sessions) {s.sendMessage(message);}}@Overridepublic void afterConnectionEstablished(WebSocketSession session) throws Exception {// 当连接建立时,将 session 添加到列表中sessions.add(session);}@Overridepublic void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {// 当连接关闭时,从列表中移除 sessionsessions.remove(session);}
}
  1. 在前端页面中使用 WebSocket:
<!DOCTYPE html>
<html><head><script>var socket = new WebSocket("ws://localhost:8080/ws");socket.onmessage = function (event) {console.log(event.data);};function sendMessage() {var message = document.getElementById("messageInput").value;socket.send(message);}</script>
</head><body><input type="text" id="messageInput"><button onclick="sendMessage()">发送消息</button>
</body></html>

相关文章:

WebSocket介绍和入门案例

目录 一、WebSocket 详解1. 定义与特点&#xff1a;2. 工作原理&#xff1a;3. 应用场景&#xff1a; 二、入门案例 一、WebSocket 详解 1. 定义与特点&#xff1a; WebSocket 是一种在单个 TCP 连接上进行全双工通信的协议。它允许客户端和服务器之间进行实时、双向的数据传…...

k8s集群版本升级

Kubernetes 集群版本升级是为了获得最新的功能、增强的安全性和性能改进。然而&#xff0c;升级过程需要谨慎进行&#xff0c;特别是在生产环境中。通常&#xff0c;Kubernetes 集群的版本升级应遵循逐步升级的策略&#xff0c;不建议直接跳过多个版本。 Kubernetes 版本升级的…...

XML 和 SimpleXML 简介

XML 和 SimpleXML 简介 XML&#xff08;可扩展标记语言&#xff09;是一种用于存储和传输数据的标记语言。它定义了一组规则&#xff0c;用于在文档中编码数据&#xff0c;以便人和机器都能理解。XML 的设计目标是既易于人类阅读&#xff0c;也易于机器解析。SimpleXML 是 PHP…...

MySQL 中 LIKE 语句的 `%` 和 `_` 以及 BLOB 和 TEXT 的详细解析和案例示范

1. LIKE 语句中的 % 和 _ 用法 1.1 % 通配符的用法 % 通配符代表零个或多个字符。它是 MySQL 中用于模糊匹配的强大工具之一&#xff0c;可以在任何字符的位置使用。 示例 1&#xff1a;查找以特定字符开头的记录 假设我们有一个电商订单系统的 orders 表&#xff0c;其中包…...

git clone卡在Receiving objects

git clone卡在Receiving objects 一直卡主 $ git clone gitxxx.git Cloning into xxx... remote: Enumerating objects: 75926, done. remote: Counting objects: 100% (18844/18844), done. remote: Compressing objects: 100% (6566/6566), done. Receiving objects: 60% (…...

vue+ant 弹窗可以拖动

通过自定义指令实现拖拽功能 在main.js里加入drag自定义指令 我自己测试时发现modal不管如何设置宽度&#xff0c;居中等&#xff0c;他的初始的left都为0&#xff0c;如果不设置好&#xff0c;容易出现点击后刚开始移动弹窗会偏移一段距离。 Vue.directive(drag, {bind(el)…...

(42)MATLAB中使用fftshift绘制以零为中心的功率谱

文章目录 前言一、MATLAB代码二、仿真结果画图 前言 在分析信号的频率分量时&#xff0c;将零频分量平移到频谱中心会很有帮助。本例给出绘制以零为中心的功率谱的方法。 一、MATLAB代码 代码如下&#xff1a; f 1; % 余弦波的振荡频率&#xf…...

Windows本地部署中文羊驼模型(Chinese-Alpaca-Pro-7B)(通俗易懂版)

最近由于项目原因需要部署大语言模型, 但碍于经济实力, 只能部署在笔记本电脑上部署量化模型, &#xff08;电脑至少有16G运行内存&#xff09;&#xff0c;搜集了网上的相关部署资料仍然踩了不少坑&#xff0c;原因在于开源项目在不断更新&#xff0c;导致我们看了别人的教程仍…...

Web3的挑战与机遇:技术发展的现状分析

在Web3的世界中&#xff0c;去中心化和用户主权的理念正逐渐走向主流&#xff0c;推动了现有商业模式和技术生态系统的深刻变革。区块链技术及其核心应用之一——智能合约&#xff0c;正在促使这一转变的发生。智能合约的主要功能是通过自动化和预设协议执行&#xff0c;以减少…...

LangGraph - Hierarchical Agent Teams

本文翻译整理自 Hierarchical Agent Teams https://langchain-ai.github.io/langgraph/tutorials/multi_agent/hierarchical_agent_teams/ 文章目录 一、前言二、设置三、创建工具四、Helper Utilities五、定义代理 Team研究 Team文档写作Team 六、添加图层 一、前言 在前面的…...

2021-04-14 proteus中仿真时74HC245三态双向端口扩展输出

缘由proteus中仿真时74HC245输出时电平显示灰色&#xff08;不确定电平状态&#xff09;是为什么&#xff1f;-编程语言-CSDN问答 缘由C语言翻译单片机开关检测器-编程语言-CSDN问答 参考74ls245的工作原理及作用详解 - 电子发烧友网 参考74ls245_百度百科...

解决UNSPSC商品分类的层级不足的方法

《联合国标准产品和服务守则》&#xff08;UNSPSC&#xff09;是一个分层框架&#xff0c;旨在对产品和服务进行分类。其主要目标是通过提供统一的方法来对产品和服务进行分类&#xff0c;从而简化采购和供应链管理。 虽然 UNSPSC 有效地将产品分为各种商品类别&#xff0c;但…...

Pytest基于fixture的参数化及解决乱码问题

我们知道&#xff0c;Pytest是Python技术栈下进行自动化测试的主流测试框架。支持灵活的测试发现、执行策略&#xff0c;强大的Fixture夹具和丰富的插件支持。 除了通过pytest的parametrize标签进行参数化外&#xff0c;我们通过fixture的param参数也可以比较方便地实现参数化…...

使用excel.js(layui-excel)进行layui多级表头导出,根据单元格内容设置背景颜色,并将导出函数添加到toolbar

本段是菜狗子的碎碎念&#xff0c;解决办法请直接从第二段开始看。layui多级表头的导出&#xff0c;弄了两天才搞定&#xff0c;中途一度想放弃&#xff0c;还好坚持下来了。一开始用的是layui的toolbar里自带的那个导出&#xff0c;但是多级表头没有正常导出&#xff0c;单元格…...

Mysql 5.7 安装与卸载(非常详细)

一、环境介绍 操作系统&#xff1a;CentOS 7 MySQL&#xff1a;5.7 二、MySQL卸载 # 查看软件 rpm -qa|grep mysql # 卸载MySQL yum remove -y mysql mysql-libs mysql-common rm -rf /var/lib/mysql rm /etc/my.cnf 继续查看是否还有 MySQL 软件&#xff0c;有的话继续删…...

030 elasticsearch查询、聚合

文章目录 查询聚合查询RestHighLevelClientElasticsearchRestTemplat SpringData对ES客户端的封装&#xff1a;ElasticsearchRestTemplate SpringData对CRUD的封装&#xff1a;ElasticsearchRepository 原生ES客户端&#xff1a;RestHighLevelClient 查询 package com.xd.cube…...

前端工程启动工具

一些思考 在公司项目中&#xff0c;需要启一个新的前端工程&#xff08;一个基于Webpack的React工程&#xff09;。因为同一个项目中有其他的前端工程&#xff0c;我们最开始想的是参考另外一个工程的配置重启一个新的工程&#xff0c;但是又因为原来的工程用的库版本都比较老…...

游戏逆向基础-跳出游戏线程发包

附加游戏后下断点 bp ws2_32.send send函数断下后&#xff0c;可以看到数据地址每次都一样 可以说明这个游戏是线程发包&#xff0c;所以直接在数据窗口中转到这个地址&#xff0c;然后对这个地址下硬件写入断点。 下了硬件写入断点后可以一层一层往上面跟&#xff0c;确定写…...

做海外网站需要准备什么

一&#xff0c;购买域名 在租用国外服务器之前&#xff0c;您需要购买域名。域名是访问网站的标志&#xff0c;也是网站品牌的一部分。因此&#xff0c;在购买域名时&#xff0c;需要考虑域名的可记忆性、简短性和搜索性&#xff0c;使网站更容易被用户记住。 二&#xff0c;租…...

通过OpenCV实现 Lucas-Kanade 算法

目录 简介 Lucas-Kanade 光流算法 实现步骤 1. 导入所需库 2. 视频捕捉与初始化 3. 设置特征点参数 4. 创建掩模 5. 光流估计循环 6. 释放资源 结论 简介 在计算机视觉领域&#xff0c;光流估计是一种追踪物体运动的技术。它通过比较连续帧之间的像素强度变化来估计图…...

Qt/C++开发监控GB28181系统/取流协议/同时支持udp/tcp被动/tcp主动

一、前言说明 在2011版本的gb28181协议中&#xff0c;拉取视频流只要求udp方式&#xff0c;从2016开始要求新增支持tcp被动和tcp主动两种方式&#xff0c;udp理论上会丢包的&#xff0c;所以实际使用过程可能会出现画面花屏的情况&#xff0c;而tcp肯定不丢包&#xff0c;起码…...

三维GIS开发cesium智慧地铁教程(5)Cesium相机控制

一、环境搭建 <script src"../cesium1.99/Build/Cesium/Cesium.js"></script> <link rel"stylesheet" href"../cesium1.99/Build/Cesium/Widgets/widgets.css"> 关键配置点&#xff1a; 路径验证&#xff1a;确保相对路径.…...

IGP(Interior Gateway Protocol,内部网关协议)

IGP&#xff08;Interior Gateway Protocol&#xff0c;内部网关协议&#xff09; 是一种用于在一个自治系统&#xff08;AS&#xff09;内部传递路由信息的路由协议&#xff0c;主要用于在一个组织或机构的内部网络中决定数据包的最佳路径。与用于自治系统之间通信的 EGP&…...

PPT|230页| 制造集团企业供应链端到端的数字化解决方案:从需求到结算的全链路业务闭环构建

制造业采购供应链管理是企业运营的核心环节&#xff0c;供应链协同管理在供应链上下游企业之间建立紧密的合作关系&#xff0c;通过信息共享、资源整合、业务协同等方式&#xff0c;实现供应链的全面管理和优化&#xff0c;提高供应链的效率和透明度&#xff0c;降低供应链的成…...

什么是库存周转?如何用进销存系统提高库存周转率?

你可能听说过这样一句话&#xff1a; “利润不是赚出来的&#xff0c;是管出来的。” 尤其是在制造业、批发零售、电商这类“货堆成山”的行业&#xff0c;很多企业看着销售不错&#xff0c;账上却没钱、利润也不见了&#xff0c;一翻库存才发现&#xff1a; 一堆卖不动的旧货…...

《通信之道——从微积分到 5G》读书总结

第1章 绪 论 1.1 这是一本什么样的书 通信技术&#xff0c;说到底就是数学。 那些最基础、最本质的部分。 1.2 什么是通信 通信 发送方 接收方 承载信息的信号 解调出其中承载的信息 信息在发送方那里被加工成信号&#xff08;调制&#xff09; 把信息从信号中抽取出来&am…...

高等数学(下)题型笔记(八)空间解析几何与向量代数

目录 0 前言 1 向量的点乘 1.1 基本公式 1.2 例题 2 向量的叉乘 2.1 基础知识 2.2 例题 3 空间平面方程 3.1 基础知识 3.2 例题 4 空间直线方程 4.1 基础知识 4.2 例题 5 旋转曲面及其方程 5.1 基础知识 5.2 例题 6 空间曲面的法线与切平面 6.1 基础知识 6.2…...

Psychopy音频的使用

Psychopy音频的使用 本文主要解决以下问题&#xff1a; 指定音频引擎与设备&#xff1b;播放音频文件 本文所使用的环境&#xff1a; Python3.10 numpy2.2.6 psychopy2025.1.1 psychtoolbox3.0.19.14 一、音频配置 Psychopy文档链接为Sound - for audio playback — Psy…...

Spring Cloud Gateway 中自定义验证码接口返回 404 的排查与解决

Spring Cloud Gateway 中自定义验证码接口返回 404 的排查与解决 问题背景 在一个基于 Spring Cloud Gateway WebFlux 构建的微服务项目中&#xff0c;新增了一个本地验证码接口 /code&#xff0c;使用函数式路由&#xff08;RouterFunction&#xff09;和 Hutool 的 Circle…...

C# 求圆面积的程序(Program to find area of a circle)

给定半径r&#xff0c;求圆的面积。圆的面积应精确到小数点后5位。 例子&#xff1a; 输入&#xff1a;r 5 输出&#xff1a;78.53982 解释&#xff1a;由于面积 PI * r * r 3.14159265358979323846 * 5 * 5 78.53982&#xff0c;因为我们只保留小数点后 5 位数字。 输…...