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

EventSource和websocket该用哪种技术

EventSource(也称为Server-Sent Events, SSE)和WebSocket都是实现实时通信的技术,但是它们的设计目的和使用场景有所不同。在选择使用哪种技术时,需要根据具体的应用需求来决定。下面是一些关键点,可以帮助你做出选择:

EventSource (SSE)

  • 单向通信:SSE 是一种服务器向客户端推送数据的机制,只能实现从服务器到客户端的单向通信。
  • 简单性:相比 WebSocket,SSE 更加简单易用,不需要额外的握手过程,只需要一个标准的 HTTP 请求。
  • 自动重连:SSE 内置了重连机制,当连接断开时可以自动尝试重新建立连接。
  • 文本数据:SSE 只支持文本数据的传输,通常是以 UTF-8 编码的。
  • HTTP 协议:基于 HTTP/1.1 协议,可以很好地与现有的 HTTP 基础设施集成。
  • 适用场景:适用于需要服务器向客户端发送更新或通知的场景,如股票价格更新、新闻推送等。

WebSocket

  • 双向通信:WebSocket 支持全双工通信,允许客户端和服务器之间互相发送数据。
  • 复杂性:WebSocket 需要一个特殊的握手过程来建立连接,比 SSE 更加复杂。
  • 数据类型:支持二进制数据和文本数据的传输,更加灵活。
  • 协议独立:虽然 WebSocket 通常通过 HTTP 进行初始握手,但一旦连接建立,它就不再受限于 HTTP,可以用于任何类型的网络应用。
  • 适用场景:适用于需要频繁双向通信的应用,如在线游戏、实时聊天应用等。

如何选择

  • 如果应用需要简单的服务器到客户端的数据推送,且对数据格式没有特殊要求(即可以接受文本格式),那么 SSE 是一个轻量级且易于实现的选择。
  • 如果应用需要更复杂的双向通信,或者需要传输二进制数据,那么 WebSocket 更适合,尽管它的实现会相对复杂一些。
  • 考虑现有基础设施:如果你的应用已经大量依赖于 HTTP 协议,那么使用 SSE 可能会更加方便,因为它本身就是基于 HTTP 的。相反,如果你的应用需要更强大的功能,WebSocket 提供了更多的可能性。

下面是一些使用 Node.js 实现 EventSource (SSE) 和 WebSocket 的示例。

1. 使用 EventSource (SSE)

服务器端 (Node.js)

首先,安装必要的依赖:

npm install express

然后创建一个简单的 Express 服务器来发送服务器发送事件 (SSE):

const express = require('express');
const app = express();
const port = 3000;app.get('/events', (req, res) => {res.setHeader('Content-Type', 'text/event-stream');res.setHeader('Cache-Control', 'no-cache');res.setHeader('Connection', 'keep-alive');const sendEvent = (data) => {res.write(`data: ${JSON.stringify(data)}\n\n`);};// 模拟每隔两秒发送一次事件const intervalId = setInterval(() => {sendEvent({ message: 'Hello, SSE!', timestamp: new Date().toISOString() });}, 2000);// 当客户端断开连接时清理资源req.on('close', () => {clearInterval(intervalId);res.end();});
});app.listen(port, () => {console.log(`Server is running on http://localhost:${port}`);
});
客户端 (HTML + JavaScript)

创建一个简单的 HTML 文件来接收并显示 SSE 事件:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>SSE Example</title>
</head>
<body><h1>Server-Sent Events</h1><div id="messages"></div><script>const eventSource = new EventSource('/events');eventSource.onmessage = function(event) {const data = JSON.parse(event.data);const messagesDiv = document.getElementById('messages');const messageElement = document.createElement('p');messageElement.textContent = `${data.message} at ${data.timestamp}`;messagesDiv.appendChild(messageElement);};eventSource.onerror = function(error) {console.error('EventSource failed:', error);};</script>
</body>
</html>

2. 使用 WebSocket

服务器端 (Node.js)

首先,安装必要的依赖:

npm install express ws

然后创建一个简单的 Express 服务器并集成 WebSocket:

const express = require('express');
const { Server } = require('ws');
const app = express();
const http = require('http');
const port = 3000;const server = http.createServer(app);
const wss = new Server({ server });wss.on('connection', (ws) => {console.log('Client connected');ws.on('message', (message) => {console.log('Received:', message);ws.send(`Echo: ${message}`);});ws.on('close', () => {console.log('Client disconnected');});// 模拟每隔两秒发送一次消息const intervalId = setInterval(() => {ws.send(JSON.stringify({ message: 'Hello, WebSocket!', timestamp: new Date().toISOString() }));}, 2000);ws.on('close', () => {clearInterval(intervalId);});
});app.get('/', (req, res) => {res.sendFile(__dirname + '/index.html');
});server.listen(port, () => {console.log(`Server is running on http://localhost:${port}`);
});
客户端 (HTML + JavaScript)

