相比于 HTTP 协议,WebSocket协议的必要性体现在哪里?

news2024/10/5 14:51:07

HTTP 协议的一个缺点

        从 HTTP 协议的角度来看,就是点一下网页上的某个按钮,前端发一次 HTTP请 求,网站返回一次 HTTP 响应。这种由客户端主动请求,服务器响应的方式也满足大部分网页的功能场景。但是有没有发现,在HTTP下,服务器从来就「不会主动」给客户端发一次消息。

  • 我们知道 TCP 连接的两端,同一时间里双方都可以主动向对方发送数据。这就是所谓的全双工

  • 而现在使用最广泛的HTTP/1.1,也是基于TCP协议的,同一时间里,客户端和服务器只能有一方主动发数据,这就是所谓的半双工

        也就是说,好好的全双工 TCP,被 HTTP/1.1 用成了半双工。这是由于 HTTP 协议设计之初,考虑的是看看网页文本的场景,能做到客户端发起请求再由服务器响应,就够了,根本就没考虑网页游戏这种,客户端和服务器之间都要互相主动发大量数据的场景。

那如果就是要让服务器来主动点咋整呢?主要有三大解决方式

  • HTTP 不断轮询

  • HTTP长轮询

  • WebSocket

HTTP 不断轮询

        最常见的解决方案是,网页的前端代码里不断定时发 HTTP 请求到服务器,服务器收到请求后给客户端响应消息。这其实只是一种「」服务器推的形式。它其实并不是服务器主动发消息到客户端,而是客户端自己不断偷偷请求服务器,只是用户无感知而已。

用这种方式的场景也有很多,最常见的就是扫码登录。登录页面二维码出现之后,前端网页根本不知道用户扫没扫,于是不断去向后端服务器询问,看有没有人扫过这个码。而且是以大概 1 到 2 秒的间隔去不断发出请求,这样可以保证用户在扫码后能在 1 到 2 秒内得到及时的反馈,不至于等太久

但这样,会有两个比较明显的问题:

  • 当你打开 F12 页面时,你会发现满屏的 HTTP 请求。虽然很小,但这其实也消耗带宽,同时也会增加下游服务器的负担。

  • 最坏情况下,用户在扫码后,需要等个 1~2 秒,正好才触发下一次 HTTP 请求,然后才跳转页面,用户会感到明显的卡顿

长轮询

HTTP 请求发出后,一般会给服务器留一定的时间做响应,比如 3 秒,规定时间内没返回,就认为是超时。

如果我们的 HTTP 请求将超时设置的很大,比如 30 秒,在这 30 秒内只要服务器收到了扫码请求,就立马返回给客户端网页。如果超时,那就立马发起下一次请求。

这样就减少了 HTTP 请求的个数,并且由于大部分情况下,用户都会在某个 30 秒的区间内做扫码操作,所以响应也是及时的。

比如,某度云网盘就是这么干的。所以你会发现一扫码,手机点确认,电脑端网页就秒跳转,体验很好。

像这种发起一个请求,在较长时间内等待服务器响应的机制,就是所谓的长训轮机制。我们常用的消息队列 RocketMQ 中,消费者去取数据时,也用到了这种方式。

        像这种,在用户不感知的情况下,服务器将数据推送给浏览器的技术,就是所谓的服务器推送技术,对于像扫码登录这样的简单场景还能用用。但如果是网页游戏呢,游戏一般会有大量的数据需要从服务器主动推送到客户端。这就得说下 WebSocket 了。

WebSocket

为了更好的支持客户端和服务器之间都要互相主动发大量数据的场景,我们需要另外一个基于TCP的新协议。于是新的 应用层 协议WebSocket就被设计出来了。

怎么建立WebSocket连接

我们平时刷网页,一般都是在浏览器上刷的,一会刷刷图文,这时候用的是 HTTP 协议,一会打开网页游戏,这时候就得切换成我们新介绍的 WebSocket 协议

为了兼容这些使用场景。浏览器在 TCP 三次握手建立连接之后,都统一使用 HTTP 协议先进行一次通信。

  • 如果此时是普通的 HTTP 请求,那后续双方就还是老样子继续用普通 HTTP 协议进行交互,这点没啥疑问。

  • 如果这时候是想建立 WebSocket 连接,就会在 HTTP 请求里带上一些特殊的header 头,如下:

Connection: Upgrade
Upgrade: WebSocket
Sec-WebSocket-Key: T2a6wZlAwhgQNqruZ2YUyg==\r\n

这些 header 头的意思是,浏览器想升级协议,并且想升级成 WebSocket 协议。同时带上一段随机生成的 base64 码,发给服务器。

