Web应用安全性: 浏览器是如何工作的

发布时间：2019-03-05 12:21 所属栏目：21 来源：前端小智

导读：这本系列的第一篇，先解释浏览器的功能以及执行方式。由于大多数客户将通过浏览器与 web 应用程序进行交互，因此必须了解这些出色程序的基础知识。浏览器是一个渲染引擎，它的工作是下载一个web页面，并以人类能够理解的方式渲染它。虽然这几乎是一种过

Web应用安全性: 浏览器是如何工作的

这本系列的第一篇，先解释浏览器的功能以及执行方式。由于大多数客户将通过浏览器与 web 应用程序进行交互，因此必须了解这些出色程序的基础知识。

浏览器是一个渲染引擎，它的工作是下载一个web页面，并以人类能够理解的方式渲染它。

虽然这几乎是一种过于简单的过分简化，但我们现在需要知道的全部内容。

用户在浏览器栏中输入一个地址。
浏览器从该 URL 下载“文档”并渲染它。

你可能习惯使用 Chrome，Firefox，Edge或Safari等流行的浏览器之一，但这并不意味着没有不同的浏览器。

例如，lynx 是一种轻量级的、基于文本的浏览器，可以在命令行中工作。lynx 的核心原理与其他“主流”浏览器的原理完全相同。用户输入 web 地址(URL)，浏览器获取文档并呈现它——唯一的区别是 lynx 不使用可视化渲染引擎，而是使用基于文本的界面，这使得像谷歌这样的网站看起来像这样:

我们大致了解浏览器的功能，但是让我们仔细看看这些机智的应用程序为我们所做的步骤。

浏览器做了什么?

长话短说，浏览器的工作主要包括:

DNS 解析
HTTP 交换
渲染
重复以下步骤

DNS 解析

这个过程确保一旦用户输入 URL，浏览器就知道它必须连接到哪个服务器。浏览器联系 DNS 服务器，发现google.com 翻译成 216.58.207.110，这是一个浏览器可以连接的 IP 地址。

HTTP 交换

一旦浏览器确定了哪个服务器将为我们的请求提供服务，它将启动与它的 TCP 连接并开始 HTTP 交换。这只是浏览器与服务器通信所需内容以及服务器回复的一种方式。

HTTP 只是用于在 Web 上进行通信协议的名称，而浏览器一般通过 HTTP 与服务器进行通信。 HTTP 交换涉及客户端（我们的浏览器）发送请求，服务器回复响应。

例如，当浏览器成功连接到 google.com 背后的服务器后，它将发送一个如下所示的请求:

GET / HTTP/1.1  
Host: google.com  
Accept: */*

让我们一行一行地把请求分解:

GET / HTTP/1.1:在第一行中，并补充说其余请求将遵循 HTTP/1.1 协议（它也可以使用1.0或2）
Host: google.com：这是 HTTP/1.1 中唯一必须的 HTTP 报头。因为服务器可能服务多个域(google.com, google.co.uk) 。这里的客户端提到请求是针对特定的主机的。
Accept: */*：一个可选的标头，其中浏览器告诉服务器接受任何类型的响应。服务器可以拥有 JSON、XM L或HTML 格式的可用资源，因此它可以选择自己喜欢的格式。

作为客户端的浏览器发送请求之后，就轮到服务器进行响应了，这是响应的格式如下:

HTTP/1.1 200 OK  
Cache-Control: private, max-age=0  
Content-Type: text/html; charset=ISO-8859-1  
Server: gws  
X-XSS-Protection: 1; mode=block  
X-Frame-Options: SAMEORIGIN  
Set-Cookie: NID=1234; expires=Fri, 18-Jan-2019 18:25:04 GMT; path=/; domain=.google.com; HttpOnly  
<!doctype html><html">  
...  
...  
</html>

哇，有很多信息需要消化。服务器让我们知道请求是成功的(200 OK)，并向响应中添加一些头部信息，例如，它告知哪个服务器处理了我们的请求(Server:gws)，该响应的 X-XSS-Protection 策略是什么，等等。

现在，你不需要理解响应中的每一行，在本系列后面的文章中，我们将介绍 HTTP 协议及其头部等内容。

现在，你只需要了解客户端和服务器正在交换信息，并且它们是通过 HTTP 进行交换的。

渲染

<!doctype html><html">  
...  
...  
</html>

在响应的主体中，服务器根据 Content-Type 头包括响应类型来表示。在我们的例子中，内容类型设置为 text/ html，因此我们期待响应中的 HTML 标记 - 这正是我们在正文中找到的。

这才是浏览器真正的亮点所在。它解析 HTML，加载标记中包含的额外资源(例如，可能需要获取JavaScript文件或CSS文档)，并尽快将它们呈现给用户。

最终的结果是普通人能够理解的：

如果想要更详细地了解当我们在浏览器地址栏中按回车键时会发生什么，建议阅读“What happens when…”，这是一个非常精细的尝试来解释该过程背后的机制。

（编辑：ASP站长网）