常见的实时通信技术(轮询、sse、websocket、webhooks)

1. HTTP轮询:最老实的办法

刚开始做实时功能时,我第一个想到的就是轮询。特别简单直白,就像你每隔5分钟就刷新一次朋友圈看看有没有新消息一样。

短轮询:勤快但费劲

短轮询就是客户端隔三差五地问服务器:"有新消息没?"不管有没有,服务器都会立即回答:"没有"或者"有,给你"。

专业一点的说法:

  1. 客户端定期向服务器发送HTTP请求
  2. 服务器立即响应,无论是否有新数据
  3. 客户端处理响应后,等待固定间隔再次请求
// 前端代码示例
setInterval(() => {
fetch('/api/check-updates')
.then(res => res.json())
.then(data => {
// 处理数据
});
}, 5000); // 每5秒问一次

​优点​​:

  • 实现简单,是个后端都会写
  • 兼容性无敌,连IE6都支持

​缺点​​:

  • 太费流量了,就像你每隔5分钟就给朋友发微信"在吗?"
  • 延迟感人,如果消息刚好在你两次询问之间来了,就得等下次轮询

长轮询:聪明一点的做法

后来我发现长轮询更聪明些。客户端问完"有新消息吗?",服务器会一直等着,直到真的有消息了才回复。

长轮询是对短轮询的改进:

  1. 客户端发送请求到服务器
  2. 服务器保持连接打开,直到有新数据或超时
  3. 一旦有数据或超时,服务器响应
  4. 客户端收到响应后立即发起新请求
function longPoll() {
fetch('/api/long-poll')
.then(res => res.json())
.then(data => {
// 处理数据
longPoll(); // 立即发起下一次请求
});
}

​体验提升​​:

  • 消息来得更快了,基本实时
  • 请求次数少了,省流量

​新问题​​:

  • 服务器得一直挂着这些连接,人一多就撑不住了
  • 还是得不停地建立新连接

2. SSE:服务器主动找你聊天

后来我发现SSE(Server-Sent Events)这个好东西。它就像你朋友主动给你发微信,不用你老问了。

  1. 客户端通过EventSource API建立到服务器的连接
  2. 连接保持打开状态,服务器可随时推送数据
  3. 数据以特定格式(text/event-stream)传输
  4. 自动处理连接中断和重连

// 前端
const eventSource = new EventSource('/sse-endpoint');eventSource.onmessage = (e) => {
console.log('收到消息:', e.data);
};

​爽点​​:

  • 消息实时推送,延迟超低
  • 自动重连,断网也不怕
  • 用起来特别简单

​不爽的地方​​:

  • 只能服务器推给你,你不能推给服务器(单向)
  • 有些老浏览器不支持
  • 只能传文本,想传文件没门

​适合场景​​:

  • 股票行情推送
  • 新闻实时更新
  • 像ChatGPT那种一个字一个字往外蹦的效果

3. WebSocket:真正的双向通话

