1.2. Что такое веб-сервер и протоколы

Начнём с самого общего, с интернета.

Интернет — это открытая сеть, к ней может присоединиться любое устройство, если оно соблюдает правила игры. Такие устройства ещё называются сетевыми. В сети правила известны как протоколы. Они определяют, как каждое устройство должно взаимодействовать друг с другом. Именно поэтому курс называется «Протоколы и сети: основы»: мы будем изучать эти правила и учиться работать с ними.

Интернет позволяет устройствам связываться друг с другом. Неважно, для отправки сообщений электронной почты, загрузки файлов или для использования веб-сайтов.

Прототип интернета создавал Поль Баран (Paul Baran) в 70-е годы прошлого века. Он реализовал коммуникацию между сетями, которая продолжала бы действовать даже после ядерной атаки. Эта сеть и стала прототипом интернета, она связывает устройства вне зависимости от экономических, политических, социальных или военных условий.

Каждый протокол определяет правила выполнения конкретных задач. К примеру, HTTP (Hyper Text Transfer Protocol) даёт возможность просматривать веб-страницы и файлы в интернете, а SSH (Secure Shell) используется для защищённого удалённого доступа к ОС. Для работы с каждым протоколом предназначено своё программное обеспечение. Например, для протокола HTTP это браузер.

Для создания глобальной сети требуются:

• Провода и беспроводная связь — физические соединения между устройствами.
• IP — протокол, который идентифицирует устройства с помощью IP-адресов и предоставляет стратегию маршрутизации (то есть маршрута) для отправки данных на IP-адрес получателя.
• TCP/UDP — протоколы, которые могут передавать пакеты данных от одного устройства к другому и при этом проверять наличие ошибок.
• TLS — безопасный протокол для отправки зашифрованных данных, чтобы злоумышленники не могли просматривать личную информацию.
• HTTP и DNS — протоколы, управляющие Всемирной паутиной, которые браузер использует каждый раз, когда вы загружаете веб-страницу. DNS переводит IP-адрес в понятное для людей доменное имя.

В курсе мы рассмотрим эти технологии подробно, а пока познакомимся с основными моментами.

HTTP

HTTP — это протокол, работающий в формате запрос-ответ с двумя участниками общения:

• клиент (формирует запросы, обрабатывает ответы);
• сервер (обрабатывает запросы, формирует ответы).

Такое клиент-серверное приложение называется веб-приложением. В нём клиентом выступает браузер, а сервером — веб-сервер. Веб-сервер пересылает браузеру набор текстовых файлов. Браузер реализует клиентскую часть — пользовательский интерфейс, а также формирует запросы к серверу и обрабатывает ответы от него.

Клиентом называют любое устройство, с помощью которого пользователь управляет веб-приложением. Это может быть компьютер, мобильный телефон, смарт-часы или сенсорный экран в электромобиле. На этом курсе в качестве клиента мы будем рассматривать обычный браузер.

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

Веб-сервер предоставляет хостинг-компания. Также мы можем установить программу на сервер сами. Ещё веб-сервер можно установить на компьютере локально. Локальный сервер — это эмулятор хостинга. Он нужен для создания сайта на своём компьютере, чтобы в дальнейшем перенести его на хостинг. Локальный сервер открывается по адресу http://127.0.0.1/Проект/ или http://localhost/Проект/.

Вопрос: http://127.0.0.1 и http://localhost одинаковы?

Ответ: на большинстве компьютеров localhost и http://127.0.0.1 функционально одинаковы. Но localhost — это метка для IP-адреса, а не сам адрес, то есть зарезервированное доменное имя для частных IP-адресов. Localhost на самом деле может указывать на разные IP-адреса.

Порой локальный сервер не нужен для создания сайта. Речь идёт о случаях, когда в проекте есть только файлы HTML, CSS и JS, которые просто меняются через текстовый редактор и открываются в браузере. Веб-сервер нужен для работы с препроцессорами, менеджерами задач, CMS, а также при работе с базой данных или для бэкенда.

Общение с сервером можно представить как общение с технической службой поддержки:

• звучит звонок клиента = формируется запрос клиента (браузера);
• клиент знает, куда звонить = клиент знает, где сервер;
• поднимается трубка = устанавливается соединение;
• оператор слушает клиента = сервер обрабатывает запрос.

Представим, что взаимодействие состоит из одного вопроса клиента и одного ответа сервера. Как только оператор ответит, он положит трубку и будет ждать другой звонок — другой запрос.

Современные серверы обрабатывают нескольких клиентов одновременно, как если бы у оператора было много телефонов, на которые он умеет одновременно отвечать.

У запроса есть заголовки, то есть дополнительная системная информация Зачем они нужны? Они могут передать какую-либо информацию. Например, когда пользователь скачивает фильм, то можно показать оставшееся время загрузки, объём файла, длину воспроизведения, формат — всё это поможет визуализировать прогресс.

Такая служебная информация добавляется протоколами. Это мы будем рассматривать в следующих статьях.

Поскольку сервер и клиент могут быть написаны на разных языках, именно заголовки используются как «служебная информация», помогающая им понять друг друга. Также в этом помогают порты. Технически номер порта — это просто цифры в определённом месте данных, приходящих на сервер.

Представим порты как двери из фильма «Матрица: Перезагрузка». Данные попадают в коридор с множеством дверей. Некоторые двери закрыты, некоторые — открыты. Обычно дверь 80 открыта (порт 80). Браузер об этом знает и по умолчанию идёт туда. Когда вы открываете страницу сайта, скорее всего, браузер зашёл в порт 80. Браузер это знает и даже не дописывает в адресную строку.

