1. 把URL分割成几个部分:协议(http, https)、网络地址(xxx.xxx.xxx.xxx)、资源路径(/xxx/xxx.xx)、端口号(默认80)。

  2. 如果地址不是一个IP地址,通过DNS(域名系统)将该地址解析成IP地址。

  3. 向2和3确定的IP和端口号发起网络连接。

  4. 根据http协议要求,组织一个请求的数据包,里面包含大量请求信息(包括请求的资源路径、你的身份等)。

  5. 服务器响应请求,将数据返回给浏览器。数据可能是根据HTML协议组织的网页,里面包含页面的布局、文字。数据也可能是图片、脚本程序等。

  6. 如果上一步返回的是一个页面,根据页面里一些外链的URL,例如图片的地址,按照1~5再次获取。

  7. 开始根据资源的类型,将资源组织成屏幕上显示的图像,这个过程叫渲染,网页渲染是浏览器最复杂、最核心的功能。

  8. 将渲染好的页面图像显示出来,并开始响应用户的操作。

【前端】从输入URL到页面加载完成的过程中都发生了什么事情的更多相关文章

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

随机推荐

  1. 转:HAR(HTTP Archive)规范

    HAR(HTTP Archive),是一个用来储存HTTP请求/响应信息的通用文件格式,基于JSON.这个格式的出现可以使HTTP监测工具以一种通用的格式导出所收集的数据,这些数据可以被其他支持HAR ...

  2. extjs 4.2 高度自适应

    问题描述: gridPanel放在tabpanel页中,而且这个tabpanel页是通过add方法添加的,页面整体布局是:首先一个viewPort布局,left区域是一个treePanel,通过点击t ...

  3. Java语言程序设计(基础篇) 第六章 方法

    第六章 方法 6.2 定义方法 1.方法的定义由方法名称.参数.返回值类型以及方法体组成. 2.定义在方法头中的变量称为形式参数(formal parameter)或者简称为形参(parameter) ...

  4. 基于 debootstrap 和 busybox 构建 mini ubuntu

    基于 debootstrap 和 busybox 构建 mini ubuntu 最近的工作涉及到服务器自动安装和网络部署操作系统,然后使用 ansible 和 saltsatck 进行配置并安装 op ...

  5. vmware在桥接模式下配置centos7网络,并使用xshell连接虚拟主机(总结篇)

    虚拟机系统:centos7 mini版本 1.虚拟安装成功之后,首先我配置的是桥接模式,因为我使用的是网线,配置完桥接模式之后我的linux虚拟机就可以访问网络了 2.因为我安装的是centos7的迷 ...

  6. js数组方法扩展

    /** * Created by Administrator on 2016/9/1. */ //数组去重 Array.prototype.unique = function(){ this.sort ...

  7. Python模块和包

    模块和包是python组织代码的基本方式. 模块: python的每一个脚本文件都可称之为模块,模块的名称就是脚本的文件名.例如当我们写了一个test.py的脚本文件,则可以在同目录下的另外一个脚本m ...

  8. The prefix "util" for element "util:list" is not bound.

    http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-4. ...

  9. LeetCode: Invert Binary Tree

    /** * Definition for a binary tree node. * public class TreeNode { * int val; * TreeNode left; * Tre ...

  10. Media Queries使用方法

    1. 最大宽度max-width “max-width”是媒体特性中最常用的一个特性,其意思是指媒体类型小于或等于指定的宽度时,样式生效.如: @media screen and (max-width ...