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

What really happens when you navigate to a URL

上面两篇文章都解读的很好，值得阅读。

接下来在总结一下这个过程：

1、首先，会查询缓存，如果缓存存在的话则直接响应，否则继续下面过程；

2、当发送一个URL请求时，不管这个URL是Web页面的URL还是Web页面上每个资源的URL，浏览器都会开启一个线程来处理这个请求，同时在远程DNS服务器上启动一个DNS查询。这能使浏览器获得请求对应的IP地址。DNS查找过程如下：浏览器缓存 、系统缓存、路由器缓存、ISP DNS 缓存、递归搜索

3、浏览器与远程`Web`服务器通过`TCP`三次握手协商来建立一个`TCP/IP`连接。该握手包括一个同步报文，一个同步-应答报文和一个应答报文，这三个报文在 浏览器和服务器之间传递。该握手首先由客户端尝试建立起通信，而后服务器应答并接受客户端的请求，最后由客户端发出该请求已经被接受的报文。

　 4、一旦`TCP/IP`连接建立，浏览器会通过该连接向远程服务器发送`HTTP`的`GET`请求。远程服务器找到资源并使用HTTP响应返回该资源，值为200的HTTP响应状态表示一个正确的响应。

5、此时，`Web`服务器提供资源服务，客户端开始下载资源。如果资源可缓存则存入缓存。

　 6、响应返回后，便进入了我们关注的前端模块，浏览器决定如何处理这些响应（例如，它是HTML页面，一张图片，一段音乐）。简单来说，浏览器会解析`HTML`生成`DOM Tree`，其次会根据CSS生成CSS Rule Tree，而`javascript`又可以根据`DOM API`操作`DOM`

从输入 URL 到浏览器接收的过程中发生了什么事情？的更多相关文章

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

    从输入 URL 到浏览器接收的过程中发生了什么事情? 原文:http://www.codeceo.com/article/url-cpu-broswer.html 从触屏到 CPU  首先是「输入 U ...

  2. [转]从输入url到页面加载完成的过程中都发生了什么事情

    第一个问题:从输入 URL 到浏览器接收的过程中发生了什么事情? 从触屏到 CPU 首先是「输入 URL」,大部分人的第一反应会是键盘,不过为了与时俱进,这里将介绍触摸屏设备的交互. 触摸屏一种传感器 ...

  3. 从输入URL到页面加载完成的过程中都发生了什么事情？

    为了便于理解,我将整个过程分为了六个问题来展开. 第一个问题:从输入 URL 到浏览器接收的过程中发生了什么事情? 从触屏到 CPU 首先是「输入 URL」,大部分人的第一反应会是键盘,不过为了与时俱 ...

  4. 在浏览器中输入url地址 -> 显示主页的过程

    -来自<图解HTTP> 最近在进行前端面试方面的一些准备,看了网上许多相关的文章,发现有一个问题始终绕不开: 在浏览器中输入URL到整个页面显示在用户面前时这个过程中到底发生了什么.仔细思 ...

  5. 【转】 从输入 URL 到页面加载完成的过程中都发生了什么事情？

    该问题总结 一. 往浏览器输入URL后给你一个页面,你天天在使用的东西,学过计算机网络的知道是怎么回事,就DNS解析然后页面的回馈,不过要讲好还是有难度. 之前fex团队的nwind专门写过这个问题的 ...

  6. Web访问原理-从输入URL到页面加载完成的过程中都发生了什么事情？

    从输入URL到页面加载完成的过程中都发生了什么事情?--这是一个经典的面试题: 主要是关于计算机网络方面的知识基础,对于非科班计算机自学web开发的同学可能理解起来就很困难. StackOverFlo ...

  7. 一个网页从输入URL到页面加载完成的过程中都发生了什么事情？

    这是一个前端的经典面试题,很多大公司面试时都会被问及,涉及的面也是非常多. 一般会经历以下几个过程: 1.首先,在浏览器地址栏中输入url 2.浏览器先查看浏览器缓存-系统缓存-路由器缓存,如果缓存中 ...

  8. 《浏览器工作原理与实践》<04>从输入URL到页面展示，这中间发生了什么？

    “在浏览器里,从输入 URL 到页面展示,这中间发生了什么? ”这是一道经典的面试题,能比较全面地考察应聘者知识的掌握程度,其中涉及到了网络.操作系统.Web 等一系列的知识. 在面试应聘者时也必问这 ...

  9. 一文摸透从输入URL到页面渲染的过程

    一文摸透从输入URL到页面渲染的过程 从输入URL到页面渲染需要Chrome浏览器的多个进程配合,所以我们先来谈谈现阶段Chrome浏览器的多进程架构. 一.Chrome架构 目前Chrome采用的是 ...

随机推荐

  1. angularjs中ng-selected使用方法

    ng-selected只能应用在option标签上,就像ng-submit只能应用在form标签上一样. ng-selected指令为select设置了指定的选中值,HTML规范不允许浏览器保存类似s ...

  2. python学习笔记-（三）条件判断和循环

    1.条件判断语句 Python中条件选择语句的关键字为:if .elif .else这三个.其基本形式如下: age_of_cc = 27 age = int(input("guessage ...

  3. Linux下开发常用 模拟 Http get和post请求

    1.get请求 curl "http://www.baidu.com"      如果这里的URL指向的是一个文件或者一幅图都可以直接下载到本地 curl -i "htt ...

  4. join和setdaemon()初探

    join()方法:主线程A中,创建了子线程B,并且在主线程A中调用了B.join(),那么主线程A会在调用的地方等待,直到子线程B完成操作后,才可以接着往下执行,那么在调用这个线程时可以使用被调用线程 ...

  5. Game Programming Pattern

    http://gameprogrammingpatterns.com/contents.html

  6. Visual Studio无法查找或打开 PDB 文件解决办法

    Visual Studio无法查找或打开 PDB 文件解决办法 用VS调试程序时,有时会在VS底部的“输出”框中提示“无法查找或打开 PDB 文件”.这该怎么解决呢? 下面,我们以VS2013为例,来 ...

  7. The length of the string value exceeds the length configured in the mapping/parameter.

    在NHibernate 3.3 中存储的字符串太长,会抛异常:The length of the string value exceeds the length configured in the m ...

  8. Yii2 使用 Joins 查询

    Join() JOIN_TYPE = INNER JOIN, LEFT OUTER JOIN, RIGHT OUTER JOIN, FULL OUTER JOIN 等等 语法 $query = new ...

  9. “mybatis 中使用foreach 传

    为了帮助网友解决“mybatis 中使用foreach 传”相关的问题,中国学网通过互联网对“mybatis 中使用foreach 传”相关的解决方案进行了整理,用户详细问题包括:mybatismap ...

  10. php生成唯一随机码

    最终使用: echo md5(time() . mt_rand(1,1000000)) //A:利用时间戳的方法 md5("admin"); // B:32位MD5加密 subst ...