Посмотрим, что происходит, когда пользователь загружает страницу.

Если вы напечатаете в адресной строке браузера https://htmlacademy.ru/courses и нажмёте клавишу Enter, то откроется страница с курсами.

На самом базовом уровне произошло следующее: браузер сформировал подключение к веб-серверу, отправил запрос на получение веб-страницы и получил её.

Теперь немного подробнее. URL состоит из трёх частей:

• протокола — https;
• имени сервера — www.htmlacademy.ru;
• адреса страницы — courses.

Браузер обращается к серверу доменных имён DNS, чтобы перевести имя сайта www.htmlacademy.ru в IP-адрес, который он использует для подключения к серверной машине. Браузер соединяется с веб-сервером по указанному IP-адресу. То есть DNS был создан для того, чтобы нам не нужно было запоминать адрес сайта как IP-номер, это неудобно. Поэтому мы можем ввести в браузерную строку www.htmlacademy.ru, а не 172.67.180.49.

А где же порт? На самом деле порт тоже есть, просто он не указан, и для протокола https используется порт по умолчанию — 443. То есть URL-адрес на самом деле выглядит так: https://htmlacademy.ru:443/courses.

Вопрос: а почему до этого был 80, а для https//: 443?

Ответ: некоторые порты зарезервированы для стандартных сетевых сервисов. Например, для HTTP это порт 80, для HTTPS — 443, для FTP — 21. То есть запросы, пришедшие на 80 порт, передаются HTTP, а на 443 порт — HTTPS. Попробуйте открыть URL с указанным портом 443: https://htmlacademy.ru:443/courses. Вас перенаправит на https://htmlacademy.ru/courses. Это означает, что использовался порт 443.

Далее, следуя протоколу HTTPS, который мы будем подробно разбирать в третьем разделе, браузер отправляет запрос на сервер, запрашивая файл https://htmlacademy.ru/courses. В ответ сервер генерирует динамическую веб-страницу и отправляет обратно HTML-текст для отображения этой страницы в браузере. Браузер читает HTML-теги и формирует вывод веб-страницы на экране.

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

Посмотрим подробнее на примере с почтой. Письмо — это пакет данных. Отправитель и получатель — это сетевые устройства. Чтобы почта могла понять, куда отправить письмо, мы должны знать адрес получателя и предоставить данные о своём адресе.

В примере с почтой протокол может определять, что у адреса должно быть название латиницей, название, разделённое символом @, и указание почтового домена. Ещё один протокол может сообщить нам, что обязательно нужно указать получателя, тему письма, само письмо и не более 200 МБ прикреплённых файлов. Примечание: эти правила указаны только для примера.

Протоколы нужны для уменьшения хаоса в сети.

Подобных правил намного больше. Существует более 60 тысяч протоколов. К счастью, все знать не нужно — только основные. Их мы рассмотрим в этом курсе.

Существует множество разных протоколов, каждый из которых имеет свои особенности. Протоколы разрабатывают несколько фирм, поэтому неудивительно, что каждая из них создаёт свой собственный стек (набор) протоколов. Хотя эти стеки по умолчанию между собой несовместимы, существуют дополнительные протоколы, являющиеся мостами между ними. Это позволяет использовать несколько несовместимых между собой протоколов.

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

Маршрутизатор — это одна из точек на пути передачи данных, которые передаются по маршруту.

Наибольшую популярность приобрёл такой стек протоколов, как TCP/IP, его мы рассмотрим в следующей статье.

Маршрут передачи данных

Давайте разберёмся, по какому маршруту передаются данные. Представим самую простую компьютерную сеть — из двух устройств.

В такой сети нужно беспокоиться только о том, как физически соединить устройства и как отправлять данные в формате, который они оба понимают.

Добавим ещё одно устройство.

Появилась дополнительная сложность: как каждое устройство может узнать, входящие данные предназначены для него или для соседей? Для такой простой сети нужна схема адресации.

Перейдём к шести устройствам. На самом деле существует множество способов соединить шесть устройств в компьютерную сеть:

Здесь нужна не только схема адресации, но и маршрутизации, то есть по какому маршруту будут передаваться данные. Когда сети становятся больше, стратегии маршрутизации становятся более важными. Разница между двумя остановками и трёмя остановками в пути небольшая. Но в сети тысячи таких остановок, поэтому имеет значение, будет 20 остановок или 400.

Маршрутизация — важная составляющая работы сети. Существуют даже специальные устройства — маршрутизаторы. Наиболее известный разработчикам протокол — это IP (Internet Protocol). Он позволяет переправить пакеты от одного сетевого устройства к другому.

Термин «пропускная способность» используется для описания максимальной скорости передачи данных в системе. Данные передаются в битах. Если сетевое соединение имеет пропускную способность 100 Мбит/с, это означает, что он не может передавать больше, чем 100 Мбит в секунду.

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

Скорость интернета — это сочетание пропускной способности и задержки. Компьютеры разбивают сообщения на пакеты. Даже если компьютер находится в соединении с высокой пропускной способностью, его скорость отправки и получения сообщений всё равно будет ограничиваться задержкой соединения.

Фронтенд-разработчик может влиять на пропускную способность и на задержку соединения. Зная весь маршрут, он может находить «узкие места» в рамках своей части работы и ускорять приложение.

Вы можете измерить текущую скорость сети, используя тест скорости интернета: веб-сайт, который загружает и выгружает данные, отслеживая, насколько быстро они передаются. Скорость скачивания обычно выше, чем скорость загрузки, так как пользователь скачивает больше данных (веб-страницы, файлы и другое), чем загружает (отправка данных форм, обновление фото профиля и другое).

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