Это серия из нескольких частей, в которой объясняется, как браузер работает внутри. Для простоты мы не будем углубляться в то, что происходит на аппаратном уровне. Вы можете прочитать предыдущую часть здесь.



Как работает браузер — Часть — 1
Что происходит, когда вы вводите google.com в браузере и нажимаете Enter?medium.com



До сих пор мы видели, как браузер получает IP-адрес веб-сайта. Используя IP-адрес, браузер может установить соединение с этим веб-сайтом через Интернет. Несмотря на то, что мы набираем google.com в строке поиска, браузер добавил протокол HTTPS, как мы видели в части 1. По умолчанию браузер отправляет запрос GET на URL-адрес. И URL-адреса также имеют номер порта, который указывает, к какому порту подключаться на сервере. Порт по умолчанию для веб-сайтов на основе HTTP — 80, а HTTPS — 443. Таким образом, google.com теперь за кулисами преобразуется в следующее:

GET https://google.com:443

Поскольку браузеры могут подключаться только с IP-адресом, браузер отправляет следующий запрос для получения веб-сайта Google (при условии, что 216.58.206.142 — это IP-адрес сервера Google):

GET https://216.58.206.142:443

Для простоты мы пропустим внутренние детали того, как браузер делает запрос на подключение к указанному выше IP-адресу, взаимодействуя с ОС и уровнем TCP на машине. Если вам интересно узнать об этом больше, это — прекрасное письмо на эту тему.

Чтобы лучше понять, что происходит в браузере, нам нужно знать, как работает сервер.

Сервер — это не что иное, как машина, на которой работает специальное программное обеспечение, которое может принимать входящие запросы и отвечать на эти запросы. Некоторыми из известных серверных программ являются Apache, Nginx для машин на базе Linux и IIS для машин на базе Windows. На серверах работает служба HTTPD (HTTP Daemon), которая может принимать входящие запросы. Когда сервер получает входящее соединение, он получает следующие данные

  1. Какой метод HTTP используется? В нашем примере мы пытаемся получить доступ к google.com из нашего браузера. Так что это будет запрос GET
  2. Какой запрашиваемый домен? В нашем примере это google.com. Сервер проверяет наличие виртуального хоста, настроенного на компьютере, который соответствует google.com.
  3. Какой запрашиваемый порт? 443 используется по умолчанию для веб-сайтов на основе HTTPS. Сервер проверяет, может ли он отвечать на запросы, поступающие на этот порт.
  4. Какой запрашиваемый путь? Если мы явно не запрашиваем какой-либо путь в URL-адресе (например, https://medium.com/til-js — здесь /til-js — это путь), путь по умолчанию /. Сервер проверяет, какой файл обслуживать, когда запрашивается /. Обычно это будет index.html. Это также может быть index.asp или index.php в зависимости от используемого вами сервера. В нашем примере предположим, что сервер Google настроен на обслуживание index.html по пути /.

Сервер передает запрос обратно в браузер, который содержит index.html, а также отправляет код ответа. Код обычно равен 200, если запрос выполнен успешно на стороне сервера. Браузер получает ответ по протоколу HTTP и сначала проверяет код состояния. Поскольку код состояния равен 200, браузер начинает анализировать входящий файл index.html. Прежде чем мы поймем, как HTML-файл отображается в браузере, давайте сделаем небольшое отступление, чтобы узнать больше о коде состояния HTTP, который сервер отправляет обратно в браузер.

Если путь или ресурс не найдены, сервер отвечает кодом состояния HTTP 404. Это может произойти, когда вы пытаетесь получить доступ к действительно старой странице на сервере, которого сейчас нет, или к пути, который не существует в сервер. В этих случаях вместо простой отправки кода состояния 404 серверы также отправляют HTML-страницу. Здесь компании проявляют творческий подход. Например, страница 404 медиума выглядит так:

Некоторые другие распространенные коды состояния, отправляемые серверами:

301 — Перенаправление. Это означает, что ресурс был навсегда перемещен в новое место. Новое местоположение также отправляется в ответ, чтобы браузер мог его использовать.

403 — Запрещено. Это означает, что сервер понял запрос от браузера. Но он не может отправить ответ, поскольку пользователь не авторизован для просмотра содержимого. Например, если вы попытаетесь просмотреть страницу, которая находится за пределами входа в систему, не входя в систему на веб-сайте, вы можете получить ошибку 403.

внутренняя ошибка сервера 500. Это означает, что с сервером возникла проблема, и он не может сейчас отправить ответ.

Как правило, ошибки 4XX означают, что проблема связана с запросом клиента (браузера), а 5XX означает, что проблема связана с сервером.

Итак, браузер отправил запрос на сервер. Сервер понял запрос и ответил файлом index.html. Браузер получил этот файл вместе с кодом успеха, который равен 200. В следующей части мы увидим, как браузер анализирует этот файл и показывает вам домашнюю страницу google.com. А пока оставайтесь любопытными и счастливого обучения!