创建一个简单的 HTML 文件来连接 WebSocket 并显示消息:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>WebSocket Example</title>
</head>
<body><h1>WebSocket Example</h1><div id="messages"></div><script>const socket = new WebSocket('ws://localhost:3000');socket.onopen = function() {console.log('Connected to WebSocket server');};socket.onmessage = function(event) {const data = JSON.parse(event.data);const messagesDiv = document.getElementById('messages');const messageElement = document.createElement('p');messageElement.textContent = `${data.message} at ${data.timestamp}`;messagesDiv.appendChild(messageElement);};socket.onclose = function() {console.log('Disconnected from WebSocket server');};socket.onerror = function(error) {console.error('WebSocket error:', error);};// 发送消息到服务器document.addEventListener('DOMContentLoaded', () => {const sendMessageButton = document.createElement('button');sendMessageButton.textContent = 'Send Message';document.body.appendChild(sendMessageButton);sendMessageButton.addEventListener('click', () => {socket.send('Hello, Server!');});});</script>
</body>
</html>

总结

  • EventSource (SSE):适用于简单的服务器到客户端的数据推送,实现简单,维护成本低。
  • WebSocket:适用于需要双向通信的场景,功能强大,但实现相对复杂。

相关文章:

EventSource和websocket该用哪种技术

EventSource&#xff08;也称为Server-Sent Events, SSE&#xff09;和WebSocket都是实现实时通信的技术&#xff0c;但是它们的设计目的和使用场景有所不同。在选择使用哪种技术时&#xff0c;需要根据具体的应用需求来决定。下面是一些关键点&#xff0c;可以帮助你做出选择&…...

通信工程学习:什么是三网融合

三网融合 三网融合&#xff0c;又称“三网合一”&#xff0c;是指电信网、广播电视网、互联网在高层业务应用上的深度融合。这一概念在近年来随着信息技术的快速发展而逐渐受到重视&#xff0c;并成为推动信息化社会建设的重要力量。以下是对三网融合的详细解释&#xff1a; 一…...

自定义类型结构体(上)

目录 结构体类型的声明结构体的概念结构体的声明特殊的声明结构的自引用 结构体变量的创建和初始化结构成员访问操作符 结构体类型的声明 结构体的概念 结构体是一些值的集合&#xff0c;这些值称为成员变量。结构的每个成员可以是不同类型的变量 举个例子:杰克的英语只考了6…...

b站-湖科大教书匠】4 网络层 - 计算机网络微课堂

【b站-湖科大教书匠】4 网络层 - 计算机网络微课堂_湖科大的计算机网络网课-CSDN博客...

国际 Android WPS Office v18.13 解锁版

WPS Office 移动版&#xff0c;设计不断优化&#xff0c;性能再次提升&#xff01;融入Google Android最新设计标准&#xff0c;Material Design设计风格&#xff0c;完美支持沉浸式&#xff01;简化文档操作&#xff0c;全新移动办公力作。全新界面更清晰舒适&#xff0c;功能…...

【中间件学习】Git的命令和企业级开发

一、Git命令 1.1 创建Git本地仓库 仓库是进行版本控制的一个文件目录。我们要想对文件进行版本控制&#xff0c;就必须创建出一个仓库出来。创建一个Git本地仓库对应的命令是 git init &#xff0c;注意命令要在文件目录下执行。 hrxlavm-1lzqn7w2w6:~/gitcode$ pwd /home/hr…...

FTP连接池与多线程FTP上传下载算法(Java)

