通过HTTP发送大量数据的三种方法

news2024/11/24 12:46:10

在网络的早期时期,人们发送的文件大小仅为几KB。到了2023年,我们享受着高分辨率的MB级别图像,并在几GB的4K(即将是8K)视频中观看。

即使有良好的互联网连接,下载一个5GB的文件仍然需要一些时间。如果你拥有Xbox或PlayStation,你就知道这种感觉。

我们有三种方法可以通过HTTP缩短发送大量数据的时间:

•压缩数据•发送分块数据•请求选择范围内的数据

它们并不是互斥的。你可以根据用例一起使用所有方法。

压缩数据

6a486ecddfe15e86e9d18fe1e5b873ec.png
1*_un0bHBemgCSDocQmucK5Q.png

要压缩数据,我们需要压缩算法。

在发送请求时,浏览器会包含一个名为Accept-Encoding的头,其中包含支持的压缩算法列表,包括gzip(GZIP)、compressdeflatebr(Brotli)。

接下来,服务器从列表中选择其支持的算法,并在Content-Encoding头中设置算法名称。

当浏览器接收到响应时,它知道如何解析正文中的数据。

在这些算法中,最流行的是GZIP。它是压缩文本数据(如HTML、CSS和JavaScript)的绝佳选择。

Brotli是另一个值得一提的算法。它在压缩HTML方面的性能甚至比GZIP更好。

这些高效的算法有一些限制。

它们对文本的压缩效果很好,但对于压缩图像或视频来说则不足够。毕竟,媒体已经过了优化。

试着在你的计算机上压缩一个视频文件。在压缩之前和之后,你几乎看不到太大的区别。

此外,几乎不可能将一个5GB的视频压缩到几KB而不损失质量。

压缩是好的,但我们需要一个更好的解决方案——将文件分块发送并在客户端组装部分数据。

发送分块数据

8036884c4dbe0d46c996988822dacdfb.png
1*0WLNkzfgw9faLpTUXkk3tg.png

在版本1.1中,HTTP引入了分块数据以处理大数据情况。

在发送响应时,服务器添加一个头Transfer-Encoding: chunked,让浏览器知道数据是分块传输的。

84540c369b0990047812f95fe407abd7.png
1*Nwlp0QqhEsvWl4fw-x0X7Q.png

每个分块数据都有以下组件:

•一个长度块标记,标记当前分块数据的长度•分块数据块•在每个块的末尾的CRLF分隔符

想知道CRLF是什么吗?

6dc331d96af6fa9cefd07fbd86361a80.png
1*s_-5lmT9176ymCAaaGCE2w.png

CR紧接着LF(CRLF,\r\n,或0x0D0A)将光标移动到下一行,然后移到行的开头。 在本文末尾的进一步阅读部分,你可以找到更多详细信息。在这里,你可以简单地将其视为一个分隔符。

服务器继续向浏览器流式传输分块数据。当达到数据流的末尾时,它附加一个包含以下部分的结束标记:

•一个长度块,数字为0,末尾为CRLF•一个额外的CRLF

在浏览器端,它等待所有数据块,直到达到结束标记。然后,它移除分块编码,包括CRLF和长度信息。

接下来,它将分块数据组合成一个整体。因此,在Chrome DevTools上,你只能看到组装后的数据,而不是分块数据。

最终,你会收到整个数据的一块。

9b9f2b1761e40c8dc70c9b6f7a01c513.png
1*oChWIlysG3PQD3vy8ctVxw.png

分块数据是有用的。然而,对于一个5GB的视频,完整的数据仍然需要一些时间才能到达。

我们能不能获取数据的选定块,并在需要时请求其他块呢?

HTTP说可以。

在选定范围内请求数据

bd7c7d39a970ba408464758288c318f9.png
1*LOGONes_KpmSN6zXaz9DhA.png

在YouTube上打开一个视频,你会看到一个灰色的进度条正在向前移动。

你刚刚看到的是YouTube在请求选定范围内的数据。

此功能使你可以在时间轴的任何地方跳跃。当点击进度条上的某个位置时,浏览器会请求视频数据的特定范围。

在服务器上实现范围请求是可选的。如果实现了,你可以在响应头中看到Accept-Ranges: bytes

d40f8444aa1eb9279fdbba12f3a93700.png
1*MWd4AGP8lLRIQw5mketXew.png

这是一个YouTube请求的示例。在任何“playback”请求中,你都可以找到这个头。