如果服务器正好支持升级成 WebSocket 协议。就会走 WebSocket 握手流程,同时根据客户端生成的 base64 码,用某个公开的算法变成另一段字符串,放在 HTTP 响应的 Sec-WebSocket-Accept 头里,同时带上101状态码,发回给浏览器。HTTP 的响应如下:

HTTP/1.1 101 Switching Protocols\r\n
Sec-WebSocket-Accept: iBJKv/ALIW2DobfoA4dmr3JHBCY=\r\n
Upgrade: WebSocket\r\n
Connection: Upgrade\r\n

HTTP 状态码=200(正常响应)的情况,大家见得多了。101 确实不常见,它其实是指协议切换

之后,浏览器也用同样的公开算法base64码转成另一段字符串,如果这段字符串跟服务器传回来的字符串一致,那验证通过。

就这样经历了一来一回两次 HTTP 握手,WebSocket就建立完成了,后续双方就可以使用 webscoket 的数据格式进行通信了。

WebSocket的使用场景

WebSocket完美继承了 TCP 协议的全双工能力,并且还贴心的提供了解决粘包的方案(采用TCP消息头规定消息体长度的方式)。

它适用于需要服务器和客户端(浏览器)频繁交互的大部分场景,比如网页/小程序游戏,网页聊天室,以及一些类似飞书这样的网页协同办公软件。

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

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

相关文章

WiFi7为什么需要6G频谱

从5925MHz到7125MHz,整整1200MHz的频谱,都被分配给了WiFi7。非常得豪! 只是国内还没有这个东西。 为什么要这么宽的频谱呢? Intel作过实验,发现在日常的场合下 一定是3个320MHz宽的不重叠信道,方能达到AV/…

小游戏实战-Python实现石头剪刀布+扫雷小游戏

小游戏实战-Python实现石头剪刀布扫雷小游戏 我想说废话止于此石头剪刀布-入门必学游戏游戏规则实现思路示例代码知识要点运行效果 扫雷-内网摸鱼必备游戏游戏规则实现思路示例代码知识要点运行效果 进阶练习-走迷宫(预留)游戏规则预期效果 总结 我想说 …

算法第三十天-矩阵中移动的最大次数

矩阵中移动的最大次数 题目要求 解题思路 网格图 DFS 从第一列的任一单元格 ( i , 0 ) (i,0) (i,0) 开始递归。枚举往右上/右/右下三个方向走,如果走一步后,没有出界,且格子值大于 g r i d [ i ] [ j ] grid[i][j] grid[i][j],则…

Java使用itextpdf往pdf中插入图片

引入maven依赖 <dependency><groupId>com.itextpdf</groupId><artifactId>itextpdf</artifactId><version>5.5.9</version> </dependency>java代码 import cn.hutool.extra.qrcode.QrCodeUtil; import com.itextpdf.text.*; i…

华为携手8家企业打造“AI大模型+行业”生态网络 | 百能云芯

据媒体报道&#xff0c;在“大模型行业创新合作计划”签约仪式上&#xff0c;华为云携手循环智能、迪安诊断、零浩网络、云译科技、蓝青教育、航天天目、标普云、乐聚机器人等8家企业&#xff0c;共同开启了一段全新的合作旅程。 这次合作将聚焦于“AI大模型行业”的应用开发&a…

IP代理的认证方式和协议介绍

“IP代理是指使用固定的IP地址作为代理服务器进行代理访问的方式。在网络应用中&#xff0c;IP代理可以为用户提供更加稳定的代理服务&#xff0c;同时也提高了访问网站的安全性。IP代理的认证方式和协议是实现代理服务的重要组成部分。” 一、认证方式 1.用户名和密码认证&am…

RK平台第一次开机速度优化 “Large app, accepted running with swap.“

RK平台第一次开机速度优化 "Large app, accepted running with swap." 问题描述解决方法 郑重声明:本人原创博文&#xff0c;都是实战&#xff0c;均经过实际项目验证出货的 转载请标明出处:攻城狮2015 Platform: Rockchip OS:Android 6.0.1 CPU:3368 Kernel: 3.10 问…

Elasticsearch:使用 OpenAI、LangChain 和 Streamlit 的基于 LLM 的 PDF 摘要器和 Q/A 应用程序

嘿&#xff01; 您是否曾经感觉自己被淹没在信息的海洋中&#xff1f; 有这么多的书要读&#xff0c;而时间却这么少&#xff0c;很容易就会超负荷&#xff0c;对吧&#xff1f; 但猜猜怎么了&#xff1f; 你可以使用大型语言模型创建自定义聊天机器人&#xff0c;该模型可以帮…

重磅升级!P230焕新而来,支持双目SLAM+YOLO点击跟踪,算力高达100TOPS

