原文地址:http://igoro.com/archive/what-really-happens-when-you-navigate-to-a-url/?utm_source=wechat_session&utm_medium=social&utm_oi=1246582688892993536
作为软件开拓职员,您须要全面理解Web运用程序的事情办法以及所涉及的技能:浏览器,HTTP,HTML,Web做事器,要求处理程序等。
在本文中,我们将更深入地研究访问URL时发生的事宜的顺序。

统统都从这里开始:
2.浏览器查找域名的IP地址
导航的第一步是找出访问域的IP地址。DNS查找过程如下:
浏览器缓存– 浏览器缓存DNS记录一段韶光。操作系统不会见告浏览器每个DNS记录的生存韶光,因此浏览器会将它们缓存固定的持续韶光(不同浏览器之间的间隔为2到30分钟)。操作系统缓存– 如果浏览器缓存不包含所需的记录,则浏览器会进行系统调用(Windows中为gethostbyname)。操作系统具有自己的缓存。路由器缓存- 要求连续到您的路由器,该路由器常日具有自己的DNS缓存。ISP DNS缓存– 下一个要检讨的地方是缓存ISP的DNS做事器。具有缓存,自然。递归搜索– 您的ISP的DNS做事器开始从根名称做事器到.com顶级名称做事器再到Facebook的名称做事器的递归搜索。常日,DNS做事器在缓存中将具有.com名称做事器的名称,因此无需对根名称做事器进行匹配。
这是递归DNS搜索的示意图:
关于DNS的一件令人担忧的事情是,全体域(例如wikipedia.org或facebook.com)彷佛都映射到一个IP地址。幸运的是,有一些缓解瓶颈的方法:
轮询DNS是一种DNS查找返回多个IP地址而不是一个IP地址的办理方案。例如,facebook.com实际上映射到四个IP地址。负载平衡器是侦听特定IP地址并将要求转发到其他做事器的硬件。紧张站点常日会利用昂贵的高性能负载平衡器。地理DNS通过将域名映射到不同的IP地址来提高可伸缩性,详细取决于客户真个地理位置。这对付托管静态内容非常有用,因此不同的做事器不必更新共享状态。Anycast是一种路由技能,个中单个IP地址映射到多个物理做事器。不幸的是,Anycast不适用于TCP,并且在这种情形下很少利用。大多数DNS做事器本身都利用任播,以实现DNS查找的高可用性和低延迟。
3.浏览器将HTTP要求发送到Web做事器您可以肯定的是,不会从浏览器缓存中供应Facebook主页,由于动态页面会很快或立即过期(将过期日期设置为过去)。
因此,浏览器会将此要求发送到Facebook做事器:
GET http://facebook.com/ HTTP/1.1Accept: application/x-ms-application, image/jpeg, application/xaml+xml, [...]User-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; [...]Accept-Encoding: gzip, deflateConnection: Keep-AliveHost: facebook.comCookie: datr=1265876274-[...]; locale=en_US; lsd=WW[...]; c_user=2101[...]
GET要求将要获取的URL命名为: “ http://facebook.com/”。浏览器标识自己(User-Agent标头),并声明它将接管的相应类型(Accept和Accept-Encoding标头)。该连接头哀求做事器以保持TCP连接开放的进一步要求。该要求还包含浏览器针对该域的cookie。
您可能已经知道,cookie是键值对,它们在不同页面要求之间跟踪网站的状态。因此,cookie会存储登任命户的名称,做事器分配给该用户的密码,用户的某些设置等。这些cookie将存储在客户真个文本文件中,并发送给做事器处理每个要求。
有多种工具可让您查看原始HTTP要乞降相应的相应。我最喜好的用于查看原始HTTP流量的工具是fiddler,但还有许多其他工具(例如FireBug),这些工具在优化站点时非常有用。
除了GET要求之外,您可能还熟习的另一种要求是POST要求,常日用于提交表单。GET要求通过URL发送其参数(例如:http://robozzle.com/puzzle.aspx ?id = 85)。POST要求在标头下的要求正文中发送其参数。
URL“ http://facebook.com/”中的斜杠很主要。在这种情形下,浏览器可以安全地添加斜杠。对付形式为http://example.com/folderOrFile的URL,浏览器无法自动添加斜杠,由于不清楚folderOrFile是文件夹还是文件。在这种情形下,浏览器将在没有斜杠的情形下访问URL,做事器将通过重定向进行相应,从而导致不必要的来回。
4. Facebook做事器以永久重定向相应这是Facebook做事器发送回浏览器要求的相应:
HTTP/1.1 301 Moved PermanentlyCache-Control: private, no-store, no-cache, must-revalidate, post-check=0, pre-check=0Expires: Sat, 01 Jan 2000 00:00:00 GMTLocation: http://www.facebook.com/P3P: CP="DSP LAW"Pragma: no-cacheSet-Cookie: made_write_conn=deleted; expires=Thu, 12-Feb-2009 05:09:50 GMT; path=/; domain=.facebook.com; httponlyContent-Type: text/html; charset=utf-8X-Cnection: closeDate: Fri, 12 Feb 2010 05:09:51 GMTContent-Length: 0
做事器以301永久移动相应作为相应,见告浏览器转到“ http://www.facebook.com/”而不是“ http://facebook.com/”。
做事器坚持重定向而不是立即响运用户想要查看的网页的缘故原由很有趣。
缘故原由之一与搜索引擎排名有关。请拜会,如果同一页面有两个URL,例如http://www.igoro.com/和http://igoro.com/,搜索引擎可能会将其视为两个不同的站点,每个站点的传入链接和因此排名较低。搜索引擎理解永久重定向(301),并将来自两个来源的传入链接合并到一个排名中。
同样,相同内容的多个URL也不适宜缓存。当一条内容具有多个名称时,它可能会在缓存中多次涌现。
5.浏览器遵照重定向浏览器现在知道“ http://www.facebook.com/”是要访问的精确URL,因此它发出另一个GET要求:
GET http://www.facebook.com/ HTTP/1.1Accept: application/x-ms-application, image/jpeg, application/xaml+xml, [...]Accept-Language: en-USUser-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; [...]Accept-Encoding: gzip, deflateConnection: Keep-AliveCookie: lsd=XW[...]; c_user=21[...]; x-referer=[...]Host: www.facebook.com
标头的含义与第一个要求的含义相同。
6.做事器“处理”要求做事器将吸收GET要求,对其进行处理,然后发送回相应。
这彷佛是一项大略的任务,但实际上,这里发生了很多有趣的事情-纵然在像我的博客这样的大略网站上,更不用说在诸如Facebook之类的可大规模扩展的网站上了。
Web做事器软件Web做事器软件(例如IIS或Apache)吸收HTTP要求,并确定应实行哪个要求处理程序来处理此要求。要求处理程序是一种程序(在ASP.NET,PHP,Ruby中,…),用于读取要求并天生相应的HTML。在最大略的情形下,要求处理程序可以存储在文件层次构造中,该文件层次构造的构造与URL构造类似,因此例如http://example.com/folder1/page1.aspx URL将映射到文件/ httpdocs / folder1 / page1 .aspx。还可以配置Web做事器软件,以便将URL手动映射到要求处理程序,因此page1.aspx的公共URL可以为http://example.com/folder1/page1。要求处理程序要求处理程序读取要求,其参数和cookie。它将读取并可能更新存储在做事器上的某些数据。然后,要求处理程序将天生HTML相应。每个动态网站面临的一个有趣的难题是如何存储数据。较小的站点常日将只有一个SQL数据库来存储其数据,但是存储大量数据和/或具有许多访问者的站点必须找到一种在多台打算机之间拆分数据库的方法。办理方案包括分片(基于主键在多个数据库之间拆分表),复制以及利用具有弱同等性语义的简化数据库。
使数据更新便宜的一种技能是将某些事情推迟到批处理事情中。例如,Facebook必须及时更新新闻源,但是支持“您可能认识的人”功能的数据可能只须要每晚进行更新(我想,我实际上并不知道他们如何实现此功能)。批处理作业更新会导致一些不太主要的数据迂腐,但是可以使数据更新更快,更大略。
7.做事器发回HTML相应这是做事器天生并发送回的相应:
HTTP/1.1 200 OKCache-Control: private, no-store, no-cache, must-revalidate, post-check=0, pre-check=0Expires: Sat, 01 Jan 2000 00:00:00 GMTP3P: CP="DSP LAW"Pragma: no-cacheContent-Encoding: gzipContent-Type: text/html; charset=utf-8X-Cnection: closeTransfer-Encoding: chunkedDate: Fri, 12 Feb 2010 09:05:55 GMT [...]
全体相应为36 kB,个中大部分位于我修整的字节blob中。
的内容编码头见告浏览器,相应体用gzip算法压缩。解压缩Blob之后,您将看到所需的HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" id="facebook" class=" no_js"><head><meta http-equiv="Content-type" content="text/html; charset=utf-8" /><meta http-equiv="Content-language" content="en" />
除了压缩外,标头还指定是否以及如何缓存页面,要设置的任何cookie(此相应中没有),隐私信息等。
把稳将Content-Type设置为text / html的标题。标头指示浏览器将相应内容呈现为HTML,而不是说将其下载为文件。浏览器将利用标头来决定如何阐明相应,但也会考虑其他成分,例如URL的扩展。
8.浏览器开始呈现HTML乃至在浏览器收到全体HTML文档之前,它就开始呈现该网站:
9.浏览器发送对嵌入HTML的工具的要求
当浏览器呈现HTML时,它会把稳到须要获取其他URL的标记。浏览器将发送GET要求以检索每个文件。
这是我访问facebook.com时检索到的一些URL:
图片http://static.ak.fbcdn.net/rsrc.php/z12E0/hash/8q2anwu7.gifhttp://static.ak.fbcdn.net/rsrc.php/zBS5C/hash/7hwy7at6.gif...CSS样式表http://static.ak.fbcdn.net/rsrc.php/z448Z/hash/2plh8s4n.csshttp://static.ak.fbcdn.net/rsrc.php/zANE1/hash/cvtutcee.css...JavaScript文件http://static.ak.fbcdn.net/rsrc.php/zEMOA/hash/c8yzb6ub.jshttp://static.ak.fbcdn.net/rsrc.php/z6R9L/hash/cq2lgbs8.js...这些URL中的每一个都将经历与HTML页面相似的过程。因此,浏览器将在DNS中查找域名,向URL发送要求,跟随重定向等。
但是,与动态页面不同,静态文件使浏览器可以缓存它们。某些文件可能是从缓存中供应的,根本没有联系做事器。浏览器知道缓存特定文件的韶光,由于返回该文件的相应包含Expires标头。此外,每个相应还可能包含一个ETag标头,其浸染类似于版本号–如果浏览器看到已具有该文件版本的ETag,它可以立即停滞传输。
您能猜出网址中的“ fbcdn.net”代表什么吗?可以肯定的是,它的意思是“ Facebook内容交付网络”。Facebook利用内容分发网络(CDN)分发静态内容-图像,样式表和JavaScript文件。因此,文件将被复制到环球的许多打算机上。
静态内容常日代表站点带宽的大部分,并且可以轻松地跨CDN复制。常日,站点将利用第三方CDN供应程序,而不是自己操作CND。例如,Facebook的静态文件由最大的CDN供应商Akamai托管。
作为演示,当您考试测验ping static.ak.fbcdn.net时,您将从akamai.net做事器得到相应。同样,有趣的是,如果您两次对URL进行ping操作,则可能会收到来自不同做事器的相应,这表明了在后台发生的负载平衡。
10.浏览器进一步发送异步(AJAX)要求本着Web 2.0的精神,纵然在呈现页面之后,客户端仍连续与做事器通信。
例如,Facebook谈天会随着来回的来连续更新您登录的朋友的列表。要更新已登录朋友的列表,在浏览器中实行的JavaScript必须向做事器发送异步要求。异步要求是通过程序布局的GET或POST要求,它会转到一个分外的URL。在Facebook示例中,客户端将POST要求发送到http://www.facebook.com/ajax/chat/buddy_list.php,以获取在线朋友的列表。
这种模式有时称为“ AJAX”,代表“异步JavaScript和XML”,只管没有特殊的情由做事器必须将相应格式化为XML。例如,Facebook返回JavaScript代码段以相应异步要求。
除其他外,提琴手工具使您可以查看浏览器发送的异步要求。实际上,您不仅可以被动地不雅观察要求,还可以修正并重新发送它们。如此随意马虎“欺骗” AJAX要求这一事实使带计分板的在线游戏开拓职员倍感悲痛。(显然,请不要那样作弊。)
Facebook谈天供应了一个有关AJAX有趣问题的示例:将数据从做事器推送到客户端。由于HTTP是要求-相应协议,因此谈天做事器无法将新推送到客户端。相反,客户端必须每隔几秒钟轮询一次做事器,以查看是否有新到达。
在这些类型的方案中,长轮询是一种有趣的技能,可以减少做事器上的负载。如果做事器在轮询时没有任何新,则仅不发送回相应。并且,如果在超时时间内收到此客户真个,则做事器将找到未完成的要求并返回带有相应的。
结论希望这可以使您更好地理解不同Web如何协同事情。