这是一个前端的经典面试题,很多大公司面试时都会被问及,涉及的面也是非常多。

一般会经历以下几个过程:

1、首先,在浏览器地址栏中输入url

2、浏览器先查看浏览器缓存-系统缓存-路由器缓存,如果缓存中有,会直接在屏幕中显示页面内容。若没有,则跳到第三步操作。

3、在发送http请求前,需要域名解析(DNS解析),解析获取相应的IP地址。

4、浏览器向服务器发起tcp连接(TCP是一种面向有连接的传输层协议),与浏览器建立tcp三次握手。

  三次握手过程:

  • 第一次握手,请求建立连接,发送端发送连接请求报文,将SYN置为1,产生随机的顺序号seq=x

  • 第二次握手,接收端收到发送端发过来的报文,由SYN为1可知发送端现在要建立联机。然后接收端会向发送端发送一个SYN为1和ACK为x+1的报文,同时设置了自己随机产生的一个随机的顺序号seq=y

  • 第三次握手,发送端收到了发送过来的报文,需要检查一下返回的ACK是否是正确的(x+1);若正确的话,发送端再次发送确认包,ACK为y+1,设置顺序号seq=x+1。

5、握手成功后,浏览器向服务器发送http请求(也就是超文本传输协议),请求数据包。(完整的HTTP请求消息包含了:一个请求行、请求消息报头以及请求正文)

6、服务器处理收到的请求,将数据返回至浏览器

7、浏览器收到HTTP响应

  响应的状态类别:

  • 1xx: 提供信息,表示请求以及被成功接收,需要继续处理
  • 2xx: 肯定应答,表示请求已成功被服务器接收、理解并接受了
  • 3xx: 重定向,代表了客户端需要进一步的操作才能完成请求,通常后续的请求地址会在本次响应Location域中指明
  • 4xx: 客户端请求内存出现错误,妨碍了服务器处理。除非响应是一个HEAD请求,否则服务器返回一个解释当前错误状况以及是临时的还是永久的的实体正文内容。
  • 5xx: 服务器错误,代表服务器在处理过程中发生了错误或者异常,也有可能是服务器无法完成对请求处理。除非这是一个HEAD请求,否则服务端应该响应一个包含解释当前错误状态以及是临时的还是永久的实体正文内容。

8、读取页面内容,浏览器渲染,解析html源码

9、生成Dom树、解析css样式、js交互

10、客户端和服务器交互

11、ajax查询

一个网页从输入URL到页面加载完成的过程中都发生了什么事情?的更多相关文章

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

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

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

    这个问题是老生常谈的问题啦,虽然说到处百度都有的答案,还是希望自己能总结一下. 如今有很多答案,都是从硬件开始讲起,比如键盘的响应或者触屏的响应,然后CPU处理到OS的内核等等.这里不作为重点来讲,要 ...

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

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

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

    1) 把URL分割成几个部分:协议.网络地址.资源路径.其中网络地址指示该连接网络上哪一台计算机,可以是域名或者IP地址,可以包括端口号:协议是从该计 算机获取资源的方式,常见的是HTTP.FTP,不 ...

  5. 面试经典——从输入 URL 到页面加载完的过程中都发生了什么事情?

    想要更加了解http协议,猛戳这里 1)把URL分割成几个部分:协议.网络地址.资源路径.其中网络地址指示该连接网络上哪一台计算机,可以是域名或者IP地址,可以包括端口号:协议是从该计算机获取资源的方 ...

  6. 转载:从输入 URL 到页面加载完的过程中都发生了什么事情?

    原帖地址:http://www.guokr.com/question/554991/ 1)把URL分割成几个部分:协议.网络地址.资源路径.其中网络地址指示该连接网络上哪一台计算机,可以是域名或者IP ...

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

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

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

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

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

    过程概述 浏览器查找域名对应的 IP 地址: 浏览器根据 IP 地址与服务器建立 socket 连接: 浏览器与服务器通信: 浏览器请求,服务器处理请求: 浏览器与服务器断开连接. 以下为详细解析: ...

随机推荐

  1. vue服务端打包及自动部署

    上次给CI环境搭建好了,这次写了一个脚本用于服务端打包及部署使用,解决了前端需要频繁打包的问题,即时将代码推到工程库,服务端自动打包作发布,然后测试人员即时测试,尽早发现问题. 发布原理: 我没有通过 ...

  2. Navicat for Mysql安装及破解教程

    一.Navicat for Mysql安装 下载链接:https://navicatformysql.en.softonic.com/ 点击download下载. 下载完成后双击安装 二.破解 破解工 ...

  3. mask-rcnn代码解读(五):mask_iou的计算

    我以为只有box能计算iou值,但我看了maskrcnn后,发现该模型对mask进行了iou的计算,该方法巧妙之处在于 mask1与mask2必须有相同的height and width,而后在同一个 ...

  4. 如何将LNMP拆分为LNP+MySQL

    1.备份172.16.1.7上的数据库信息 [root@web01 ~]# mysqldump -uroot -p'oldxu.com' --all-databases > mysql-all. ...

  5. 深入浅出《设计模式》之外观模式(C++)

    前言 模式介绍 外观模式相比较之下比较简单,模式设计中定义是为子系统中的一组接口提供一个一致的界面,此模式定义了一个高层接口,这个接口是的这一子系统更加容易使用. 如果不理解呢,简单些说就是外观模式提 ...

  6. python3使用模块

    Python内置了很多非常有用的模块,只要安装完毕,这些模块就可以立刻使用. 我们以内建的sys模块为例,编写一个hello的模块: #!/usr/bin/env python3 # -*- codi ...

  7. LeetCode——Rank Scores

    Write a SQL query to rank scores. If there is a tie between two scores, both should have the same ra ...

  8. Oracle 11G空表无法导出处理

    通过exp进行数据导出的时候,如果表的数据为空,则会出现警告,并且表也不会导出,不利于数据恢复. 可以通过以下方法进行解决: 一.使用ALLOCATE EXTENT,可以导出之前已经存在的空表 --查 ...

  9. 如何在Ubuntu编译ice

    摘要:所有操作都在root用户下执行 第一步:下载ice最新版本,以3.7版本为例 第二步:安装ICE依赖包里面的三方库 #apt-get install libmcpp-dev;apt-get in ...

  10. Visual Studio的UTF-8问题

    参考:https://www.jianshu.com/p/c51cbb2f20e1 一.在“工具”菜单找到“自定义”,然后按照图示操作. 二.选择“编码”.