范围请求头看起来像`Range:

bytes=0-80`,它是从0开始的索引。

这个头是一个设计非常巧妙且具有出色灵活性的头。

假设一个数据总共有100个字节。

Range: bytes=20请求从20开始到末尾的范围,等于Range: bytes=20-99。•Range: bytes=-20请求数据的最后20个字节,等于Range: bytes=80-99

如果请求的范围有效,服务器将发送带有Content-Range头的响应,验证数据范围和总长度,例如Content-Range: bytes 70-80/100

范围请求广泛用于视频流媒体和文件下载服务。

你有没有在互联网中断后继续文件下载?那就是范围请求。

此外,范围请求支持多个范围。

例如,你可以从文件中请求两个范围,如Range: bytes=20-45, 70-80

多范围体看起来类似于分块数据。每个数据块都有以下部分:

•一个边界块,标识不同数据块的边界,以--开始,以CRLF结束•两个头,Content-TypeContent-Range,显示相应数据块的属性,以CRLF结束•一个额外的CRLF,告诉客户端真正的数据即将到来•最后,以CRLF结束的数据块

边界仅仅是一个看起来像3d6b6a416f9b5的随机字符串,标记不同数据块的边界。

最终,体结束于边界块,以--开始,以--和CRLF结束。这个部分告诉浏览器多部分已经结束。

让我们把它全部整合起来。响应体的结构如下所示。

401b41c4b1f659e8fabc46ccd011db3f.png
 

总结

HTTP帮助我们通过压缩、分块数据和范围数据传送大量数据。

这里的思想是在需要的时候传送我们需要的数据,然后在需要时发送其他数据。当在设计类似系统时遇到问题时,你可以尝试相同的思路。

通过结合这三种方法,我们可以发送压缩的分块数据范围数据。

关注收获更多精彩哦~

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

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

相关文章

Photoshop 2024正式发布!内置最新PS AI,创意填充等功能无限制使用!

PS正式版目前更新到了2024,版本为25.0。 安装教程 1、下载得到安装包后,先解压。鼠标右键,【解压到当前文件夹】 2、双击 Set-up 开始安装 3、这里可以更改安装位置。如果C盘空间不够大,可以把它安装到C盘以外。更改好后&#x…

SpringBoot面试题3:Spring Boot 的核心注解是哪个?它主要由哪几个注解组成的?

该文章专注于面试,面试只要回答关键点即可,不需要对框架有非常深入的回答,如果你想应付面试,是足够了,抓住关键点 面试官:Spring Boot 的核心注解是哪个?它主要由哪几个注解组成的? Spring Boot 的核心注解是 @SpringBootApplication。 @SpringBootApplication 是一…

【idea】 java: 找不到符号

idea 启动时提示 java: 找不到符号 java: 找不到符号 符号: 方法 getCompanyDisputeCount() 位置: 类型为com.yang.entity.AreaAnalyse的变量 areaAnalyse 在setting ——> Compiler ——>Shared build process VM options: 添加: -Djps.track.ap.dep…

Vue3<script setup>语法糖下,实现父子组件通信以及数据监听的三种方法。

在Vue3的script setup语法糖中,没有办法通过Vue2的ref、props、parent、中央时间总线等等众多方法,通过this指针简单的实现父子组件的通信,网络上也很少有关于script setup语法糖的相关教程,所以决定自己写一个详细教程&#xff0…

【算法|动态规划No.19】leetcode413. 等差数列划分

个人主页:兜里有颗棉花糖 欢迎 点赞👍 收藏✨ 留言✉ 加关注💓本文由 兜里有颗棉花糖 原创 收录于专栏【手撕算法系列专栏】【LeetCode】 🍔本专栏旨在提高自己算法能力的同时,记录一下自己的学习过程,希望…

JAVA反序列化漏洞

