直播间讨论区需要WebSocket,简单了解下

由于 http 存在一个明显的弊端(消息只能有客户端推送到服务器端,而服务器端不能主动推送到客户端),导致如果服务器如果有连续的变化,这时只能使用轮询,而轮询效率过低,并不适合。于是 WebSocket被发明出来。

WebSocket技术在直播间讨论区中通常被使用。WebSocket是一种在Web浏览器和服务器之间建立持久性连接的协议,它允许实时的双向通信。相比起传统的HTTP请求-响应模式,WebSocket可以提供更快的数据传输速度和更低的延迟。

在直播间讨论区,用户可以发送消息、评论或者进行互动。通过WebSocket技术,服务器可以将这些消息实时地推送给其他观众,从而实现实时的讨论和互动体验。

通过WebSocket,直播间讨论区可以支持多个用户之间的实时消息交流,无需频繁地进行轮询或刷新页面。这种实时的交互性能使得用户能够更加方便地进行实时的互动和社交。

因此,WebSocket技术在直播间讨论区中被广泛采用,以实现实时的消息推送和交互功能。

目录

一、什么是WebSocket

二、WebSocket的特点

三、WebSocket的通信原理和机制

四、WebSocket相比于http有哪些优点

五、短轮询、长轮询和 WebSocket 间的区别

六、WebSocket 的握手

七、WebSocket使用及使用场景​​​​​​​


​​​​​​​​​​​​​​一、什么是WebSocket

   ​​​​​​​       WebSocket是一种在单个TCP连接上进行全双工通信的协议数据是通过http协议传输的,但是在建立连接之后,真正的数据传输阶段是不需要http协议参与的。客户端和服务器都可以随时向互相发送数据,能更好的节省服务器资源和带宽并达到实时通讯的目的。

二、WebSocket的特点

           1.WebSocket 采用了二进制帧结构,语法、语义与 HTTP 完全不兼容,但因为它的主要运行环境是浏览器,在使用习惯上尽量向 HTTP 靠拢。

          2.WebSocket 没有使用 TCP 的“IP 地址 + 端口号”,WebSocket 使用ws或wss协议,分别表示明文和加密的 WebSocket 协议。

三、WebSocket的通信原理和机制

          WebSocket约定了一个通信的规范,通过一个握手的机制,客户端和服务器之间能建立一个类似tcp服务器保持长连接,数据发送是双向。

四、WebSocket相比于http有哪些优点

websocket优点:

  • ​​​​​​​支持双向通信,实时性更强;
  • 可以发送文本,也可以二进制文件;
  • 协议标识符是 ws,加密后是 wss ;
  • 较少的控制开销。连接创建后,ws客户端、服务端进行数据交换时,协议控制的数据包头部较小。在不包含头部的情况下,服务端到客户端的包头只有2~10字节(取决于数据包长度),客户端到服务端的的话,需要加上额外的4字节的掩码。而HTTP协议每次通信都需要携带完整的头部;
  • 支持扩展。ws协议定义了扩展,用户可以扩展协议,或者实现自定义的子协议。(比如支持自定义压缩算法等)
  • 无跨域问题。

相同点:

  • 都是基于tcp的,都是可靠性传输协议
  • 都是应用层协议

不同点:

  • WebSocket是双向通信协议,模拟Socket协议,可以双向发送或接受信息
  • HTTP是单向的
  • WebSocket是需要浏览器和服务器握手进行建立连接的
  • 而http是浏览器发起向服务器的连接,服务器预先并不知道这个连接

联系:WebSocket在建立握手时,数据是通过HTTP传输的。但是建立之后,在真正传输时候是不需要HTTP协议的

五、短轮询、长轮询和 WebSocket 间的区别

1. 短轮询

短轮询的基本思路:
浏览器每隔一段时间向浏览器发送 http 请求,服务器端在收到请求后,不论是否有数据更新,都直接进行 响应。
这种方式实现的即时通信,本质上还是浏览器发送请求,服务器接受请求的一个过程,通过让客户端不断的进行请求,使得客户端能够模拟实时地收到服务器端的数据的变化。
优缺点
优点是比较简单,易于理解。
缺点是这种方式由于需要不断的建立 http 连接,严重浪费了服务器端和客户端的资源。当用户增加时,服务器端的压力就会变大,这是很不合理的。

2. 长轮询

​​​​​​​长轮询的基本思路:
首先由客户端向服务器发起请求,当服务器收到客户端发来的请求后,服务器端不会直接进行响应,而是先将 这个请求挂起,然后判断服务器端数据是否有更新。
如果有更新,则进行响应,如果一直没有数据,则到达一定的时间限制才返回。客户端 JavaScript 响应处理函数会在处理完服务器返回的信息后,再次发出请求,重新建立连接。
优缺点
长轮询和短轮询比起来,它的优点是明显减少了很多不必要的 http 请求次数,相比之下节约了资源。
长轮询的缺点在于,连接挂起也会导致资源的浪费

