HTTP协议 (三) 压缩
之前写过一个篇 【HTTP协议详解】 ,这次继续介绍HTTP协议中的压缩。
本文会使用Fiddler来查看HTTP request和Response, 如果不熟悉这个工具,可以先参考[Fiddler教程]
HTTP压缩是指: Web服务器和浏览器之间压缩传输的”文本内容“的方法。 HTTP采用通用的压缩算法,比如gzip来压缩HTML,Javascript, CSS文件。 能大大减少网络传输的数据量,提高了用户显示网页的速度。当然,同时会增加一点点服务器的开销。 本文从HTTP协议的角度,来理解HTTP压缩这个概念。
阅读目录
- HTTP内容编码和HTTP压缩的区别
- HTTP压缩的过程
- 实例:用Fiddler观察HTTP压缩
- 内容编码类型
- 压缩的好处
- gzip的缺点
- gzip是如何压缩的
- HTTP Response能压缩,HTTP Request也是可以压缩的
HTTP内容编码和HTTP压缩的区别
HTTP压缩,在HTTP协议中,其实是内容编码的一种。
在http协议中,可以对内容(也就是body部分)进行编码, 可以采用gzip这样的编码。 从而达到压缩的目的。 也可以使用其他的编码把内容搅乱或加密,以此来防止未授权的第三方看到文档的内容。
所以我们说HTTP压缩,其实就是HTTP内容编码的一种。 所以大家不要把HTTP压缩和HTTP内容编码两个概念混淆了。
HTTP压缩的过程
1. 浏览器发送Http request 给Web服务器, request 中有Accept-Encoding: gzip, deflate。 (告诉服务器, 浏览器支持gzip压缩)
2. Web服务器接到request后, 生成原始的Response, 其中有原始的Content-Type和Content-Length。
3. Web服务器通过Gzip,来对Response进行编码, 编码后header中有Content-Type和Content-Length(压缩后的大小), 并且增加了Content-Encoding:gzip. 然后把Response发送给浏览器。
4. 浏览器接到Response后,根据Content-Encoding:gzip来对Response 进行解码。 获取到原始response后, 然后显示出网页。
如下图:

实例:Fiddler观察HTTP压缩
眼见为实, 我们看一个实际的例子, 我发现博客园就使用了gzip压缩。
使用Fiddler可以清楚地看到。


在Fiddler中,每次都要手动去decode. 太麻烦。 点击工具栏上的"Decode"按钮,就可以自动decode了。
内容编码类型
HTTP定义了一些标准的内容编码类型,并允许用扩展的形式添加更多的编码。
Content-Encoding header 就用这些标准化的代号来说明编码时使用的算法
Content-Encoding值
gzip 表明实体采用GNU zip编码
compress 表明实体采用Unix的文件压缩程序
deflate 表明实体是用zlib的格式压缩的
identity 表明没有对实体进行编码。当没有Content-Encoding header时, 就默认为这种情况
gzip, compress, 以及deflate编码都是无损压缩算法,用于减少传输报文的大小,不会导致信息损失。 其中gzip通常效率最高, 使用最为广泛。
压缩的好处
http压缩对纯文本可以压缩至原内容的40%, 从而节省了60%的数据传输。
实例: 博客园首页压缩前是:46124 bytes. 压缩后是:16368bytes. 只有原先的35%。 节省了65%的数据传输,从而大大提高了性能
有图为证。


Gzip的缺点
JPEG这类文件用gzip压缩的不够好。
Gzip是如何压缩的
简单来说, Gzip压缩是在一个文本文件中找出类似的字符串, 并临时替换他们,使整个文件变小。这种形式的压缩对Web来说非常适合, 因为HTML和CSS文件通常包含大量的重复的字符串,例如空格,标签。
HTTP Response能压缩,HTTP Request也是可以压缩的
浏览器是不会对Request压缩的。 但是 一些HTTP程序在发送Request时,会对其进行编码。 如下图。

