Что происходит, когда вы загружаете сайт freecodecamp.com в свой браузер?

Понимание того, как работает веб, так же важно, как и освоение любого навыка работы в интернете. Пользователи видят веб-страницу, которая загружается в браузере, как только пользователь вводит URL, но в фоновом режиме происходит гораздо больше вещей, с которыми мы познакомимся в этой статье на примере загрузки сайта freecodecamp.com в браузер.

Все начинается с ввода URL сайта (freecodecamp.com) в браузер.

Браузер ищет IP-адрес доменного имени через DNS.

Компьютеры общаются друг с другом с помощью IP-адресов, но поскольку люди не могут запомнить тысячи строк цифр, мы используем доменные имена. Например, если мы хотим купить что-то на amazon, мы думаем об «amazon», а не о большой строке цифр.

DNS (Domain Name System) отвечает за преобразование доменных имен в соответствующие IP-адреса.

После ввода URL и нажатия клавиши Enter браузер ищет IP-адрес доменного имени (freecodecamp.com) через DNS. Это делается для того, чтобы мы могли получить IP-адрес сервера, с которым нам нужно установить соединение.

Браузер отправляет HTTP-запрос на сервер

Сервер поддерживает множество сервисов, таких как электронная почта, веб-страницы, чаты и т.д.
После того как браузер подключился к серверу, он отправляет HTTP-запрос на сервер для доступа к этим службам. HTTP-запрос содержит метод запроса, заголовки и тело.
Метод запроса — это метод, который выполняется на данном ресурсе. Примерами методов запроса являются GET, PUT, POST и т.д.

Теперь давайте рассмотрим, как выглядит HTTP-запрос.

  • URL запроса — это URL, который мы ввели в браузере.
  • Метод запроса установлен на GET, так как мы хотим получить
    эти веб-страницы с сервера

  • Удаленный адрес — это IP-адрес доменного имени, которое мы
    получили через DNS.

К IP-адресу прилагается целое число (443), которое называется номером PORT. Номер PORT 443 означает, что это защищенный запрос (HTTPS) для веб-страницы.

Когда инициируется HTTP-запрос, браузер создает заголовок запроса и отправляет его на сервер. Этот заголовок содержит всю необходимую информацию о запросе, например:

  • запрашиваемый URI
  • Метод запроса
  • Путь
  • Тип данных, которые принимает браузер (html, xml, текст и т.д.).

Сервер посылает ответ HTTP

Сервер обрабатывает запрос, создает ответ и отправляет его обратно клиенту:

  • Код состояния, который информирует клиента о статусе запроса
  • Заголовок ответа
  • Запрашиваемый ресурс

Код состояния ответа показывает, был ли успешно выполнен конкретный HTTP-запрос.

Коды статуса ответа сгруппированы в пять классов :

  • Информационные ответы (100-199)
  • Успешные ответы (200-299)
  • Сообщения о перенаправлении (300-399)
  • Ответы об ошибках клиента (400-499)
  • Ответы об ошибках сервера (500-599)

В нашем примере код состояния ответа, который мы получили в ответ, равен 301, что указывает на то, что запрошенный ресурс был перемещен на другой URL.

Этот новый URL указан в ключе location заголовка ответа — freecodecamp.org.

Теперь создается новый HTTP-запрос для freecodecamp.org и отправляется на сервер.

Код состояния ответа, который мы получаем, равен 200, что означает, что запрос прошел успешно.

Браузер начинает рендеринг HTML

Браузер отображает index.html, который мы получаем в качестве ответа из заголовка response.

Браузер посылает HTTP-запросы на дополнительные объекты, встроенные в HTML (изображения, css, JavaScript).

Вот и все! Наша веб-страница успешно загрузилась в браузере.

Оцените статью
Procodings.ru
Добавить комментарий