http GET 和 POST 请求的优缺点和误区 --前端优化

这是一个系列，记录我前端开发常用的代码，小常识，有些是参考网上代码，(讲的可能有点烂，求不要打脸，嘤嘤嘤~~)送给那些需要的人。可以相互交流，喜欢的加我吧。
Wx: Lxp911221

Get和Post在面试中一般都会问到，一般的区别：
（1）post更安全（不会作为url的一部分，不会被缓存、保存在服务器日志、以及浏览器浏览记录中）
（2）post发送的数据更大（get有url长度限制）
（3）post能发送更多的数据类型（get只能发送ASCII字符）
（4）post比get慢
（5）post用于修改和写入数据，get一般用于搜索排序和筛选之类的操作（淘宝，支付宝的搜索查询都是get提交），目的是资源的获取，读取数据
虽然在开发中经常用get或者post请求，但是由于我们资历经验的欠缺，或许就重来没有深究过什么场合用get请求，什么场合用post请求，我相信不止我一个人当看到第4,5条的时候，就会明白为什么面试官对我们的回答不满意，也明白了自己对get或post用法理解的欠缺，那么get比post更快，究竟快多少呢？表现在那些方面？
一、为什么get比post更快
1.post请求包含更多的请求头
因为post需要在请求的body部分包含数据，所以会多了几个数据描述部分的首部字段（如：content-type）,这其实是微乎其微的。

2.最重要的一条，post在真正接收数据之前会先将请求头发送给服务器进行确认，然后才真正发送数据
post请求的过程：
（1）浏览器请求tcp连接（第一次握手）
（2）服务器答应进行tcp连接（第二次握手）
（3）浏览器确认，并发送post请求头（第三次握手，这个报文比较小，所以http会在此时进行第一次数据发送）
（4）服务器返回100 Continue响应
（5）浏览器发送数据
（6）服务器返回200 OK响应
get请求的过程：
（1）浏览器请求tcp连接（第一次握手）
（2）服务器答应进行tcp连接（第二次握手）
（3）浏览器确认，并发送get请求头和数据（第三次握手，这个报文比较小，所以http会在此时进行第一次数据发送）
（4）服务器返回200 OK响应
也就是说，目测get的总耗是post的2/3左右，这个口说无凭，网上已经有网友进行过测试。

3.get会将数据缓存起来，而post不会
可以做个简短的测试，使用ajax采用get方式请求静态数据（比如html页面，图片）的时候，如果两次传输的数据相同，第二次以后消耗的时间将会在10ms以内（chrome测试），而post每次消耗的时间都差不多。经测试，chrome和firefox下如果检测到get请求的是静态资源，则会缓存，如果是数据，则不会缓存，但是IE什么都会缓存起来，当然，应该没有人用post去获取静态数据吧，反正我是没见过。

4.post不能进行管道化传输
http权威指南中是这样说的：http的一次会话需要先建立tcp连接（大部分是tcp，但是其他安全协议也是可以的），然后才能通信，如果每次连接都只进行一次http会话，那这个连接过程占的比例太大了！于是出现了持久连接：在http/1.0+中是connection首部中添加keep-alive值，在http/1.1中是在connection首部中添加persistent值，当然两者不仅仅是命名上的差别，http/1.1中，持久连接是默认的，除非显示在connection中添加close，否则持久连接不会关闭，而http/1.0+中则恰好相反，除非显示在connection首部中添加keep-alive，否则在接收数据包后连接就断开了。
出现了持久连接还不够，在http/1.1中，还有一种称为管道通信的方式进行速度优化：把需要发送到服务器上的所有请求放到输出队列中，在第一个请求发送出去后，不等到收到服务器的应答，第二个请求紧接着就发送出去，但是这样的方式有一个问题：不安全，如果一个管道中有10个连接，在发送出9个后，突然服务器告诉你，连接关闭了，此时客户端即使收到了前9个请求的答复，也会将这9个请求的内容清空，也就是说，白忙活了……此时，客户端的这9个请求需要重新发送。这对于幂等请求还好（比如get，多发送几次都没关系，每次都是相同的结果），如果是post这样的非幂等请求（比如支付的时候，多发送几次就惨了），肯定是行不通的。
所以，post请求不能通过管道的方式进行通信！很有可能，post请求需要重新建立连接，这个过程不跟完全没优化的时候一样了么？所以，在可以使用get请求通信的时候，不要使用post请求，这样用户体验会更好，当然，如果有安全性要求的话，post会更好。管道化传输在浏览器端的实现还需考证，貌似默认情况下大部分浏览器（除了opera）是不进行管道化传输的，除非手动开启！
二、get传参最大长度的理解误区
1.总结
（1）http协议并未规定get和post的长度限制
（2）get的最大长度限制是因为浏览器和web服务器限制了URL的长度
（3）不同的浏览器和web服务器，限制的最大长度不一样
（4）要支持IE，则最大长度为2083byte，若支持Chrome，则最大长度8182byte

2.误解
（1）首先即使get有长度限制，也是限制的整个URL的长度，而不仅仅是参数值数据长度，http协议从未规定get/post的请求长度限制是多少
（2）所谓的请求长度限制是由浏览器和web服务器决定和设置的，各种浏览器和web服务器的设定均不一样，这依赖于各个浏览器厂家的规定或者可以根据web服务器的处理能力来设定。IE 和 Safari 浏览器限制 2k，Opera 限制4k，Firefox 限制 8k（非常老的版本 256byte），如果超出了最大长度，大部分的服务器直接截断，也有一些服务器会报414错误。

3.各个浏览器和web服务器的最大长度总结
浏览器
（1）IE：IE浏览器（Microsoft Internet Explorer）对url长度限制是2083（2K+53），超过这个限制，则自动截断（若是form提交则提交按钮不起作用）。
（2）firefox：firefox（火狐浏览器）的url长度限制为 65536字符，但实际上有效的URL最大长度不少于100,000个字符。
（3）chrome：chrome（谷歌）的url长度限制超过8182个字符返回本文开头时列出的错误。
（4）Safari：Safari的url长度限制至少为 80 000 字符。
（5）Opera：Opera 浏览器的url长度限制为190 000 字符。Opera9 地址栏中输入190000字符时依然能正常编辑。
服务器
（1）Apache：Apache能接受url长度限制为8 192 字符
（2）IIS：Microsoft Internet Information Server(IIS)能接受url长度限制为16384个字符。这个是可以通过修改的（IIS7）
configuration/system.webServer/security/requestFiltering/requestLimits@maxQueryStringsetting.

http GET 和 POST 请求的优缺点和误区 --前端优化相关推荐

请求时才延迟加载JavaScript文件 - 优化篇
技术关键词 · 收集: 阻塞浏览器.并行下载.竞态条件.关联函数(关联JavaScript代码).非阻塞请求.动态创建<script>标签.异步下载.延时加载代码实例: 下面我们先看一段 ...
[前端优化]使用Combres合并对js、css文件的请求
在前端优化的各种金律铁规中,"减少客户端对资源的请求"都会在其中出现,刚好最近对网站做一些优化,使用了一下Combres组件,有点心得,遂整理成文. 园子中也有几篇Combres组 ...
高并发大流量专题---3、前端优化（减少HTTP请求次数）
高并发大流量专题---3.前端优化(减少HTTP请求次数) 一.总结一句话总结: 图片地图:使用<map><area></area></map>标签. ...
ajax请求的优缺点
ajax的概念: 相当于在客户端与服务端之间加了一个抽象层(Ajax引擎),使用户请求和服务器响应异步化,并不是所有的请求都提交给服务器,像一些数据验证和数据处理都交给Ajax引擎来完成,只有确认需 ...
什么是ajax，ajax请求的优缺点
什么是ajax官方介绍: Ajax即Asynchronous Javascript And XML(异步JavaScript和XML)在 2005年被Jesse James Garrett提出的新术语 ...
ajax jq 图片上传请求头_全面分析前端的网络请求方式:Ajax ,jQuery ,axios,fetch
链接:https://juejin.im/post/5c9ac607f265da6103588b31 一.前端进行网络请求的关注点大多数情况下,在前端发起一个网络请求我们只需关注下面几点: 传入基本 ...
ajax请求后台报没有body_前端常见面试 - 请求篇
对于前端来说,请求是前端日常工作必备的,通过请求才能与后端进行数据交互,尤其在现在前后端分离的开发模式下,请求显得就更加重要.因此,对于前端开发者来说,掌握请求就很重要.下面将从 http 请求和常见 ...
前端优化中使用base64的优缺点
优点 (1)base64格式的图片是文本格式,占用内存小,转换后的大小比例大概为1/3,降低了资源服务器的消耗: (2)网页中使用base64格式的图片时,不用再请求服务器调用图片资源,减少了服务器访 ...
vue 一个页面有点请求需要同时发送_前端性能优化，这些你都需要知道
来源: 海洋里的魔鬼鱼前言最近花了一些时间在项目的性能优化上,背后做了很多工作,但是最后依然没有达到自己想要的结果,有些失望,但是还是记录下自己的执着. 性能优化总结:减少请求次数.减小资源大小. ...

http GET 和 POST 请求的优缺点和误区 --前端优化

http GET 和 POST 请求的优缺点和误区 --前端优化相关推荐

最新文章

热门文章