本人有若干成套学习视频, 可试看! 可试看! 可试看, 重要的事情说三遍 包含Java
, 数据结构与算法
, iOS
, 安卓
, python
, flutter
等等, 如有需要, 联系微信tsaievan
.
当你在浏览器中输入网址时发生了什么?
这不仅仅是一个面试问题, 也是我们每次在浏览器里输入网址的时候也常常思考这个问题, 这篇文章给我们提供了针对这个问题的一些思考.
Step 1. URL
被输进浏览器地址栏
Step 2. 如果你的请求对象在浏览器缓存中, 请看Step 8
Step 3. DNS
查找服务器ip
地址
当我们想连接google.com
时, 我们实际上是连接 google
的web
服务器的主机. 这主机有一个74.125.236.65
的ip地址, 此时, 如果你在浏览器中输入http://74.125.236.65
, 也会显示google
的主页, 看起来http://google.com
和http://74.125.236.65
是同一个东西, 没什么区别, 但其实不是这样, 每一秒钟, Google
都要接收巨量的网络请求,为了满足这一点, Google
在多个地点都拥有多个服务器, 因而我们需要让Google
决定哪一台服务器最能满足我们的需求. 使用google.com
就为我们做到了这一点. 我们在浏览器里输入google.com
, DNS(Domain Name System)开始起作用, 并将URL
解析为合适的ip
地址
下面几点总结了DNS
服务器工作的步骤:
检查浏览器缓存
浏览器会在一定时间内保存DNS
缓存记录, 所以,DNS
查询第一步就是来到这里检查操作系统缓存
如果浏览器没有缓存记录, 就看操作系统是否保存了最近的DNS
查询缓存路由缓存
如果上面步骤都没有获取到DNS
记录, 那么将会查看路由是否有缓存ISP
缓存
如果所有步骤都失败, 那么就会去ISP
寻找. 首先, 将会在ISP
缓存中找, 如果没找到,ISP
的DNS
的递归查找将起作用. 像Google
这样的网站, 通过DNS
查找到正确的ip
地址是一个极其复杂的过程.
Step 4. 浏览器建立一个和服务器的TCP
连接
Step 5. 浏览器想服务器发送一个HTTP
请求
浏览器根据HTTP
协议向服务器发送一个GET
请求
GET http://google.com/ HTTP/1.1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:29.0) Gecko/20100101 Firefox/29.0
Accept-Encoding: gzip, deflate
Connection: Keep-Alive
Host: google.com
Cookie: datr=1265876274-[...]; locale=en_US; lsd=WW[...]; c_user=2101[...]
浏览器以请求头的形式向URL
关联的服务器发送一些元信息. User-Agent
描述了浏览器的属性, Accept-Encoding
描述了可以接收的响应的类型.Connection
告诉服务器保持已经建立的TCP
连接. 请求也包含Cookies
, 这是保存在客户端的一些元信息, 它包含了之前浏览同一个站点的session
信息, 这些session
信息以键值对的形式保存. 例如: 登录Google
的用户名.
Step 6. 服务器处理请求
浏览器包装的HTTP
请求被服务器上运行的特殊程序所处理, 常见的服务器有Apache
和IIS
等. web
服务器把这些请求转给合适的请求处理者处理
例如URL
-http://edusagar.com/index.php
被一个在PHP
文件(index.php)
写入的程序所处理. 一旦GET
请求被接收, Apache
服务器部署了执行index.php
文件的环境. 然后, 这个php
程序将会产生一个响应-在本例中是一个HTML
响应. 这个响应会根据HTTP
协议被返回给浏览器.
Step 7. 浏览器收到HTTP
响应
HTTP/1.1 200 OK
Cache-Control: private, no-store, no-cache, must-revalidate, post-check=0, pre-check=0
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Pragma: no-cache
Content-Encoding: gzip
Content-Type: text/html; charset=utf-8
Connection: Keep-Alive
Content-length: 1215
Date: Fri, 30 May 2014 08:10:15 GMT
.........................
HTTP
响应会标明服务器返回的状态码:
1xx 信息消息
2xx 响应成功
3xx 定位到其他URL
4xx 客户端错误
5xx 服务端错误
服务端设定多种其他的响应头帮助浏览器渲染合适的内容, Content-Typ
告诉浏览器显示何种类型的内容. Content-length
表明响应的字节数. 根据Content-Encoding
, 浏览器可以解析响应体的数据
Step 8. 浏览器显示HTML
内容
Rendering of html content is also done in phases.
渲染HTML
内容也在这个阶段完成
浏览器先渲染HTML
的初略的框架, 然后发送多个GET
请求去获取其他内容. 例如: 如果一个HTML
响应包含一张图片的标签, 浏览器将发送一个
HTTP
的GET
请求到服务器去获取这张图片. 这个过程又会把整个流程再走一遍, 但其实情况并没那么糟, 图片, JS
, CSS
文件等, 这些静态文件将被浏览器缓存, 下次就不用再去从服务器获取了.
Step 9. 客户端与服务器的交互
一旦HTML
页面被加载, 用户就有多种途径和服务器交互. 例如, 他可以填写一个登录表单登录网站, 这同样需要走上述的流程, 唯一的区别是这个HTTP
请求是POST
而不是GET
, 服务器将发送表单数据到服务器去处理(本例中是用户名和密码)
一旦服务器给用户授权, 它将会发送合适的HTML
内容(可能是用户的资料)返回给浏览器, 隐忍用户可以在登录请求处理之后看到新的页面
Step 10 AJAX
查询
另一种客户端与服务器的交互是通过AJAX(Asynchronous JavaScript And XML)]
请求, 这是一个异步的GET/POST
请求, 服务器可以通过多种途径返回响应json
,xml
,html
等, AJAX
请求不阻塞当前的页面, 而是在后台线程运行, 正因如此, 可以动态地通过发起AJAX
请求去修改web
页面.
希望本文能够对文章标题所提出的问题给予读者一点提示
What happens when you type a URL in browser