页面请求的顺序

首先是客户端发送请求,然后DNS进行解析,给浏览器返回一个IP地址。浏览器根据这个IP地址再进行请求,请求内容是一个HTML或PHP等。
服务器(如APACHE服务员找到请求的HTML或PHP(php还会在服务器进行渲染后生成html),将这个HTML或PHP返回给浏览器)
客户端根据得到的php或html页面再次请求js,css,img等内容。(根据代码执行的顺序,从上到下进行请求)
服务器再次返回请求的内容
浏览器在请求到js或css或图片后会对js或css或图片文件进行解析,最终渲染一个完整的页面

Snipaste_2018-01-30_10-59-01.png

所以我们之所以能在浏览器中看到一个完整的页面,是由一次次请求与一次次响应组成的

http协议就相当高于我们找到工作后所签订的劳动合同,既约束劳动者,也约束用人单位。而http协议即约束Request也约束Response,在这样的规范下两者才能进行正常的交流(如果没有http协议就相当于一个用中文一个用英语很难沟通,所以当然是大家都是用中文才能沟通的好啊,哈哈)

在谷歌的network中,view source就是查看源码的意思,source就是源码的意思

请求行-请求头-请求主

Snipaste_2018-01-30_11-11-14.png

请求头中装的是与浏览器相关的信息,比如上图中的
Accept-Encoding:gizp,deflate,sdch。这个就表示浏览器能识别的编码,因为服务器具有压缩代码的功能(为的是让页面更快的响应),只有浏览器告诉服务器我能识别哪种压缩过的代码,服务器才会进行压缩,否则服务器压缩的代码,浏览器无法解析,那就不能生成页面了。上例中如果没有请求头中没有gzip,那服务器就不会进行响应的压缩。(再比如host就指的是域名)请求中还有请求主体,但是get请求时看不到请求主体的。
post请求中form data就是请求主体(get方式就没有)

Snipaste_2018-01-30_12-26-35.png

正常情况下是不该有Query String Parameters,这部分是Chrome为了我们开发方便给我们添加的东西,所以Chrome的network里面展现的东西是给我们做了一层包装,与真实的http请求是由一些差别的,差别就在这里Query String Parameters。(parameter是参数的意思)

Snipaste_2018-01-30_12-19-23.png
get,post还有一点区别

Snipaste_2018-01-30_12-24-30.png

响应头

请求头是把浏览器的相关信息高速服务器,而相对相应的就是响应头,响应头的作用就是把浏览器的相关信息告诉浏览器。

Snipaste_2018-01-30_11-56-38.png

因为文件的后缀并不能代表文档的真实内容,那怎样区分我们响应的内容到底是什么类型的呢?靠的就是content-type。就比如此处,因为content-type的值是css,所以浏览器就会把响应回来的文件当做css
来解析浏览之所知道是按照css执行还是js执行靠的就是这个content-type图片的content-type与css,js不同因为文件通过网线去走传递的都是字符串,那么信息到了浏览器,浏览器就会犯糊涂,到底是当做css解析还是js解析还是图片解析,还是html去解析靠的就是content-type去区分。

Snipaste_2018-01-30_12-14-24.png
总结:我们网页里面所有的内容都是通过请求和响应来完成的,HTTP协议约束的就是请求和响应,怎么约束呢?通过约定请求中需要什么内容(如请求头里面的各中字段如content-type等),响应中需要什么内容。响应总是相同的结构,但是根据请求的不同,请求三部分中的内容会有差别。
区别1:以post发送请求有请求主体,当我们以get请求发送,没有请求主体。

区别2:当我们以post发送请求,是由content-type的。而我们以get请求发送时没有content-type的。
根据28定则,实际开发中掌握20%的知识就足以应对80%的工程了。事实上掌握以上内容,对付我们工作中的Ajax请求了。
希望这篇文章能够帮到大伙。如果喜欢本文的话可以点赞、关注以表达对我的支持。谢谢。