Введение в архитектуру: Как работают клиент-серверное взаимодействие и протокол HTTP
Введение в архитектуру: Как работают клиент-серверное взаимодействие и протокол HTTP
Добро пожаловать в курс «Основы Back-end разработки: Фундамент серверной части». Если вы когда-либо задумывались, что происходит «под капотом», когда вы нажимаете кнопку «Войти» в любимом приложении или вводите адрес сайта в браузере, вы попали по адресу.
Эта статья — первая ступень в понимании того, как устроен интернет. Мы не будем сразу писать сложный код. Сначала нам нужно разобраться с правилами игры и архитектурой, на которой держится весь веб.
Что такое Back-end и Frontend?
Любое современное веб-приложение можно разделить на две большие части:
- Frontend (Клиентская часть) — это то, что видит пользователь. Красивые кнопки, анимации, формы ввода, текст и картинки. Это «лицо» сайта, которое работает в вашем браузере или смартфоне.
- Back-end (Серверная часть) — это «мозг» и «память» приложения. Это скрытая от глаз часть, которая обрабатывает данные, сохраняет их в базы данных, проводит платежи и отправляет письма.
Чтобы понять, как они взаимодействуют, давайте представим поход в ресторан.
Аналогия с рестораном
Представьте, что вы пришли поужинать.
- Вы (Клиент) — это пользователь с браузером (Frontend). Вы сидите за столиком и смотрите в меню.
- Кухня (Сервер) — это Back-end. Там хранятся продукты (База Данных), там повара готовят блюда по рецептам (Логика приложения).
- Официант — это связующее звено. Вы не идете на кухню сами, чтобы пожарить стейк. Вы даете заказ официанту, он несет его на кухню, ждет готовности и приносит вам еду.
В мире веба роль официанта выполняет протокол HTTP.
Клиент-серверная архитектура
В основе большинства веб-приложений лежит клиент-серверная архитектура. Это модель взаимодействия, где обязанности строго разделены.
Кто такой Клиент?
Клиент — это инициатор общения. Это программа, которая отправляет запрос. Чаще всего это:
- Веб-браузер (Chrome, Safari, Firefox).
- Мобильное приложение (Instagram, Telegram на вашем телефоне).
- Другие серверы (да, серверы тоже могут быть клиентами друг для друга).
Кто такой Сервер?
Сервер — это мощный компьютер (или программа), который постоянно включен и ждет запросов от клиентов. Его задачи:
- Принять запрос.
- Понять, что от него хотят.
- Выполнить действие (найти информацию, сохранить данные, посчитать что-то).
- Отправить ответ обратно клиенту.
Протокол HTTP: Язык общения
Чтобы клиент и сервер понимали друг друга, они должны говорить на одном языке. Этот язык называется HTTP (HyperText Transfer Protocol — протокол передачи гипертекста).
HTTP — это набор правил, определяющий, как должны выглядеть сообщения (запросы и ответы). Это текстовый протокол, что означает, что все данные передаются в виде текста, который (при желании) можно прочитать глазами.
Жизненный цикл: Запрос и Ответ
Все общение в HTTP строится по схеме Request-Response (Запрос-Ответ).
- Клиент формирует HTTP-запрос (Request) и отправляет его серверу.
- Сервер обрабатывает запрос.
- Сервер отправляет HTTP-ответ (Response).
Важно понимать: HTTP — это протокол без сохранения состояния (stateless). Это значит, что сервер не помнит вас между двумя разными запросами. Каждый запрос для него — как новый. Если вы хотите, чтобы сервер вас «узнал» (например, чтобы не вводить пароль каждый раз), используются дополнительные механизмы (cookies и сессии), о которых мы поговорим в следующих статьях.
Анатомия HTTP-запроса (Request)
Когда браузер обращается к серверу, он отправляет «письмо» определенного формата. Давайте разберем, из чего оно состоит.
Запрос состоит из трех основных частей:
- Стартовая строка (Method + URL).
- Заголовки (Headers).
- Тело запроса (Body) — необязательно.
1. Метод и URL
URL (Uniform Resource Locator) — это адрес, куда мы стучимся. Например, https://google.com/search.
Метод — это глагол, который говорит серверу, что мы хотим сделать. Самые популярные методы:
| Метод | Описание | Пример из жизни | Аналогия с рестораном |
|---|---|---|---|
| GET | Получить данные. Ничего не менять на сервере. | Открыть статью, загрузить картинку. | Попросить меню. |
| POST | Отправить новые данные для создания ресурса. | Регистрация, отправка комментария. | Сделать заказ. |
| PUT | Полностью обновить существующие данные. | Изменить информацию в профиле. | Попросить заменить блюдо. |
| DELETE | Удалить данные. | Удалить пост или фото. | Отменить заказ. |
2. Заголовки (Headers)
Заголовки — это служебная информация, «метаданные». Они не видны пользователю на странице, но критически важны для браузера и сервера. Они выглядят как список Ключ: Значение.
Примеры заголовков запроса:
User-Agent: Mozilla/5.0...— «Привет, я браузер Chrome на Windows».Accept-Language: ru-RU— «Я предпочитаю контент на русском языке».Content-Type: application/json— «Я отправляю тебе данные в формате JSON».
3. Тело (Body)
Тело запроса нужно, когда мы передаем данные на сервер (например, при методе POST). Если вы заполняете форму регистрации, то ваши логин и пароль полетят именно в теле запроса. У метода GET тела обычно нет.
Анатомия HTTP-ответа (Response)
Сервер получил запрос, поработал и отправляет ответ. Ответ тоже имеет строгую структуру:
- Стартовая строка (Версия HTTP + Код состояния).
- Заголовки (Headers).
- Тело ответа (Body).
Коды состояния (Status Codes)
Это трехзначные числа, которые сообщают результат операции. Вы наверняка видели 404. Коды делятся на классы:
- 1xx (Информационные): «Я получил запрос, продолжаю процесс».
- 2xx (Успех): Все прошло хорошо.
200 OK— Самый частый ответ. «Вот твои данные».201 Created— «Я успешно создал то, что ты просил».
- 3xx (Перенаправление): «Ресурс переехал, иди по другому адресу».
301 Moved Permanently— Постоянный переезд.
- 4xx (Ошибка клиента): Вы (клиент) сделали что-то не так.
400 Bad Request— «Я не понял твой запрос».401 Unauthorized— «Ты кто? Войди в систему».404 Not Found— «Такой страницы не существует».
- 5xx (Ошибка сервера): Клиент молодец, но сервер сломался.
500 Internal Server Error— «У меня что-то упало внутри, прости».502 Bad Gateway— Проблема связи между серверами.
Тело ответа
Это то, ради чего все затевалось. Если вы запрашивали веб-страницу, в теле придет HTML-код. Если вы запрашивали картинку — придет бинарный код картинки. Если данные для приложения — придет JSON.
Пример реального взаимодействия
Давайте соберем все вместе. Вы вводите в браузере habr.com и нажимаете Enter.
- Браузер (Клиент) формирует запрос:
GET / HTTP/1.1 Host: habr.com User-Agent: Chrome/90.0 Accept: text/html - Запрос летит через интернет к Серверу Habr.
- Сервер видит метод
GETи понимает, что нужно отдать главную страницу. - Сервер формирует ответ:
HTTP/1.1 200 OK Content-Type: text/html; charset=utf-8 Server: nginx <!DOCTYPE html> <html> <head>...</head> <body>...</body> </html> - Браузер получает код
200 OK, читает HTML из тела ответа и рисует вам страницу.
Заключение
Сегодня мы заложили первый камень в фундамент вашего понимания Back-end разработки. Мы выяснили, что:
- Веб работает по модели Клиент-Сервер.
- Общение происходит через протокол HTTP.
- Клиент отправляет Запросы (Requests), а сервер шлет Ответы (Responses).
- У каждого запроса есть Метод (цель), а у ответа — Код состояния (результат).
В следующей статье мы углубимся в то, как именно сервер обрабатывает эти запросы, что такое веб-сервер и как начать писать свой первый код.