Js的长轮询[通俗易懂]

Js的长轮询[通俗易懂]长轮询是与服务器保持持久连接的最简单的方式,它不使用任何特定的协议,例如WebSocket或者ServerSentEvent。它很容易实现,在很多场景下也很好用。

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

长轮询(Long polling)

长轮询是与服务器保持持久连接的最简单的方式,它不使用任何特定的协议,例如 WebSocket 或者 Server Sent Event。

它很容易实现,在很多场景下也很好用。


常规轮询

从服务器获取新信息的最简单的方式是定期轮询。也就是说,定期向服务器发出请求:“你好,我在这儿,你有关于我的任何信息吗?”例如,每 10 秒一次。

作为响应,服务器首先通知自己,客户端处于在线状态,然后 —— 发送目前为止的消息包。

这可行,但是也有些缺点:

  1. 消息传递的延迟最多为 10 秒(两个请求之间)。
  2. 即使没有消息,服务器也会每隔 10 秒被请求轰炸一次,即使用户切换到其他地方或者处于休眠状态,也是如此。就性能而言,这是一个很大的负担。

因此,如果我们讨论的是一个非常小的服务,那么这种方式可能可行,但总的来说,它需要改进。


长轮询

所谓“长轮询”是轮询服务器的一种更好的方式。

它也很容易实现,并且可以无延迟地传递消息。

其流程为:

  1. 请求发送到服务器。
  2. 服务器在有消息之前不会关闭连接。
  3. 当消息出现时 —— 服务器将对其请求作出响应。
  4. 浏览器立即发出一个新的请求。

对于此方法,浏览器发出一个请求并与服务器之间建立起一个挂起的(pending)连接的情况是标准的。仅在有消息被传递时,才会重新建立连接。

1640242367(1).png
如果连接丢失,可能是因为网络错误,浏览器会立即发送一个新请求。

实现长轮询的客户端 subscribe 函数的示例代码:

async function subscribe() {
  let response = await fetch("/subscribe");

  if (response.status == 502) {
    // 状态 502 是连接超时错误,
    // 连接挂起时间过长时可能会发生,
    // 远程服务器或代理会关闭它
    // 让我们重新连接
    await subscribe();
  } else if (response.status != 200) {
    // 一个 error —— 让我们显示它
    showMessage(response.statusText);
    // 一秒后重新连接
    await new Promise(resolve => setTimeout(resolve, 1000));
    await subscribe();
  } else {
    // 获取并显示消息
    let message = await response.text();
    showMessage(message);
    // 再次调用 subscribe() 以获取下一条消息
    await subscribe();
  }
}

subscribe();

正如你所看到的,subscribe 函数发起了一个 fetch,然后等待响应,处理它,并再次调用自身。

服务器应该可以处理许多挂起的连接

服务器架构必须能够处理许多挂起的连接。

某些服务器架构是每个连接对应一个进程,导致进程数和连接数一样多,而每个进程都会消耗相当多的内存。因此,过多的连接会消耗掉全部内存。

使用像 PHP 和 Ruby 语言编写的后端程序会经常遇到这个问题。

使用 Node.js 编写的服务端程序通常不会出现此类问题。

也就是说,这不是编程语言的问题。大多数现代编程语言,包括 PHP 和 Ruby,都允许实现更适当的后端程序。只是请确保你的服务器架构在同时有很多连接的情况下能够正常工作。


使用场景

在消息很少的情况下,长轮询很有效。

如果消息比较频繁,那么上面描绘的请求-接收(requesting-receiving)消息的图表就会变成锯状状(saw-like)。

每个消息都是一个单独的请求,并带有 header,身份验证开销(authentication overhead)等。

因此,在这种情况下,首选另一种方法,例如:Websocket或 Server Sent Events


转载详情:

转载网站: Javascript.info

转载地址:https://zh.javascript.info/long-polling

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/181843.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 云服务器续费太贵,直接在家搭一台,再也不受约束了

    云服务器续费太贵,直接在家搭一台,再也不受约束了杀熟,劳神伤财,废旧利用,性能对比,费用,灵活性,优化,缺点,开机吧,少年,局域网访问,外网访问最终迁移

    2022年5月3日
    51
  • ctk加载插件「建议收藏」

    ctk加载插件「建议收藏」用ctk加载插件有两种方法,第一种需要自己创建ctkPluginFramework://ctkpluginctkPluginFrameworkFactory*ctkFrameWorkFactory=newctkPluginFrameworkFactory;QSharedPointerframework=ctkFrameWorkFactory->getFram

    2022年6月6日
    34
  • staruml使用方法(对讲机按键使用说明)

    综述StarUML是一种生成类图和其他类型的统一建模语言(UML)图表的工具。这是一个用Java语言描述的创建类图的简明手册。StarUML(简称SU),是一种创建UML类图,并能够自动生成Java的“stubcode”的工具。SU也可以做JAVA逆向工程,以产生相应的UML图表。在本教程中,我们将使用SU设计一个pizza饼。执行下列步骤,可以创建如下面所示的UML图。SU可以生…

    2022年4月12日
    73
  • Python+opencv调用摄像头获取视频保存到本地并应用到YOLO中保存视频检测后的结果

    Python+opencv调用摄像头获取视频保存到本地并应用到YOLO中保存视频检测后的结果文章目录前言读写视频流获取摄像头:写入视频:完整的调用摄像头并保存视频代码应用到YOLO中总结前言之前的文章介绍了如何调用摄像头间隔拍照并保存图片(文章链接:Python+OpenCV调用摄像头固定间隔时间拍照并保存到本地同时应用到YOLO中检测目标),这篇文章再介绍一下如何调用摄像头并保存视频。读写视频流获取摄像头:capture=cv2.VideoCapture(0)ref,frame=capture.read()前文介绍过,cv2.VideoCapture()获取摄像头

    2022年6月22日
    30
  • 弱电机房空调设计规范要求_弱电机房施工规范国家标准

    弱电机房空调设计规范要求_弱电机房施工规范国家标准原标题:弱电机房设计内容规范大全云计算和虚拟化等新技术的出现,使得数据中心演变成一个迥然不同的环境。数据中心机房的地位也是越来越高,那么我们应该如何对弱电机房进行设计呢?这其中有许多的规范需要我们来遵守,下面为大家详细的进行罗列。GB50174—2017《数据中心设计规范》GB/T2887—2000《电子计算机场地通用规范》GB9361—88《计算机站场地安全要求》GB50057—94《建筑物防雷…

    2022年9月27日
    4
  • response中如何设置contentType

    response中如何设置contentTypeajax开发中,常遇到下面的几种情况:1服务端需要返回一段普通文本给客户端2服务端需要返回一段HTML代码给客户端3服务端需要返回一段XML代码给客户端4服务端需要返回一段javascript代码给客户端5服务端需要返回一段json串给客户端================================对于每一种返回类型规范的做法是要在服务端…

    2022年7月19日
    134

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号