What really happens when you navigate to a URL

感冒了超级不舒服,最近有点过度焦虑了,认真再看看这篇经典文章,翻译如下,以此静心!

1、  浏览器地址栏输入网址

2、  浏览器寻找域名对应的IP地址;DNS域名解析系统按照如下顺序进行查找:

  2.1 浏览器缓存;有时浏览器会短暂的缓存DNS查找记录,操作系统并不会告诉浏览器每个DNS记录的生存时间,所以浏览器在固定的时间缓存他们 (不同浏览器之间,2 - 30分钟);

  2.2 操作系统缓存;浏览器缓存中查找无果的情况下,浏览器会进行一个系统调用,gethostbyname的函数,操作系统有自身的缓存。

  2.3 路由器缓存;

  2.4 DNS服务器上的ISP缓存;具体指网络服务提供商给网页批量访问加速的一种解决方案,将当期访问量比较大的网页放在缓存中,从而提高访问速度,ISP缓存主要以缓存静态页面为主,如新浪的新闻页;

  2.5 递归搜索;ISP的DNS服务器开始递归搜索,从根命名服务器,通过com顶级命名服务器,直到Facebook的命名服务器(假设请求的url地址是:Facebook.com)。

3、  浏览器发送http请求到web服务器

以下面这个请求为例:

GET http://facebook.com/ HTTP/1.1

Accept: 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, deflate

Connection: Keep-Alive

Host: facebook.com

Cookie: datr=1265876274-[...]; locale=en_US; lsd=WW[...]; c_user=2101[...]

Get请求定义了要请求的url地址,浏览器也通过User-Agent表明了身份,具体是通过什么浏览器访问的。Accept 和 Accept-Encoding 也声明了接收的类型,Connection请求头的设置告诉服务器保持tcp连接。还有一些记录了登陆用户的账号密码或其他用户设置的信息的cookies也会随每一次的请求一并发送到服务器。在优化网站时,可以通过fiddle或firebug等工具进行这些详细信息的查看。

注意:在URL http://facebook.com/末尾的斜杠也是非常重要的,该请求浏览器可以直接添加末尾斜杠,但是譬如http://example.com/folderOrFile,浏览器就不能在末尾自动的加一个斜杠,因为folderOrFile是目录还是文件不太确定,在这样的情况下,浏览器请求的时候不带斜杠,服务器将响应一个重定向,从而导致不必要的往返。

4、  facebook 的服务器响应一个301永久重定向的状态码,告知浏览器去访问“http://www.facebook.com/” 而不是 “http://facebook.com/”。

服务器不直接响应的原因有:一个是搜索引擎排名,二是多个内容相同的url在缓存方面并不友好。

5、  浏览器重定向

6、  服务器处理请求;

这可能看起来像一个简单的任务,但事实上,这里发生了很多有趣的事情,即便是一个简单的博客网站,更不用说在大规模可伸缩的像facebook这样的网站上。

比如说数据的存储,分片,夜间数据更新等。

7、  服务器返回一个200的html请求;Content-Encoding告知浏览器响应主体部分通过gzip进行了压缩。

8、  浏览器开始渲染html;

9、  浏览器继续发送嵌在html中的请求。Images,css,js等,每一个地址都要经历类似于HTML页面请求的过程,域名的DNS查找,发送请求URL,遵循重定向。。。

静态文件和动态的网页不同,可以在浏览器中进行缓存,有些文件直接从缓存中得到,并没有经过服务器,浏览器通过解读包含Expires响应头设置的文件知道如何去缓存特定的文件,同时,每个响应一般都会有一个ETag(类似于版本号),如果浏览器看到一个已经存在相同ETag的文件,会立即中断该条请求的通信线路。

访问量比较大的网站会设置CDN,缓存一些静态资源,实现负载均衡。

10、浏览器发送异步的ajax请求。

本文参考:http://igoro.com/archive/what-really-happens-when-you-navigate-to-a-url/

时间: 2024-12-17 17:22:31

What really happens when you navigate to a URL的相关文章

前端:从 URL 输入到页面展现发生了什么?(What really happens when you navigate to a URL)

原文链接: http://blog.csdn.net/tangxiaolang101/article/details/54670218 写在前面的话,这是一篇译文,阅读资料时顺带整理翻译的,原文地址:http://igoro.com/archive/what-really-happens-when-you-navigate-to-a-url/ 作为一个程序员,你应该对web应用是如何工作的有一个高水平的认识,它工作过程都包含了哪些技术:浏览器.HTTP.HTML.web server. requ