JAVA反序列化漏洞 原文资料:xiu–》xiu博客 文章目录 JAVA反序列化漏洞idea类继承反序列化漏洞person类Test类 什么是反序列化漏洞 idea 类继承 public class Person {public int age;public String name;public void talk(){System.out.println("Person 说话…

RK3588 USB WIFI调试

一.安卓wifi框架 要使用一个wifi功能需要涉及的部分有内核部分wifi驱动,应用部分wpa_supplicant服务。其中wifi驱动又包含很多部分,分为通讯接口的驱动SDIO、USB、PCIE等,还有上下电部分的驱动,wifi模组提供部分的驱动。应用部分不…

random生成随机数的灵活运用

random返回的 [0,1) 之间的一个随即小数 思考:请写出获取 a-b 之间的一个随机整数,a,b均为整数,比如 a2 , b7 即返回一个数 x > [2,7]Math.random()*(b-a) 返回的就是 [0,b-a](int)(aMath.random()*(b-a1)) 》 (int)(2Math.random()*6) Ma…

常用傅里叶变换表

傅里叶展开 傅里叶变换 傅里叶逆变换 时域信号 弧频域信号 线性变换 时域平移 频域平移 伸缩变换 微分性质 逆变换的微分性质 卷积定理 原函数变换结果 单位阶跃函数: 符号函数: 矩形函数: 辛格函数:

系统架构师备考倒计时22天(每日知识点)

测试阶段划分 单元测试:依据详细设计,模块测试,模块功能、性能、接口等集成测试:依据概要设计,模块间的接口系统测试:依据需求文档,在真实环境下,验证完整的软件配置项能否和系统正…

了解变分自动编码器 (VAE)

一、介绍 在过去的几年中,由于(并暗示)该领域取得了一些惊人的进步,基于深度学习的生成模型引起了越来越多的兴趣。依靠大量的数据、精心设计的网络架构和智能训练技术,深度生成模型表现出了令人难以置信的能力&#x…

Active Session History (ASH) 读书笔记

本文为博文Active Session History (ASH)的读书笔记。 AWR,ADDM,SQL Trace是对过去事件的分析,[G]V$视图包含大量实时信息,但使用界面不友好,对初学者较难。因此Oracle 10g推出了ASH,属于Oracle Diagnosti…

Linux网络编程系列之UDP广播

一、什么是UDP广播 UDP广播是一种网络通信的方式,在广域网或局域网中,UDP广播可以向多个目标主机发送数据包,使得网络中的所有设备都能接收到广播消息。一定是采用UDP协议。 二、特性 1、面向无连接:UDP广播不需要建立连接&#…

PLC易学但是后期如何发展?

今日话题 PLC易学但是后期如何发展? PLC学习简便,但重要性不容小觑。除基础外,以下为几个技术方向: 大规模系统:包括冗余PLC、网络架构和服务器。掌握虚拟化、网络设计和模块化。 特色系统:如电力行业…

FastAdmin前台分片传输上传文件getshell

漏洞概述 FastAdmin框架存在有条件RCE漏洞,由于FastAdmin的前台文件上传功能中提供了分片传输功能, 但在合并分片文件时因对文件路径的拼接处理不当导致可上传任意文件。 漏洞复现 漏洞需要一个低权限的账号 所以我们需要在前台注册一个普通用户 注册成功后进行…

1. 树的建立与基本操作

程序的输入是一个表示树结构的广义表。假设树的根为 root ,其子树森林 F = ( T1 , T2 , … , Tn ),设与该树对应的广义表为 L ,则 L =(原子&#…

TLS/SSL 详解

目录 基础理论入门HTTPS对称加密非对称加密证书TLS握手过程握手总结 TLS 定义(记录层/握手层)HTTPS HTTP over TLS加密记录层分片 (Fragmentation)记录压缩和解压缩 (Record compression and decompression)空或标准流加密 (Null or standard stream cipher)CBC 块加密 (分组加…

NV21图片格式深入解析与代码实战-RGB转NV21与画框

1.NV21格式图片解析 NV21图像格式属于 YUV颜色空间中的YUV420SP格式 每四个Y分量共用一组U分量和V分量,Y连续排序,U与V交叉排序 重点总结 uv交错模式4Y共用一组uv(2个)大小:UV Y 的一半 排列方式如下 Y Y   Y Y   Y Y   Y Y Y Y   Y Y…

001数据安全传输-多端协议传输平台:Openssl安装和配置 - EVP代码测试

001数据安全传输-多端协议传输平台:Openssl安装和配置 - EVP代码测试 文章目录 001数据安全传输-多端协议传输平台:Openssl安装和配置 - EVP代码测试1. 安装1.1 windows下安装openssl1.2 Linux下安装OpenSSL 2. VS中使用openssl3. 测试 1. 安装 1.1 win…

ionic+vue+capacitor系列笔记--常用操作代码合集(图片引用,axios跨域配置,去除按钮波纹)

1.单个图片引用 html <img :src"userImgSrc" />ts <script lang"ts"> import { defineComponent } from "vue"; export default defineComponent({name: "Tab1Page",components: {},setup(props, context) {let url &…