全新升级的Prometheus 230科研无人机&#xff08;简称P230&#xff09;是一款专为科研工作者及开发者设计的小型&#xff08;250mm轴距&#xff09;无人机实验平台。机载计算机升级为算力100TOPS的Allspark2-Orin NX&#xff0c;结合Prometheus自主无人机开源项目和Prometheus专…

H4010耐压40V降压恒压芯片 40V降12V降5V 支持电流2.5A

H4010是一种内置30V耐压MOS&#xff0c;并且能够实现精确恒压以及恒流的同步降压型 DC-DC 转换器&#xff1b; 支持 1A 持续输出电流输出电压可调&#xff0c;最大可支持 100%占空比&#xff1b;通过调节 FB 端口的分压电阻&#xff0c;可以输出 2.5V到 22V 的稳定电压 。H4010…

一文快速掌握docker的理念和基本使用

写在文章开头 写于一个周末&#xff0c;在复盘梳理文章时候发现这一篇关于早期了解docker时记录的文档&#xff0c;仔细阅读了一下&#xff0c;为了保证文章更加清晰以便读者使用。故再次重新一次梳理一次&#xff0c;通过这篇文章&#xff0c;你将会对docker的基本理念和基础…

Machine Learning ---- Gradient Descent

目录 一、The concept of gradient&#xff1a; ① In a univariate function&#xff1a; ②In multivariate functions&#xff1a; 二、Introduction of gradient descent cases&#xff1a; 三、Gradient descent formula and its simple understanding: 四、Formula o…

GPIO和Pinctrl子系统的使用

一、 Pinctrl子系统 1、基本架构 现在的芯片动辄几百个引脚&#xff0c;在使用到GPIO功能时&#xff0c;让你一个引脚一个引脚去找对应的寄存器&#xff0c;说实话很烦。所以&#xff0c;要把引脚的复用、配置抽出来&#xff0c;做成Pinctrl子系统&#xff0c;给GPIO、UART等模…

2082.找单词

动态规划问题&#xff1a; 先声明两个数组&#xff1a; 数组 a&#xff1a;存储当前状态下&#xff0c;所有可能的单词价值总和的计数。在每次迭代开始时&#xff0c;我们使用 a 数组来跟踪包含当前字母之前的所有可能单词的价值总和。 数组 b&#xff1a;在处理每个字母时&a…

XMind for mac/Win:解锁思维新境界,让思维导图成为你的创意引擎

在信息爆炸的时代&#xff0c;如何高效地整理思绪、捕捉灵感&#xff0c;成为每个人都需要面对的挑战。而XMind&#xff0c;作为一款功能强大的思维导图软件&#xff0c;正以其独特的魅力&#xff0c;帮助无数用户解锁思维新境界&#xff0c;让思维导图成为他们的创意引擎。 无…

idea远程试调jar、远程试调war

idea远程试调jar、远程试调war 目的&#xff1a;测试运行时与ide开发时是否一致。 配置jar Maven中添加 <packaging>jar</packaging>将其打包为jar。 设置运行入口main 编译jar 看到jar输出 配置试调 添加jar运行 远程试调 先在源码中打好断点试调 debug运行…

String类型详解

1. Java为何要创造String类 在C语言中,是没有String这个类型的,通常使用字符数组中存放一个个字符,再加上最后一个\0来表示/存放一个字符串.也可以使用一个字符指针指向字符串的首元素,直到遇到\0停止,再加上C语言头文件string.h中封装的函数,对于字符串的操作已经够用了. Java…

Learn OpenGL 18 几何着色器

几何着色器 在顶点和片段着色器之间有一个可选的几何着色器(Geometry Shader)&#xff0c;几何着色器的输入是一个图元&#xff08;如点或三角形&#xff09;的一组顶点。几何着色器可以在顶点发送到下一着色器阶段之前对它们随意变换。然而&#xff0c;几何着色器最有趣的地方…

入门:Vue全家桶都有谁,分别肩负什么责任?

当使用Vue.js开发项目时&#xff0c;通常会使用Vue全家桶来提供完整的开发工具和功能。以下是Vue全家桶的各个部分的详细介绍&#xff1a; 项目构建工具 - Vue-cli&#xff1a; Vue-cli是Vue.js官方提供的脚手架工具&#xff0c;可以快速生成一个Vue.jswebpack的项目模板。它提…

【机器学习-01】机器学习基本概念与建模流程

机器学习的过程本质上是一个不断通过数据训练来提升模型在对应评估指标上表现的过程。在此过程中&#xff0c;为模型提供有效的反馈并基于这些反馈进行持续的调整是至关重要的。只有当这个过程顺利进行时&#xff0c;模型才能得到有效的训练&#xff0c;机器才能真正实现学习。…