HTTP协议 (三) 压缩的更多相关文章
- TCP/IP协议三次握手与四次握手流程解析
原文链接地址:http://www.2cto.com/net/201310/251896.html TCP/IP协议三次握手与四次握手流程解析 TCP/IP协议的详细信息参看<TCP/IP协议详 ...
- TCP/IP协议三次握手与四次握手流程解析(转载及总结)
原文地址:http://www.2cto.com/net/201310/251896.html,转载请注明出处: TCP/IP协议三次握手与四次握手流程解析 一.TCP报文格式 TCP/IP协议的详 ...
- TCP协议三次握手
TCP协议三次握手过程分析 TCP(Transmission Control Protocol) 传输控制协议 TCP是主机对主机层的传输控制协议,提供可靠的连接服务,采用三次握手确认建立一个连接: ...
- TCP协议三次握手与四次挥手通俗解析
TCP/IP协议三次握手与四次握手流程解析 一.TCP报文格式 TCP/IP协议的详细信息参看<TCP/IP协议详解>三卷本.下面是TCP报文格式图: 图1 TCP报文格式 上图中有几个字 ...
- TCP/IP协议三次握手与四次握手
TCP/IP协议三次握手与四次握手流程解析 一.TCP报文格式 TCP/IP协议的详细信息参看<TCP/IP协议详解>三卷本.下面是TCP报文格式图:图1 TCP报文格式 上图中有几个 ...
- TCP/IP协议三次握手和四次挥手大白话解说
前言 昨天晚上被一位师傅问到了TCP/IP的工作机制,心里很清楚三次握手,然而对于四次挥手却忘了,这是大学习里学过的,奋而翻阅书籍和网络对之前所学的做一个温顾,算是夯实自我吧. TCP(Transmi ...
- Http协议三次握手过程
Http协议三次握手过程 TCP(Transmission Control Protocol) 传输控制协议 TCP是主机对主机层的传输控制协议,提供可靠的连接服务,采用三次握手确认建立一个连接: ...
- Python进阶----网络通信基础 ,OSI七层协议() ,UDP和TCP的区别 , TCP/IP协议(三次握手,四次挥手)
Python进阶----网络通信基础 ,OSI七层协议() ,UDP和TCP的区别 , TCP/IP协议(三次握手,四次挥手) 一丶CS/BS 架构 C/S: 客户端/服务器 定义: ...
- 白话解说TCP/IP协议三次握手和四次挥手
白话解说TCP/IP协议三次握手和四次挥手 1.背景 和女朋友异地恋一年多,为了保持感情我提议每天晚上视频聊天一次. 从好上开始,到现在,一年多也算坚持下来了. 1.1.问题 有时候聊天的过程中,我的 ...
随机推荐
- Ubuntu安装node
#!/bin/bash echo "添加环境变量需要root权限,如无root权限,则不添加环境变量" echo "输入Node下载地址(目前仅支持Node官方网站上Li ...
- AndroidManifest.xml file missing!
1.点击菜单栏中的Project——>Clean一下. 2.把AndroidManifest.xml文件再保存一下就可以了.
- 聊聊css hack
什么是CSS hack CSS hack由于不同厂商的浏览器,比如Internet Explorer,Safari,Mozilla Firefox,Chrome等,或者是同一厂商的浏览器的不同版本,如 ...
- Android中日期函数Calendar的一些用法和注意事项
1.月份获取时加1 Canlendar.MONTH + 1 因为使用的是罗马历,Calendar.MONTH返回的数值不是一年中月份的值,而是当前月份距离第一个月份的差值 如:当前月份为9月份,距离1 ...
- JQuery随笔
web请求中,外部样式文件的加载不影响页面,js的加载会影响页面的加载速度 window.onlond 页面所有元素加载完后执行包含js,css等加载完毕 $(function(){}) 页面中DOM ...
- 查找“asdfjvjadsffvaadfkfasaffdsasdffadsafafsafdadsfaafd” 该字符串中有多少个af
package lovo.bean; import java.util.Scanner; public class Java { @param args public static void main ...
- React Native 组件样式测试
View组件默认样式(注意默认flexDirection:'column') {flexGrow:0,flexShrink:0,flexBasis:'auto',flexDirection:'colu ...
- React之Froms
In React, a <textarea> uses a value attribute instead. This way, a form using a <textarea&g ...
- 字符编码和python .encode().decode()方法
字符编码与encode.decode的问题: 用8个开关表示世界万物 ASCII : American Standard Code for Information Interchange,美国 ...
- as3 中文转拼音
private static const PinYin:Object = {"a":"\u554a\u963f\u9515","ai":&q ...