关于面试:当你在浏览器中输入网址后发生了什么

<article class=“article fmt article-content”><h2>当你在浏览器中输出网址后产生了什么?</h2><p>这是一个高频的前端面试题，这个问题能够考查面试者对互联网基本原理的理解，包含域名解析、HTTP申请、服务器响应等方面的常识。</p><h3>域名解析-IP寻址</h3><p>浏览器会向DNS服务器发送申请，将域名解析为对应的IP地址。</p><blockquote><p>什么是 DNS？</p><p>域名零碎 (Domain Name System)<br/>是互联网的一项服务。它作为将域名和IP地址互相映射的一个分布式数据库，可能使人更不便地拜访互联网。DNS应用TCP和UDP端口53。</p></blockquote><p>这个过程会从上面的缓存中查问DNS记录：</p><ul><li>浏览器缓存（浏览器缓存一段时间的DNS记录）</li><li>零碎缓存</li><li>路由器缓存</li><li>ISP DNS 缓存</li><li>ISP 递归查问</li></ul><h3>浏览器向指标服务器发送HTTP申请</h3><p>浏览器会向指标服务器发送HTTP申请，申请特定的资源，如HTML文件、图片、CSS文件等。</p><pre><code>GET http://facebook.com/ HTTP/1.1Accept: application/x-ms-application, image/jpeg, application/xaml+xml, […]User-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; […]Accept-Encoding: gzip, deflateConnection: Keep-AliveHost: facebook.comCookie: datr=1265876274-[…]; locale=en_US; lsd=WW[…]; c_user=2101[…]</code></pre><p>例如下面发送的HTTP申请应用的GET办法，蕴含了UA信息，Connection申请头通知服务器放弃TCP连贯关上，不便后续应用，还携带了Cookie。</p><h3>指标服务器响应</h3><p>服务器接管到申请后会解决并返回相应的资源，包含HTTP响应头和响应体。</p><p>这里波及到常见的Web服务器：IIS or Apache，Nginx。这些服务器软件会决定把哪些申请交给某些特定的服务解决（request handler）- 可能是由ASP.NET，PHP，Ruby，Golang，Node.js这些开发语言编写的服务端程序。</p><p>下面的服务读取http申请携带的参数，来获取或者更新存储在服务器上的数据。</p><h3>浏览器接管资源渲染页面</h3><pre><code>HTTP/1.1 200 OKCache-Control: private, no-store, no-cache, must-revalidate, post-check=0, pre-check=0Expires: Sat, 01 Jan 2000 00:00:00 GMTP3P: CP=“DSP LAW"Pragma: no-cacheContent-Encoding: gzipContent-Type: text/html; charset=utf-8X-Cnection: closeTransfer-Encoding: chunkedDate: Fri, 12 Feb 2010 09:05:55 GMT</code></pre><p>响应头Content-Type批示返回的文件类型为html，浏览器接管到服务器返回的数据后会解析并渲染页面，展现给用户。</p><h3>其余</h3><p>在页面加载过程中可能会波及到重定向、缓存、Cookie等其余操作。</p><h3>参考链接</h3><ul><li>https://www.cloudflare-cn.com/learning/dns/what-is-dns/</li></ul></article>