页面之刷新

HTML 是不是想让页面自动不停刷新,或者自动跳转到另外一个页面? 其实非常简单,只要把以下代码加入页面中就可以了. 1.页面自动刷新:加入<head>区域中 <meta http-equiv="refresh" content="10">,其中10指每隔10秒刷新一次页面. 2.页面自动跳转:加入<head>区域中 <meta http-equiv="refresh" content="10;

输入url到页面返回的过程

输入url后,你看到了百度的首页,那么这一切是如何发生的呢? 这个问题之前.最近.我想以后肯定还会被问到,或者问到这样的题目,如果在百度框里输入查询的字符串开始,是怎么返回你需要的东西呢. 那这什么个过程呢(这个问题我在之后的博客中在写)? 网上各种的说法,不外乎这么几种 第一种简单的说呢就是这样的: 第一步:客户机提出域名解析请求,并将该请求发送给本地的域名服务器. 第二步:当本地的域名服务器收到请求后,就先查询本地的缓存,如果有该纪录项,则本地的域名服务器就直接把查询的结果返回. 第三步:如

C#中的WebBrowser控件的使用

0.常用方法 Navigate(string urlString):浏览urlString表示的网址 Navigate(System.Uri url):浏览url表示的网址 Navigate(string urlString, string targetFrameName, byte[] postData, string additionalHeaders): 浏览urlString表示的网址,并发送postData中的消息 //(通常我们登录一个网站的时候就会把用户名和密码作为postData

C#WebBrowser控件使用教程与技巧收集

常用属性和方法 Navigate(string urlString):浏览urlString表示的网址 Navigate(System.Uri url):浏览url表示的网址 Navigate(string urlString, string targetFrameName, byte[] postData, string additionalHeaders): 浏览urlString表示的网址,并发送postData中的消息//(通常我们登录一个网站的时候就会把用户名和密码作为postData

解决Silverlight F5刷新问题

最近在做一个SL的项目,做完后,遇到一个F5刷新的问题,本人也是第一次接触接触SL项目,记得再ASP.NET浏览器的缓存会自动保存最后一次的浏览记录的. 所以就在网上到处找资料,可惜运气不好,都没找到合适的资料.基本的解决方法都是通过再HTML页面增加JS方法,屏蔽F5刷新按钮的功能,但是这 样的需求并不是我们项目中所要的,还好在BAIDU和群里高手的帮助下,终于大体了解了SL刷新的过程和解决F5刷新返回最后次浏览页面的思想.. 1:SL刷新过程 SL本身就是HTML页面的一个插件程序,在浏览器

从输入 URL 到浏览器接收的过程中发生了什么事情?

从输入 URL 到浏览器接收的过程中发生了什么事情? What really happens when you navigate to a URL 上面两篇文章都解读的很好,值得阅读. 接下来在总结一下这个过程: 1.首先,会查询缓存,如果缓存存在的话则直接响应,否则继续下面过程: 2.当发送一个URL请求时,不管这个URL是Web页面的URL还是Web页面上每个资源的URL,浏览器都会开启一个线程来处理这个请求,同时在远程DNS服务器上启动一个DNS查询.这能使浏览器获得请求对应的IP地址.D

win10 uwp 如何让WebView标识win10手机

本文主要:如何让WebView访问的网页设别为手机,当然这句话我说不好,换个,如何让WebView设别为手机.上面两句话都是错的,因为是服务器识别,不是网页,第二句话应该是让服务器而不是WebView.为什么这样写是因为有大神在群里问这个,他这样说,我这样写希望大家能在搜索看到.当然本文发在csdn和win10.me,在他地方并没有发,不过我的gitbook.io还是有的. 如何让WebView设别手机,其实很简单,但是我开始没有找到WebView userAgent 其实发现他不需要. 我们在

Backbone.js源码分析(珍藏版)

源码分析珍藏,方便下次阅读! // Backbone.js 0.9.2 // (c) 2010-2012 Jeremy Ashkenas, DocumentCloud Inc. // Backbone may be freely distributed under the MIT license. // For all details and documentation: // http://backbonejs.org (function () { // 创建一个全局对象, 在浏览器中表示为w