想要真正的实时双向通信?那就得上WebSocket了。这就像微信通话,两边都能随时说话。

  1. 独立协议(ws://或加密wss://)
  2. 通过HTTP升级握手建立连接
  3. 之后保持持久连接双向通信

// 前端
const socket = new WebSocket('wss://example.com/ws');socket.onopen = () => {
socket.send('你好!');
};socket.onmessage = (e) => {
console.log('收到:', e.data);
};

​为什么香​​:

  • 真正的实时,延迟极低
  • 双向通信,想发就发
  • 一个连接管所有,省资源

​坑也不少​​:

  • 兼容性还是有点问题(不过现在大部分浏览器都OK了)
  • 得自己处理断线重连
  • 安全性要特别注意

​最适合​​:

  • 在线游戏(比如王者荣耀)
  • 实时聊天(微信、QQ这种)
  • 协同编辑(像腾讯文档)

4. Webhooks:让服务器主动找你

Webhooks比较特别,它让服务器主动调用你的接口。比如你女朋友说"有事给我打电话",这就是Webhooks。

​工作流程​​:

  1. 你告诉服务器你的回调地址
  2. 服务器有事就直接call你

专业一点的说法

  1. 客户端(实际是接收服务器)提供回调URL
  2. 服务端在事件发生时向该URL发送HTTP请求
  3. 接收方处理事件并返回响应
 
// 你的服务器接口
app.post('/webhook', (req, res) => {
console.log('收到通知:', req.body);
res.status(200).end();
});

​好处​​:

  • 实时性很好
  • 不用轮询,省事

​要注意​​:

  • 你的接口必须随时待命
  • 得做好安全验证
  • 高并发时可能会挂

​常用在​​:

  • 支付结果通知(比如支付宝回调)
  • GitHub代码提交触发CI/CD
  • 各种第三方服务集成

5、全面对比表

技术指标HTTP短轮询HTTP长轮询SSE (Server-Sent Events)WebSocketWebhooks
​通信方向​客户端→服务器客户端→服务器服务器→客户端双向全双工服务器→客户端
​协议基础​HTTPHTTPHTTP独立协议(ws/wss)HTTP
​连接方式​短连接长连接持久连接持久连接反向HTTP调用
​实时性​低(依赖轮询间隔)中(减少轮询间隔)极高
​数据格式​任意任意文本(Event Stream)文本/二进制任意
​实现复杂度​★★☆☆☆★★★☆☆★★★★☆★★★★★★★★☆☆
​兼容性​全平台全平台现代浏览器现代浏览器全平台
​服务器压力​高(频繁请求)中(保持连接)中(维护连接)取决于回调频率
​客户端压力​中(需管理连接)需部署服务端
​流量消耗​高(大量请求头)低(复用连接)极低
​自动重连​需手动实现需手动实现内置支持需手动实现需手动实现
​数据安全性​标准HTTPS标准HTTPS标准HTTPSWSS加密需额外验证
​适用场景​简单通知,低频更新中等实时性要求实时通知推送高频双向交互服务器触发的外部通知
​典型应用​简单消息提醒基础聊天功能股票行情、新闻推送在线游戏、IM应用支付回调、CI/CD触发
​实现示例​定时AJAX请求挂起HTTP请求EventSource APIWebSocket API提供回调URL端点

6、补充说明

  1. ​渐进增强策略​​:

    • 优先考虑:WebSocket > SSE > 长轮询 > 短轮询
    • 回退方案:可考虑功能检测后自动降级
  2. ​混合使用场景​​:

    • WebSocket + Webhooks:用于不同业务场景
    • SSE + 短轮询:兼容性方案
  3. ​性能考量​​:

    • 万级连接:WebSocket ≈ SSE > 长轮询 ≫ 短轮询
    • 带宽消耗:短轮询 > 长轮询 > Webhooks > SSE > WebSocket
  4. ​移动端特别提示​​:

    • 注意移动网络下的连接稳定性
    • 考虑省电模式对长连接的影响
  5. ​安全建议​​:

    • 所有技术都应使用加密版本(wss/https)
    • Webhooks必须实现签名验证
    • 限制连接频率防止DDoS

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

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

    相关文章

    Elasticsearch Fetch阶段面试题

    Elasticsearch Fetch阶段面试题 🚀 目录 基础原理性能优化错误排查场景设计底层机制总结基础原理 🔍 面试题1:基础原理 题目: 请描述Elasticsearch分布式搜索中Query阶段和Fetch阶段的工作流程,为什么需要将搜索过程拆分为这两个阶段? 👉 点击查看答案 查询流程…

    vr制作公司提供什么服务?

    随着科技的迅猛进步,虚拟现实(Virtual Reality,简称VR)技术已经悄然渗透到我们的日常生活与工作中,成为推动数字化转型的重要力量。VR制作公司,作为前沿领域的探索者和实践者,以专业的技术和创新…

    COCO数据集神经网络性能现状2025.5.18

    根据当前搜索结果,截至2025年5月,COCO数据集上性能最佳的神经网络模型及其关键参数如下: 1. D-FINE(中科大团队) 性能参数: 在COCO数据集上以78 FPS的速度实现了59.3%的平均精度(AP&#xff0…

    Sentinel原理与SpringBoot整合实战

    前言 随着微服务架构的广泛应用,服务和服务之间的稳定性变得越来越重要。在高并发场景下,如何保障服务的稳定性和可用性成为了一个关键问题。阿里巴巴开源的Sentinel作为一个面向分布式服务架构的流量控制组件,提供了从流量控制、熔断降级、…

    Ubuntu 20.04 报错记录: Matplotlib 无法使用 OpenCV 的 libqxcb.so

    网上查了一下这个报错,有很多解决方案,但是都不是针对 OpenCV 触发的这种 qt.qpa.plugin: Could not load the Qt platform plugin "xcb" in " */lib/*/site-packages/cv2/qt/plugins" even though it was found. 本文的方案是牺牲 …

    配置代理服务器访问github、google

    配置代理服务器访问github、google 背景与原理配置环境配置步骤云主机配置Windows客户端创建SSH隧道安装 Windows 内置 OpenSSHssh config 配置文件创建动态代理隧道 浏览器代理设置 验证浏览器访问google、githubssh 访问github 背景与原理 由于网络政策限制,中国…

    网络学习-利用reactor实现http请求(六)

    一、实现HTTP请求 1、印象里面,总有人说C/C语言不能实现HTTP请求,其实不然。C/C语言完全可以实现HTTP请求。通过对select,poll,epoll等IO多路复用技术的学习以及reactor模式的学习,完全能够实现HTTP请求。 2、webserver 主要解决两个问题 …

    【VSCode】修改侧边文件资源管理器中的文件夹折叠模式

    默认为紧凑模式: 然后我们勾选该项为宽松模式:

    信息化时代国产主板如何防止信息泄露?

    在数字化时代,每一份机密的泄露都可能成为我们的致命伤,尤其是如今网络如此发达的5G时代,如何防止网络信息泄密,已经成为每个人必须直面的问题。随着网络安全问题日益严重,企业和个人对网络安全的重视程度不断加深&…

    vue的简单使用

    1.vue的引入 引入函数&#xff0c;创建createApp对象 <div id"app">{{ message }}</div><script type"module">import { createApp, ref } from https://unpkg.com/vue3/dist/vue.esm-browser.jscreateApp({setup() {const message re…

    【图像生成大模型】HunyuanVideo:大规模视频生成模型的系统性框架

    HunyuanVideo&#xff1a;大规模视频生成模型的系统性框架 引言HunyuanVideo 项目概述核心技术1. 统一的图像和视频生成架构2. 多模态大语言模型&#xff08;MLLM&#xff09;文本编码器3. 3D VAE4. 提示重写&#xff08;Prompt Rewrite&#xff09; 项目运行方式与执行步骤1. …

    DPDK 技术详解:榨干网络性能的“瑞士军刀”

    你是否曾感觉&#xff0c;即使拥有顶级的服务器和万兆网卡&#xff0c;你的网络应用也总是“喂不饱”硬件&#xff0c;性能总差那么一口气&#xff1f;传统的网络处理方式&#xff0c;就像在高速公路上设置了太多的收费站和检查点&#xff0c;限制了数据包的“奔跑”速度。 今…

    力扣网-复写零

    1.题目要求 2.题目链接 1089. 复写零 - 力扣&#xff08;LeetCode&#xff09; 3.题目解答 class Solution {public void duplicateZeros(int[] arr) {int cur0,dest-1,narr.length;while(cur<n){//遇到0就dest走两步if(arr[cur]0){dest2;}//遇到非零元素dest就走一步els…

    STL中的Vector(顺序表)

    vector容器的基本用法&#xff1a; template<class T> class vector { T* _a; size_t size; size_t capacity; } 尾插和遍历&#xff1a; vector<int> v; v.push_back(1); v.push_back(2); v.push_back(3);//遍历 for(int i0;i<v.size();i) {cout<<…

    Hass-Panel - 开源智能家居控制面板

    文章目录 ▎项目介绍&#xff1a;预览图▎主要特性安装部署Docker方式 正式版Home Assistant Addon方式详细安装方式1. Home Assistant 插件安装&#xff08;推荐&#xff09;2. Docker 安装命令功能说明 &#xff1a;3. Docker Compose 安装升级说明Docker Compose 版本升级 功…

    ctfhub技能书http协议

    http://challenge-ffe8afcf1a75b867.sandbox.ctfhub.com:10800/index.php curl -v -X CTFHUB http://challenge-ffe8afcf1a75b867.sandbox.ctfhub.com:10800/index.php curl&#xff1a;用于发送 HTTP 请求的命令行工具。 -v&#xff08;--verbose&#xff09;&#xff1a;开启…

    Eigen与OpenCV矩阵操作全面对比:最大值、最小值、平均值

    功能对比总表 功能Eigen 方法OpenCV 方法主要区别最大值mat.maxCoeff(&row, &col)cv::minMaxLoc(mat, NULL, &maxVal, NULL, &maxLoc)Eigen需要分开调用&#xff0c;OpenCV一次获取最小值mat.minCoeff(&row, &col)cv::minMaxLoc(mat, &minVal, NU…

    结课作业01. 用户空间 MPU6050 体感鼠标驱动程序

    目录 一. qt界面实现 二. 虚拟设备模拟模拟鼠标实现体感鼠标 2.1 函数声明 2.2 虚拟鼠标实现 2.2.1 虚拟鼠标创建函数 2.2.2 鼠标移动函数 2.2.3 鼠标点击函数 2.3 mpu6050相关函数实现 2.3.1 i2c设备初始化 2.3.2 mpu6050寄存器写入 2.3.3 mpu6050寄存器读取 2.3.…

    [Docker排查] 镜像拉取/容器启动/网络不通?Docker常见错误与解决方案

    Docker&#xff0c;这个让无数开发者和运维工程师高呼“真香”的容器化技术&#xff0c;凭借其轻量、快速、可移植的特性&#xff0c;极大地简化了应用的开发、测试和部署流程。但即便是再“香”的技术&#xff0c;也难免有“闹脾气”的时候。你是不是也遇到过这样的“抓狂瞬间…

    Oracle如何解决LATCH:CACHE BUFFERS CHAINS

    CACHE BUFFERS CHAINS LATCH主要用于保护HASH CHAIN结构。一个CACHE BUFFERS CHAINS LATCH保护着多条HASH CHAIN。可以通过查看隐含参数_db_block_hash_latches的值或者查询vlatch_children视图获得系统中CACHE BUFFER CHAIN LATCH的数量。目前系统中CACHE BUFFER CHAIN LATCH的…