设计一个能够处理FTP连接池在多线程环境下,尤其是涉及到故障重连时避免竞争条件的算法,需要综合考虑线程同步、连接状态管理和重试机制。以下是一个设计思路和实现方案: 设计思路 连接池管理: 维护一个连接池,其中包含多个FTP连接对象。每个FTP连接对象需有状态标记(如…...

Spring Cloud微服务详解

Spring Cloud微服务详解 在当今的数字化时代&#xff0c;微服务架构已成为构建大型、复杂应用系统的主流方式。Spring Cloud&#xff0c;作为微服务领域的一颗璀璨明星&#xff0c;以其强大的功能和灵活的架构&#xff0c;吸引了无数开发者的目光。本文将深入探讨Spring Cloud…...

QT学习笔记1.2(QT的应用)

QT原生用于c的开发&#xff0c; 主要应用于电脑、桌面手机桌面软件的开发&#xff0c;主要是widget样式模板。 Qt Widgets、Qt Quick 和 Qt for Python 是 Qt 框架中的三种不同的技术&#xff0c;分别用于不同的应用场景。以下是它们的详细介绍和对比&#xff1a; 1. Qt Widg…...

数学建模算法与应用 第1章 线性规划

第1章 线性规划 线性规划是数学规划领域的重要分支&#xff0c;广泛应用于资源配置、生产计划、物流管理等领域。它主要用于解决如何在满足一定约束条件下&#xff0c;使目标函数&#xff08;如成本、利润等&#xff09;达到最大或最小的问题。第一章将介绍线性规划的基本概念…...

使用 systemd 设置 PHP 程序为服务

使用 systemd 设置 PHP 程序为服务 在现代 Linux 系统中&#xff0c;systemd 是用于管理和控制服务的标准工具。通过 systemd&#xff0c;我们可以轻松地将 PHP 程序配置为后台运行的系统服务&#xff0c;从而实现自动化启动、重启和日志记录等功能。本文将介绍如何为 PHP 程序…...

HRNET模型实现钢板表面缺陷检测

关于深度实战社区 我们是一个深度学习领域的独立工作室。团队成员有&#xff1a;中科大硕士、纽约大学硕士、浙江大学硕士、华东理工博士等&#xff0c;曾在腾讯、百度、德勤等担任算法工程师/产品经理。全网20多万粉丝&#xff0c;拥有2篇国家级人工智能发明专利。 社区特色…...

28 基于51单片机的两路电压检测(ADC0808)

目录 一、主要功能 二、硬件资源 三、程序编程 四、实现现象 一、主要功能 基于51单片机&#xff0c;通过ADC0808获取两路电压&#xff0c;通过LCD1602显示 二、硬件资源 基于KEIL5编写C代码&#xff0c;PROTEUS8.15进行仿真&#xff0c;全部资源在页尾&#xff0c;提供…...

SpringBootTest Mockito 虚实结合编写测试

SpringBootTest & Mockito 虚实结合测试 起因 单一使用mockito&#xff0c;会出现很多mock困难的问题&#xff0c;导致测试编写过程太长&#xff0c;太恶心 单一使用springboottest&#xff0c;会遇到需要外部接口的地方&#xff0c;这个时候就非得去真实调用才行。也很恶…...

国内外网络安全政策动态(2024年9月)

国内网络安全政策动态 ▶︎ 1.三项智能网联汽车强制性国家标准正式发布 9月4日&#xff0c;工业和信息化部组织制定的GB 44495—2024《汽车整车信息安全技术要求》、GB 44496—2024《汽车软件升级通用技术要求》和GB 44497—2024《智能网联汽车 自动驾驶数据记录系统》三项强制…...

使用Android studio进行Unit Test中遇到的问题记录

1、模块本身代码运行不起来 提示&#xff1a; Cannot resolve method ‘getVolumes’ in ‘StorageManager’ Cannot resolve method ‘registerListener’ in ‘StorageManager’ Cannot resolve method ‘unregisterListener’ in ‘StorageManager’ 查看Android 源码&…...

智能运维与问题诊断工具:提升生产环境的安全稳定性

引言 在当今复杂的IT环境中,确保生产系统的安全稳定运行是一项巨大挑战。随着技术的进步,智能运维和问题诊断工具应运而生,为IT团队提供了强大的支持。本文将介绍一系列先进的工具,这些工具利用人工智能、机器学习和自动化技术,帮助组织提高系统可靠性、加速问题解决、优…...

【MAUI】CommunityToolkit社区工具包介绍

一、为什么需要声明式开发 .NET的MVVM,始于WPF,很古典,它甚至可能是现代前端框架“声明式开发”的鼻祖。声明式开发,之所以出现,是因为命令式开发在UI层和代码层上无法解耦的问题。如下图所示: 1、命令式开发:后台代码需要调用UI层的控件(label.Text),如果更新UI层…...

【答疑解惑】图文深入详解undo和redo的区别及其底层逻辑

题记&#xff1a;最近有些人问我&#xff0c;undo和redo到底是什么关系&#xff0c;他们中不乏已经入行3-4年的同学&#xff0c;今天咱们就来深入探讨下到底什么是undo和redo&#xff0c;他们分别做什么&#xff0c;底层逻辑原理是什么等等。 1. undo 1.1 undo的存储结构 Un…...

低通滤波、反相放大器电路

1 简介 这种可调低通滤波、反相放大器电路可将信号电平放大 26dB 或 20V/V。R2 和 C1 会为此电路设置截止频率。此电路的频率响应与无源 RC 滤波器的相同&#xff0c;除非输出按放大器的通带增益进行放大。低通滤波器通常用于音频信号链&#xff0c;此滤波器有时也称为低音增强…...

日语AI面试高效通关秘籍:专业解读与青柚面试智能助攻

在如今就业市场竞争日益激烈的背景下&#xff0c;越来越多的求职者将目光投向了日本及中日双语岗位。但是&#xff0c;一场日语面试往往让许多人感到步履维艰。你是否也曾因为面试官抛出的“刁钻问题”而心生畏惧&#xff1f;面对生疏的日语交流环境&#xff0c;即便提前恶补了…...

从深圳崛起的“机器之眼”:赴港乐动机器人的万亿赛道赶考路

进入2025年以来&#xff0c;尽管围绕人形机器人、具身智能等机器人赛道的质疑声不断&#xff0c;但全球市场热度依然高涨&#xff0c;入局者持续增加。 以国内市场为例&#xff0c;天眼查专业版数据显示&#xff0c;截至5月底&#xff0c;我国现存在业、存续状态的机器人相关企…...

el-switch文字内置

el-switch文字内置 效果 vue <div style"color:#ffffff;font-size:14px;float:left;margin-bottom:5px;margin-right:5px;">自动加载</div> <el-switch v-model"value" active-color"#3E99FB" inactive-color"#DCDFE6"…...

MODBUS TCP转CANopen 技术赋能高效协同作业

在现代工业自动化领域&#xff0c;MODBUS TCP和CANopen两种通讯协议因其稳定性和高效性被广泛应用于各种设备和系统中。而随着科技的不断进步&#xff0c;这两种通讯协议也正在被逐步融合&#xff0c;形成了一种新型的通讯方式——开疆智能MODBUS TCP转CANopen网关KJ-TCPC-CANP…...

2025盘古石杯决赛【手机取证】

前言 第三届盘古石杯国际电子数据取证大赛决赛 最后一题没有解出来&#xff0c;实在找不到&#xff0c;希望有大佬教一下我。 还有就会议时间&#xff0c;我感觉不是图片时间&#xff0c;因为在电脑看到是其他时间用老会议系统开的会。 手机取证 1、分析鸿蒙手机检材&#x…...

怎么让Comfyui导出的图像不包含工作流信息,

为了数据安全&#xff0c;让Comfyui导出的图像不包含工作流信息&#xff0c;导出的图像就不会拖到comfyui中加载出来工作流。 ComfyUI的目录下node.py 直接移除 pnginfo&#xff08;推荐&#xff09;​​ 在 save_images 方法中&#xff0c;​​删除或注释掉所有与 metadata …...

掌握 HTTP 请求:理解 cURL GET 语法

cURL 是一个强大的命令行工具&#xff0c;用于发送 HTTP 请求和与 Web 服务器交互。在 Web 开发和测试中&#xff0c;cURL 经常用于发送 GET 请求来获取服务器资源。本文将详细介绍 cURL GET 请求的语法和使用方法。 一、cURL 基本概念 cURL 是 "Client URL" 的缩写…...

用鸿蒙HarmonyOS5实现中国象棋小游戏的过程

下面是一个基于鸿蒙OS (HarmonyOS) 的中国象棋小游戏的实现代码。这个实现使用Java语言和鸿蒙的Ability框架。 1. 项目结构 /src/main/java/com/example/chinesechess/├── MainAbilitySlice.java // 主界面逻辑├── ChessView.java // 游戏视图和逻辑├──…...

SQL注入篇-sqlmap的配置和使用

在之前的皮卡丘靶场第五期SQL注入的内容中我们谈到了sqlmap&#xff0c;但是由于很多朋友看不了解命令行格式&#xff0c;所以是纯手动获取数据库信息的 接下来我们就用sqlmap来进行皮卡丘靶场的sql注入学习&#xff0c;链接&#xff1a;https://wwhc.lanzoue.com/ifJY32ybh6vc…...

在Spring Boot中集成RabbitMQ的完整指南

前言 在现代微服务架构中&#xff0c;消息队列&#xff08;Message Queue&#xff09;是实现异步通信、解耦系统组件的重要工具。RabbitMQ 是一个流行的消息中间件&#xff0c;支持多种消息协议&#xff0c;具有高可靠性和可扩展性。 本博客将详细介绍如何在 Spring Boot 项目…...