3. WebSocket

​​​​​​​WebSocket 是 Html5 定义的一个新协议,与传统的 http 协议不同,该协议允许由服务器主动的向客户端推送信息。
使用 WebSocket 协议的缺点是在服务器端的配置比较复杂。WebSocket 是一个全双工的协议,也就是通信双方是平等的,可以相互发送消息。

六、WebSocket 的握手

从图片可知,分三个阶段

  • 打开握手
  • 数据传递
  • 关闭握手

TCP握手

客户端和服务端都需要直到各自可收发,因此需要三次握手

三次握手 

  • 第一次握手成功让服务端知道了客户端具有发送能力
  • 第二次握手成功让客户端知道了服务端具有接收和发送能力,但此时服务端并不知道客户端是否接收到了自己发送的消息
  • 所以第三次握手就起到了这个作用。`

三次握手过程中可以携带数据吗

  • 第一次、第二次握手不可以携带数据,因为一握二握时还没有建立连接,会让服务器容易受到攻击
  • 而第三次握手,此时客户端已经处于 ESTABLISHED (已建立连接状态) ,对于客户端来说,已经建立起连接了,并且也已经知道服务器的接收、发送能力是正常的了,所以能携带数据也是没问题的。

四次挥手 

所谓的四次挥手即TCP连接的释放(解除)。连接的释放必须是一方主动释放,另一方被动释放

当只有服务端把所有的报文都发送完了,才会发送 FIN 报文,告诉客户端可以断开连接了,因此在断开连接时需要四次挥手。

  • 关闭连接时,当收到对方的FIN报文通知时,它仅仅表示对方没有数据发送给你了;但未必你所有的数据都全部发送给对方了
  • 所以你未必会马上关闭SOCKET,也即你可能还需要发送一些数据给对方之后,再发送FIN报文给对方来表示你同意现在可以关闭连接了,所以它这里的ACK报文和FIN报文多数情况下都是分开发送的。

为什么建立连接只通信了三次,而断开连接却用了四次?

  • 客户端要求断开连接,发送一个断开的请求,这个叫作(FIN)。
  • 服务端收到请求,然后给客户端一个 ACK,作为 FIN 的响应。
  • 这里你需要思考一个问题,可不可以像握手那样马上传 FIN 回去?
  • 其实这个时候服务端不能马上传 FIN,因为断开连接要处理的问题比较多,比如说服务端可能还有发送出去的消息没有得到 ACK;也有可能服务端自己有资源要释放。因此断开连接不能像握手那样操作——将两条消息合并。所以,服务端经过一个等待,确定可以关闭连接了,再发一条 FIN 给客户端
  • 客户端收到服务端的 FIN,同时客户端也可能有自己的事情需要处理完,比如客户端有发送给服务端没有收到 ACK 的请求,客户端自己处理完成后,再给服务端发送一个 ACK。

七、WebSocket使用及使用场景

1.创建websocket对象 ,通过地址客户端与服务器端的连接。

websocket 当前状态:
ws.readyState 
// 0: 'CONNECTING',表示正在连接
// 1: 'OPEN', 表示连接成功,可以通信了
// 2: 'CLOSING', 表示连接正在关闭
// 3: 'CLOSED', 表示连接已经关闭,或者打开连接失败。​​​​​​​

// 创建WebSocket连接.const socket = new WebSocket('ws://localhost:8080');

2. 连接成功触发

    连接触发事件:

  • Socket.onopen:连接建立时触发
  • Socke.onmessage:客户端接受服务端数据时触发
  • Socket.onerror:通信错误时触发
  • Socket.onclose:连接关闭时触发
 
ws.onopen = function () {// 指定连接成功后的回调函数}ws.onclose = function () {// 指定连接关闭后的回调函数}ws.onmessage = function () {// 指定收到服务器数据后的回调函数}ws.onerror = function () {// 指定报错时的回调函数}

3. 发送数据

ws.send(message)  向服务器发送数据

4.关闭连接

ws.close()  关闭当前连接

使用场景 

  • 即时通讯
  • 在线游戏
  • 软件更新
  • 直播聊天
  • 社交订阅
  • 多人协同在线编辑

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

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

相关文章

【css3】涟漪动画

效果展示 dom代码 <div class"mapSelfTitle66"><div></div> </div> 样式代码 .mapSelfTitle66{width:120px;height:60px;position: relative;&>div{width:100%;height:100%;background: url("~/assets/images/video_show/err…

怎么扫码下载视频?一招生成可下载的视频二维码

怎么做可以下载视频的二维码呢&#xff1f;当我们用二维码来分享时&#xff0c;很多视频二维码生成器制作的二维码都只有展示功能&#xff0c;无法让扫码者选择下载视频&#xff0c;那么这个问题有什么解决方法呢&#xff1f;对于有这方面需求的小伙伴&#xff0c;小编可以给大…

计算机视觉 计算机视觉识别是什么?

计算机视觉识别&#xff08;Computer Vision Recognition&#xff09;是计算机科学和人工智能领域中的一个重要分支&#xff0c;它致力于使计算机系统能够模拟和理解人类视觉的过程&#xff0c;从而能够自动识别、分析和理解图像或视频中的内容。这一领域的发展旨在让计算机具备…

Nginx常见问题解决

一、修改nginx.conf报错 背景&#xff1a;修改nginx.conf&#xff0c;配置转发到tcp的信息&#xff1a; 在stream块中配置转发规则&#xff1a;在stream块中&#xff0c;使用server指令来配置转发规则。例如&#xff0c;如果你要将TCP流量转发到example.com:1234&#xff0c;可…

Microsoft Edge不能工作了,可能原因不少,那么如何修复呢

Microsoft Edge打不开或不能加载网页是用户在Windows 10、Android、Mac和iOS设备上的网络浏览器上遇到的许多错误之一。其他Microsoft Edge问题可能包括浏览器窗口和选项卡冻结、网站崩溃、互联网连接错误消息以及丢失Microsoft Edge书签、收藏夹、密码和收藏。 Microsoft Edg…

【Nginx37】Nginx学习:SSL模块(一)简单配置与指令介绍

Nginx学习&#xff1a;SSL模块&#xff08;一&#xff09;简单配置与指令介绍 又是一个重点模块&#xff0c;SSL 模块&#xff0c;其实就是我们常见的 HTTPS 所需要的配置模块。HTTPS 的重要性不用多说了吧&#xff0c;现在所有的 App、小程序 都强制要求是 HTTPS 的&#xff0…

STM32-RTC实时时钟

目录 RTC实时时钟 功能框图 UNIX时间戳 初始化结构体 RTC时间结构体 RTC日期结构体 RTC闹钟结构体 进入和退出配置函数 实验环节1&#xff1a;显示日历 常规配置 RTC配置 测试环节 实验现象 实验环节2&#xff1a;闹钟 常规配置 RTC配置 测试环节 实验现象 R…

致远OA wpsAssistServlet任意文件读取漏洞复现 [附POC]

文章目录 致远OA wpsAssistServlet任意文件读取漏洞复现 [附POC]0x01 前言0x02 漏洞描述0x03 影响版本0x04 漏洞环境0x05 漏洞复现1.访问漏洞环境2.构造POC3.复现 0x06 修复建议 致远OA wpsAssistServlet任意文件读取漏洞复现 [附POC] 0x01 前言 免责声明&#xff1a;请勿利用…

lua-web-utils库

lua--导入所需的库local web_utilsrequire("lua-web-utils")--定义要下载的URLlocal url"https://jshk.com.cn/"--定义代理服务器的主机名和端口号local proxy_port8000--使用web_utils的download函数下载URLlocal file_pathweb_utils.download(url,proxy_…

HALCON的综合应用案例【01】: 3D 算法处理在 Visual Studio 2019 C# 环境中的集成实例

前言: HALCON 为一款比较流行的商业视觉处理软件,他提供了多种开发的模式,可以在HALCON中开发,也可以将HALCON的设计通过导出库的形式集成到其他开发环境里面,以方便系统集成。本文为笔者自己的一个3D 视觉检测项目,利用HALCON的3D 库开发算法,然后,将算法集成到 MS-V…

力扣每日一题92:反转链表||

题目描述&#xff1a; 给你单链表的头指针 head 和两个整数 left 和 right &#xff0c;其中 left < right 。请你反转从位置 left 到位置 right 的链表节点&#xff0c;返回 反转后的链表 。 示例 1&#xff1a; 输入&#xff1a;head [1,2,3,4,5], left 2, right 4 输…

VS Code 开发Java之代码导航和代码编辑

快速导航 VS Code提供了一些功能可以在Java开发时快速导航。 代码导航 大纲视图&#xff08;Outline view&#xff09;&#xff1a; 方便地导航当前文件中的成员项目视图&#xff08;Projects view&#xff09;&#xff1a; 项目的详细概述Java编辑器&#xff1a; 支持调用层…