网络浏览器的工作原理 - 导航（第 1 部分，附插图）⚙️💥

Browsers（也称为web browsers或Internet browsers）是安装在我们设备上的软件应用程序，允许我们访问万维网。您在阅读本文时实际上正在使用一个这样的应用程序。

目前使用的浏览器有很多，截至 2021 年，使用最多的浏览器是：Google Chrome、、和。Apple's SafariMicrosoft EdgeFirefox

但是它们实际上是如何工作的？从我们在地址栏中输入网址到我们尝试访问的页面显示在屏幕上，这期间发生了什么？

对此的一个过于简化的版本是：

when we request a web page from a particular website, the browser retrieves the necessary content from a web server and then displays the page on our device.

很简单，对吧？没错，但这个看似超级简单的过程背后还有更多内容。在本系列文章中，我们将讨论navigation、fetching the data和步骤，希望能让您更清楚地理解这些概念。parsingrendering

1.导航

导航是网页加载的第一步。它指的是用户通过、等方式访问网页时发生的is requesting过程。clicking on a linkwriting a web address in the browser's address barsubmitting a form

DNS 查找（解析网址）

导航到网页的第一步是找到该页面的资源文件（HTML、CSS、JavaScript 和其他类型的文件）所在的位置。如果我们导航到https://example.com，该 HTML 页面位于 IP 地址为 93.184.216.34 的服务器上（对我们来说，网站是 IP 地址，domain names但对计算机来说，它们是IP adressesIP 地址）。如果我们之前从未访问过该网站，则必须进行域名系统 (DNS) 查找。

DNS servers are computer servers that contain a database of public IP addresses and their associated hostnames (this is commonly compared to a phonebook in that people's names are associated to a particular phone number). In most cases these servers serve to resolve or translate those names to IP addresses as requested (right now there are over 600 different DNS root servers distributed across the world).

因此，当我们请求一个时DNS lookup，我们实际上做的是查询其中一个服务器，并请求找出哪个IP address服务器与该名称对应https://example.com。如果找到相应的 IP，则返回该 IP。如果发生某些情况导致查找失败，我们会在浏览器中看到某种错误消息。

初次查找之后，IP 地址可能会被缓存一段时间，因此下次访问同一网站时速度会更快，因为不需要进行 DNS 查找（请记住，DNS 查找仅在我们第一次访问网站时发生）。

TCP（传输控制协议）握手

一旦 Web 浏览器知道了网站的 IP 地址，它就会尝试通过TCP three-way handshake（也称为SYN-SYN-ACK，或者更准确地说SYN, SYN-ACK, ACK，因为 TCP 传输了三条消息来协商并启动两台计算机之间的 TCP 会话）与持有资源的服务器建立连接。

TCP stands for Transmission Control Protocol, a communications standard that enables application programs and computing devices to exchange messages over a network. It is designed to send packets (of data) across the Internet and ensure the successful delivery of data and messages over networks.

The TCP Handshake is a mechanism designed so that two entities (in our case the browser and the server) that want to pass information back and forth to each other can negotiate the parameters of the connection before transmitting data.

因此，如果浏览器和服务器是两个人，他们之间的对话将是这样的：

浏览器SYNC向服务器发送消息，要求SYN同步（同步即连接）。

然后服务器将回复一条SYNC-ACK消息（SYNC同步和ACK确认）：

最后一步，浏览器会回复一条ACK消息。

现在已经通过建立了 TCP 连接（双向连接）3 way handshake，TLS negotiation可以开始了。

TLS 协商

对于通过 HTTPS 建立的安全连接，handshake还需要进行另一次握手（TLS 协商）。此握手（TLS 协商）确定将使用哪种密码来加密通信，验证服务器，并在开始实际数据传输之前确定已建立安全连接。

Transport Layer Security (TLS), the successor of the now-deprecated Secure Sockets Layer (SSL), is a cryptographic protocol designed to provide communications security over a computer network. The protocol is widely used in applications such as email and instant messaging but its use in securing HTTPS remains the most publicly visible. Since applications can communicate either with or without TLS (or SSL), it is necessary for the client (browser) to request that the server sets up a TLS connection.

在此步骤中，浏览器和服务器之间会交换更多消息。

客户端说你好。浏览器向服务器发送一条消息，其中包含它支持的 TLS 版本和密码套件，以及一串称为的随机字节client random。
服务器 hello 消息和证书。服务器发回一条消息，其中包含服务器的 SSL 证书、服务器选择的密码套件以及server random服务器生成的另一个随机字节字符串。
身份验证。浏览器会向颁发证书的证书颁发机构验证服务器的 SSL 证书。这样，浏览器就可以确保服务器的身份与证书上声明的一致。
预主密钥。浏览器会发送另一个随机字节串，称为premaster secret，该字符串使用加密，public key浏览器会从SSL certificate服务器获取该。premaster secret只有服务器使用私钥才能解密。
已使用私钥。服务器解密premaster secret。
会话密钥已创建。浏览器和服务器根据客户端随机数、服务器随机数和预主密钥生成会话密钥。
客户端完成。浏览器向服务器发送一条消息，表示客户端已完成。
服务器已完成。服务器向浏览器发送一条消息，表明它也已完成。
实现安全对称加密。握手已完成，可以使用会话密钥继续通信。

现在可以开始从服务器请求和接收数据。

参考资料：

文章来源：https://dev.to/arikaturika/how-web-browsers-work-part-1-with-illustrations-1nid