11# 3.1 Web工作方式
22
3- 我们平时浏览网页的时候,打开浏览器,输入网址,按下回车键,然后就出来了内容。在这个看似简单的行为背后 ,到底隐藏了些什么呢?
3+ 我们平时浏览网页的时候,会打开浏览器,输入网址后按下回车键,然后就会显示出你想要浏览的内容。在这个看似简单的用户行为背后 ,到底隐藏了些什么呢?
44
5- 上面这个普通的浏览过程,底层其实是这样做的:浏览器是一个客户端 ,当你输入URL的时候,首先浏览器会去请求DNS服务器,通过DNS获取相应的域名对应的IP,然后通过IP和服务器建立socket连接,发送http请求信息,服务器接收到请求信息之后,处理相应的请求,返回http response信息,客户端接收到http信息之后开始渲染这些http response里面的content信息,断开和服务器的socket链接 。
5+ 对于普通的上网过程,系统其实是这样做的:浏览器本身是一个客户端 ,当你输入URL的时候,首先浏览器会去请求DNS服务器,通过DNS获取相应的域名对应的IP,然后通过IP地址找到IP对应的服务器后,要求建立TCP连接,等浏览器发送完HTTP Request(请求)包后,服务器接收到请求包之后才开始处理请求包,服务器调用自身服务,返回HTTP Response(响应)包;客户端收到来自服务器的响应后开始渲染这个Response包里的主体(body),等收到全部的内容随后断开与该服务器之间的TCP连接 。
66
77![ ] ( images/3.1.web2.png?raw=true )
88
9- 一个Web服务器也被称为HTTP服务器,它通过HTTP协议与客户端通信。这个客户端通常指的是Web浏览器(手机端客户端其实内部也是浏览器实现 )。
9+ 一个Web服务器也被称为HTTP服务器,它通过HTTP协议与客户端通信。这个客户端通常指的是Web浏览器(其实手机端客户端内部也是浏览器实现的 )。
1010
11- Web服务器的工作原理简单的可以归纳为 :
11+ Web服务器的工作原理可以简单地归纳为 :
1212
13- - 客户机通过socket建立到服务器的连接
14- - 客户端向服务器发送请求,http协议包,请求转化成服务器对应的文档
15- - 服务器向客户机发送应答,http协议包,请求的如果包含有动态语言的部分,那么动态语言把相应的数据结果返回给客户端
16- - 客户机与服务器断开。客户端解释HTML文档,在客户端屏幕上显示结果
13+ - 客户机通过TCP/IP协议建立到服务器的TCP连接
14+ - 客户端向服务器发送HTTP协议请求包,请求服务器里的资源文档
15+ - 服务器向客户机发送HTTP协议应答包,如果请求的资源包含有动态语言的内容,那么服务器会调用动态语言的解释引擎负责处理“动态内容”,并将处理得到的数据返回给客户端
16+ - 客户机与服务器断开。由客户端解释HTML文档,在客户端屏幕上渲染图形结果
1717
18- 一个简单的事务处理事件就是这样实现的 ,看起来很复杂,做起来其实是挺简单的,需要注意的是客户机与服务器之间的通信是非连接的 ,也就是当服务器发送了应答后就与客户机断开连接,等待下一次请求。
18+ 一个简单的HTTP事务就是这样实现的 ,看起来很复杂,原理其实是挺简单的。需要注意的是客户机与服务器之间的通信是非持久连接的 ,也就是当服务器发送了应答后就与客户机断开连接,等待下一次请求。
1919
2020## URL和DNS解析
2121我们浏览网页都是通过URL访问的,那么URL到底是怎么样的呢?
@@ -62,61 +62,59 @@ HTTP协议是Web工作的核心,所以要了解清楚Web的工作方式就需
6262
6363HTTP是一种让Web服务器与浏览器(客户端)通过Internet发送与接收数据的协议,它建立在TCP协议之上,一般采用TCP的80端口。它是一个请求、响应协议--客户端发出一个请求,服务器响应这个请求。在HTTP中,客户端总是通过建立一个连接与发送一个HTTP请求来发起一个事务。服务器不能主动去与客户端联系,也不能给客户端发出一个回调连接。客户端与服务器端都可以提前中断一个连接。例如,当浏览器下载一个文件时,你可以通过点击“停止”键来中断文件的下载,关闭与服务器的HTTP连接。
6464
65- HTTP协议是无状态的,同一个客户端的这次请求和上次请求是没有对应关系,对HTTP服务器来说,它并不知道这两个请求来自同一个客户端。 为了解决这个问题, Web程序引入了Cookie机制来维护状态 。
65+ HTTP协议是无状态的,同一个客户端的这次请求和上次请求是没有对应关系,对HTTP服务器来说,它并不知道这两个请求是否来自同一个客户端。 为了解决这个问题, Web程序引入了Cookie机制来维护连接的可持续状态 。
6666
6767> HTTP协议是建立在TCP协议之上的,因此TCP攻击一样会影响HTTP的通讯,例如比较常见的一些攻击:SYN Flood是当前最流行的DoS(拒绝服务攻击)与DdoS(分布式拒绝服务攻击)的方式之一,这是一种利用TCP协议缺陷,发送大量伪造的TCP连接请求,从而使得被攻击方资源耗尽(CPU满负荷或内存不足)的攻击方式。
6868
69- ### HTTP请求信息( 浏览器信息)
69+ ### HTTP请求包( 浏览器信息)
7070
71- 我们先来看看Request消息的结构, Request 消息分为3部分 ,第一部分叫Request line, 第二部分叫Request header,第三部分是body。header和body之间有个空行,详细的如下所示
71+ 我们先来看看Request包的结构, Request包分为3部分 ,第一部分叫Request line(请求行) , 第二部分叫Request header(请求头) ,第三部分是body(主体) 。header和body之间有个空行,请求包的例子所示:
7272
73- - 请求行:GET/POST(流的组织(请求)方式) URL(地址+目录) 版本号
74- - 请求头:
75-
76- Host:客户端IP和端口
77- User-Agent:浏览器信息
78- Accept:客户端能接收的数据类型
79- Accept-encoding:是否支持压缩的流
80- Accept-charset:客户端字符编码集
81- - 空行:分割请求头和消息体
82- - 消息体:请求的参数
73+ GET /domains/example/ HTTP/1.1 //请求行: 请求方法 请求URI HTTP协议/协议版本
74+ Host:www.iana.org //服务端的主机名
75+ User-Agent:Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.4 (KHTML, like Gecko) Chrome/22.0.1229.94 Safari/537.4 //浏览器信息
76+ Accept:text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 //客户端能接收的mine
77+ Accept-Encoding:gzip,deflate,sdch //是否支持流压缩
78+ Accept-Charset:UTF-8,*;q=0.5 //客户端字符编码集
79+ //空行,用于分割请求头和消息体
80+ //消息体,请求资源参数,例如POST传递的参数
8381
8482我们通过fiddler抓包可以看到如下请求信息
8583
8684![ ] ( images/3.1.http.png?raw=true )
8785
8886![ ] ( images/3.1.httpPOST.png?raw=true )
8987
90- 我们可以看到GET请求消息体为空,POST请求带有消息体。
88+ ** 我们可以看到GET请求消息体为空,POST请求带有消息体** 。
9189
92- Http协议定义了很多与服务器交互的方法 ,最基本的有4种,分别是GET,POST,PUT,DELETE. 一个URL地址用于描述一个网络上的资源,而HTTP中的GET, POST, PUT, DELETE就对应着对这个资源的查,改,增,删4个操作。 我们最常见的就是GET和POST了。GET一般用于获取/查询资源信息,而POST一般用于更新资源信息.
90+ HTTP协议定义了很多与服务器交互的请求方法 ,最基本的有4种,分别是GET,POST,PUT,DELETE. 一个URL地址用于描述一个网络上的资源,而HTTP中的GET, POST, PUT, DELETE就对应着对这个资源的查,改,增,删4个操作。 我们最常见的就是GET和POST了。GET一般用于获取/查询资源信息,而POST一般用于更新资源信息.
9391我们看看GET和POST的区别
94921 . GET提交的数据会放在URL之后,以?分割URL和传输数据,参数之间以&相连,如EditPosts.aspx?name=test1&id=123456. POST方法是把提交的数据放在HTTP包的Body中.
95932 . GET提交的数据大小有限制(因为浏览器对URL的长度有限制),而POST方法提交的数据没有限制.
96943 . GET方式提交数据,会带来安全问题,比如一个登录页面,通过GET方式提交数据时,用户名和密码将出现在URL上,如果页面可以被缓存或者其他人可以访问这台机器,就可以从历史记录获得该用户的账号和密码。
9795
98- ### HTTP响应信息( 服务器信息)
99- 我们再来看看HTTP的response信息 ,他的结构如下:
96+ ### HTTP响应包( 服务器信息)
97+ 我们再来看看HTTP的response包 ,他的结构如下:
10098
101- - 状态行:HTTP版本 服务器状态(比如:404找不到...) 描述信息
102- - 响应头
99+ HTTP/1.1 200 OK //状态行
100+ Server: nginx/1.0.8 //服务器使用的WEB软件名及版本
101+ Date:Date: Tue, 30 Oct 2012 04:14:25 GMT //发送时间
102+ Content-Type: text/html //服务器发送信息的类型
103+ Transfer-Encoding: chunked //表示发送HTTP包是分段发的
104+ Connection: keep-alive //保持连接状态
105+ Content-Length: 90 //主体内容长度
106+ //空行 用来分割消息头和主体
107+ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"... //消息体
103108
104- Content-Type:服务器发送信息的类型
105- Date:发送时间
106- Server:服务器类型
107- - 消息体:服务器发送给客户端的页面内容
109+ Response包中的第一行叫做状态行,由HTTP协议版本号, 状态码, 状态消息 三部分组成。
108110
109- Response 消息中的第一行叫做状态行,由HTTP协议版本号, 状态码, 状态消息 三部分组成。
111+ 状态码用来告诉HTTP客户端,HTTP服务器是否产生了预期的Response。HTTP/1.1协议中定义了5类状态码, 状态码由三位数字组成,第一个数字定义了响应的类别
110112
111- 状态码用来告诉HTTP客户端,HTTP服务器是否产生了预期的Response.
112-
113- HTTP/1.1中定义了5类状态码, 状态码由三位数字组成,第一个数字定义了响应的类别
114-
115- - 1XX 提示信息 - 表示请求已被成功接收,继续处理
116- - 2XX 成功 - 表示请求已被成功接收,理解,接受
117- - 3XX 重定向 - 要完成请求必须进行更进一步的处理
118- - 4XX 客户端错误 - 请求有语法错误或请求无法实现
119- - 5XX 服务器端错误 - 服务器未能实现合法的请求
113+ - 1XX 提示信息 - 表示请求已被成功接收,继续处理
114+ - 2XX 成功 - 表示请求已被成功接收,理解,接受
115+ - 3XX 重定向 - 要完成请求必须进行更进一步的处理
116+ - 4XX 客户端错误 - 请求有语法错误或请求无法实现
117+ - 5XX 服务器端错误 - 服务器未能实现合法的请求
120118
121119我们看下面这个图展示了详细的返回信息,左边可以看到有很多的资源返回码,200是常用的,表示正常信息,302表示跳转。response header里面展示了详细的信息。
122120
@@ -126,21 +124,21 @@ HTTP/1.1中定义了5类状态码, 状态码由三位数字组成,第一个
126124### HTTP协议是无状态的和Connection: keep-alive的区别
127125无状态是指协议对于事务处理没有记忆能力,服务器不知道客户端是什么状态。从另一方面讲,打开一个服务器上的网页和你之前打开这个服务器上的网页之间没有任何联系。
128126
129- HTTP是一个无状态的面向连接的协议,无状态不代表HTTP不能保持TCP连接,更不能代表HTTP使用的是UDP协议(无连接 )。
127+ HTTP是一个无状态的面向连接的协议,无状态不代表HTTP不能保持TCP连接,更不能代表HTTP使用的是UDP协议(面对无连接 )。
130128
131- 从HTTP/1.1起,默认都开启了Keep-Alive,保持连接特性, 简单地说,当一个网页打开完成后,客户端和服务器之间用于传输HTTP数据的TCP连接不会关闭,如果客户端再次访问这个服务器上的网页,会继续使用这一条已经建立的连接 。
129+ 从HTTP/1.1起,默认都开启了Keep-Alive保持连接特性, 简单地说,当一个网页打开完成后,客户端和服务器之间用于传输HTTP数据的TCP连接不会关闭,如果客户端再次访问这个服务器上的网页,会继续使用这一条已经建立的TCP连接 。
132130
133- Keep-Alive不会永久保持连接,它有一个保持时间,可以在不同的服务器软件 (如Apache)中设定这个时间
131+ Keep-Alive不会永久保持连接,它有一个保持时间,可以在不同服务器软件 (如Apache)中设置这个时间
134132
135133## 请求实例
136134
137135![ ] ( images/3.1.web.png?raw=true )
138136
139137上面这张图我们可以了解到整个的通讯过程,同时细心的读者是否注意到了一点,一个URL请求但是左边栏里面为什么会有那么多的资源请求(这些都是静态文件,go对于静态文件有专门的处理方式)。
140138
141- 这个就是浏览器的功能 ,第一次请求url,服务器端返回的是html页面,然后浏览器开始渲染html,当解析到src里面的img资源、css资源、js资源,浏览器就会自动发起http请求,把需要的资源从服务器请求回来,然后浏览器就会宣布渲染出来,这样就是完整展现在我们面前的一个网页了 。
139+ 这个就是浏览器的一个功能 ,第一次请求url,服务器端返回的是html页面,然后浏览器开始渲染HTML:当解析到HTML DOM里面的图片连接,css脚本和js脚本的链接,浏览器就会自动发起一个请求静态资源的HTTP请求,获取相对应的静态资源,然后浏览器就会渲染出来,最终将所有资源整合、渲染,完整展现在我们面前的屏幕上 。
142140
143- > 网页优化方面有一项是减少http请求次数,就是把尽量多的css和js合并在一起,尽量做到少的http请求 。
141+ > 网页优化方面有一项措施是减少HTTP请求次数,就是把尽量多的css和js资源合并在一起,目的是尽量减少网页请求静态资源的次数,提高网页加载速度,同时减缓服务器的压力 。
144142
145143## links
146144 * [ 目录] ( < preface.md > )
0 commit comments