§5.2. Как работает веб
В главе «Форензика» мы уже говорили о том, как работает интернет. Но в интернете есть много различных протоколов. Сегодня мы ещё более детально поговорим о вебе — причём не только о протоколе HTTP, но и о данных, которые по нему передаются.
Кто такие клиент и сервер?
В протоколе HTTP общаются клиент и сервер. В качестве клиента, как правило, выступает программа, которую называют браузером. Браузер формирует HTTP-запросы и отображает полученный от сервера результат.
Сервер — это программа, которая читает пришедшие запросы, обрабатывает их и возвращает ответ. Например, если браузер прислал запрос GET /clients/1
, то сервер может взять из базы данных пользователя с номером 1, и отправить страницу с этими данными.
Как правило, браузер установлен на нашем компьютере, и мы можем видеть и контролировать всё, что он делает. Сервер же находится на каком-то удалённом компьютере, и мы не всегда можем посмотреть код, который там запущен, а тем более как-то повлиять на его работу.
Из чего состоят сайты
Как правило, в качестве ответа сервера отдают страницы, содержащие HTML-разметку (англ. hypertext markup language — язык гипертекстовой разметки). В них содержится контент, который необходимо отобразить. Пример простой HTML-страницы:
<!DOCTYPE html>
<!--
Вот так обозначаются комментарии. Они не будут видны
на странице, но их можно посмотреть в исходном коде.
Весь HTML состоит из тегов. Тег выглядит так: <html></html>.
Внутри тега могут быть данные: <p>Данные</p>.
У тега могут быть атрибуты: <a href="/test">Ссылка на test</a>.
Некоторые теги могут не иметь закрывающего: <br>.
Вот и всё.
-->
<html>
<head>
<meta charset="utf-8" />
<title>Simple Web Page</title>
</head>
<body>
<h1>Важная страница</h1>
<p>
Здесь какой-нибудь длинный текст про то,
почему страница такая важная.
</p>
</body>
</html>
В браузере эта страница будет выглядеть примерно так:
HTML сам по себе довольно прост, но ничего не умеет. На каждом сайте разные цвета, шрифты, размеры блоков и картинок — всё это нельзя сделать с помощью одной HTML-разметки. На помощь приходит CSS (англ. cascading stylesheets — каскадные таблицы стилей) — специальный язык для описания внешнего вида документа.
Например, если мы можем создать файл style.css
со следующим содержанием:
body {
background-color: darkgreen;
/*
color задаёт цвет текста.
Кстати, комментарии тут немного другие.
*/
color: lightblue;
text-align: center;
}
h1 {
/* Сначала попробовать Arial, а если его нет -
шрифт без засечек по умолчанию. */
font-family: Arial, sans-serif;
}
Подключим его на нашу страницу, добавив в <head>
тег <link rel="stylesheet" href="style.css" />
, и получим намного более красивую страницу:
Примечание
В HTML и CSS не бывает ошибок. Если в разметке будут незакрытые теги, неизвестные теги или атрибуты, браузер всё равно попытается это каким-либо образом отобразить. Возможно, результат будет не лучшим, но скорее всего весь контент отобразится.
Существует и третий важный элемент, без которого интернет не был бы таким удобным. Это JavaScript — специальный язык программирования для браузеров. Скрипты на этом языке выполняются прямо на вашем компьютере и позволяет добавить интерактивность в страницу — например, так можно отправлять сообщения без обновления всей страницы или ускорять проигрывание видеороликов. О нём мы ещё поговорим в этой главе.
Магия браузера
На самом деле, браузер не делает ничего сверхъестественного — мы можем делать HTTP-запросы вручную. Для этого мы можем воспользоваться утилитой curl
. Этот способ не такой удобный, но зато он даёт больше возможностей:
Флаг -v
позволит нам видеть заголовки как запроса, так и ответа. В запросе есть заголовок User-Agent
, в котором передаётся название браузера. Если сделать запрос на адрес http://httpbin.org/user-agent
, то сервер вернёт значение этого заголовка. Попробуйте открыть страницу из браузера и сделать запрос с помощью curl. Сравните результаты.
HTTP
Вернёмся к протоколу HTTP и углубимся в детали. Начнём с типа запроса — обычно его называют методом. Два основных метода, которые используются почти всегда — GET
и POST
. Однако, в некоторых случаях сервера обрабатывают и другие запросы:
Метод | Описание |
---|---|
GET | Получить данные с сервера |
POST | Передать данные на сервер |
OPTIONS | Какие методы поддерживаются сервером |
HEAD | Вернуть только заголовки от аналогичного GET-запроса |
PUT | Загрузить ресурс на сервер |
DELETE | Удалить ресурс с сервера |
Как правило, если сервер не может обработать запрос с требуемым методом, он возвращает ошибку 405 (Method Not Allowed — метод не поддерживается). Вы можете вручную отправлять запросы различных типов, указывая флаг -X
для curl:
Примечание
По соглашению для HTTP используется порт 80, а для HTTPS — 443. Но никто не запрещает владельцам сайтов использовать другие порты. Чтобы открыть сайт по нестандартному порту, указывают его номер через двоеточие:
http://example.org:8080/test.html
.
Адреса страниц — их ещё называют URL (англ. uniform resource location — унифицированное местоположение ресурса), состоят из нескольких частей.
Путь очень похож на путь к файлу в обычной файловой системе. Более того, некоторые серверы просто отдают всем пользователям одни и те же файлы (особенно, когда речь идёт о стилях и скриптах), и они действительно просто отправляют пользователю файл из указанной пользователем директории. При этом ..
и .
работают так же, как в консоли: если набрать http://example.com/folder/../file.html
, то браузер превратит это в http://example.com/file.html
. Однако, если отправить такой запрос вручную, и сервер обработает его некорректно, то он может отдать какие-то непубличные файлы. Об этом мы поговорим позднее.
Параметры (их ещё называют строкой запроса) задают, какую страницу нужно выбрать или по какому слову искать. Путь и параметры передаются в первой строке HTTP-запроса, например: GET /offers/search?query=Best&sort=down HTTP/1.1
.
Якорь не отправляется на сервер и используется только браузером. При его указании браузер прокрутит страницу в то место, где находится тег с такой меткой.
На URL есть и ограничения. Во-первых, набор символов в URL сильно ограничен. Для передачи кавычек, русских букв, пробелов и других символов используется кодировка urlencode, мы рассказывали о ней в главе «Криптография». Во-вторых, его длина не может превышать 2048 символов, иначе он может быть обработан некорректно. В случае, если на сервер нужно передать большое количество данных, используют методы, отличные от GET
, а сами данные передают после заголовков. Попробуйте сделать POST
-запрос с данными:
Выводы
По протоколу HTTP общаются клиент и сервер. Клиент — это обычно браузер, а сервер — специальная программа, доступ к которой мы не имеем.
Контент в интернете состоит из данных — они содержатся в HTML-разметке, стилей в формате CSS и скриптов на JavaScript.
Запросы можно делать вручную с помощью утилиты curl.
Адрес страницы называется URL и состоит из протокола, домена, порта, пути, строки запроса и якоря.
Путь страницы в URL работает так же, как путь в обычной файловой системе.