Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

从输入网址到展现页面 #33

Open
incuisting opened this issue Sep 14, 2017 · 0 comments
Open

从输入网址到展现页面 #33

incuisting opened this issue Sep 14, 2017 · 0 comments

Comments

@incuisting
Copy link
Owner

从输入网址到浏览器把页面展现出来一要经过以下几个步骤:

  1. 在浏览器输入URL
  2. 域名解析
  3. 服务器处理
  4. 网站处理
  5. 浏览器处理
  6. 绘制页面

第一步、在浏览器输入URL

什么是URL?
URL: 统一资源定位符,用于定位互联网上的资源

URL由那些部分组成?
传输协议+域名或IP地址+端口(缺损为80)+资源具体地址
例如:http://www.baidu.com/index.php(传输协议为http,域名或IP是www.baidu.com,资源具体地址为index.php

传输协议有哪些?
http、https、ftp、file

第二步、域名解析

当我们输入 http://www.baidu.com的时候其实浏览器是不知道www.baidu.com是什么东西的,需要查找www.baidu.com网站所在服务器的IP地址,才能找到目标。

服务器的IP地址是如何查找的?

  1. 浏览器缓存 – 浏览器会缓存DNS记录一段时间
  2. 系统缓存 - 从 Hosts 文件查找是否有该域名和对应 IP。
  3. 路由器缓存 – 一般路由器也会缓存域名信息。
  4. ISP DNS 缓存 – 比如到电信的 DNS 上查找缓存。
  5. 如果都没有找到,则向根域名服务器查找域名对应 IP,根域名(如.com)服务器把请求转发到下一级,直到找到 IP

第三步、服务器处理

服务器是一台安装系统的机器,常见的系统如Linux、windows server 2012,并且系统里安装有处理请求的应用 Web server。

Web server是什么?
接收用户的Request 交给网站代码,或者接受请求反向代理到其他 web服务器。

Web server 存在的意义是什么?
同一个服务器地址,有时候可能同时绑定了多个域名。当用户通过不同域名进行访问的时候,Web server就起到了内容分发的作用,为不同域名的用户请求展示其相应的内容。

第四步、网站处理

Paste_Image.png

第五步、浏览器处理

  • HTML字符串被浏览器接受后被一句句读取解析
  • 解析到link 标签后重新发送请求获取css
  • 解析到 script标签后发送请求获取 js,并执行代码
  • 解析到img 标签后发送请求获取图片资源

第六步、绘制页面

浏览器根据 HTML 和 CSS 计算得到渲染树,绘制到屏幕上。js 被执行。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant