Из чего состоит структура HTTP-запроса

Структура HTTP-запроса

Четыре основные части

HTTP-запрос состоит из четырёх ключевых компонентов:

┌──────────────────────────────────┐
│      1. REQUEST LINE             │ ← Метод, URL, версия HTTP
├──────────────────────────────────┤
│      2. HEADERS                  │ ← Метаинформация
├──────────────────────────────────┤
│      (пустая строка)             │
├──────────────────────────────────┤
│      3. BODY                     │ ← Данные (опционально)
└──────────────────────────────────┘

1. Request Line (стартовая строка)

Первая строка HTTP-запроса содержит три элемента:

METHOD URL PROTOCOL/VERSION

Примеры:
GET /api/users HTTP/1.1
POST /api/login HTTP/1.1
PUT /api/users/123 HTTP/2
DELETE /api/posts/456 HTTP/1.1

Компоненты:

// METHOD — HTTP метод
GET      // Получить ресурс
POST     // Создать/отправить ресурс
PUT      // Полностью заменить ресурс
PATCH    // Частично обновить ресурс
DELETE   // Удалить ресурс
HEAD     // Получить только headers (без body)
OPTIONS  // Получить доступные методы
TRACE    // Трасировка запроса (редко)

// URL — целевой ресурс
/api/users           // Абсолютный путь
/api/users?page=1    // С query параметрами
/api/users/123       // Путь параметр
https://example.com  // Полный URL

// PROTOCOL/VERSION — версия HTTP
HTTP/1.0  // Старая версия
HTTP/1.1  // Современная, широко используется
HTTP/2    // Новая, с улучшениями
HTTP/3    // Самая новая (QUIC протокол)

2. Headers (заголовки)

Заголовки — это пары ключ-значение, содержащие метаинформацию о запросе:

Header-Name: Header-Value
Another-Header: Another-Value

// Конкретный пример
Host: example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64)
Content-Type: application/json
Content-Length: 256
Accept: */*
Accept-Encoding: gzip, deflate
Connection: keep-alive
Authorization: Bearer token123

Обязательные заголовки:

// Host — адрес сервера (ОБЯЗАТЕЛЕН в HTTP/1.1)
Host: api.example.com:8080

// User-Agent — информация о клиенте
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) 
            AppleWebKit/537.36 (KHTML, like Gecko) 
            Chrome/91.0.4472.124 Safari/537.36

// Content-Type — формат данных в body
Content-Type: application/json
Content-Type: application/x-www-form-urlencoded
Content-Type: multipart/form-data
Content-Type: text/plain

// Content-Length — размер body в байтах
Content-Length: 348

Оптиональные но частые:

// Accept — какие форматы ответа приемлет клиент
Accept: application/json
Accept: text/html,application/xhtml+xml,application/xml;q=0.9

// Accept-Encoding — какие сжатия поддерживает клиент
Accept-Encoding: gzip, deflate, br

// Authorization — учётные данные
Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...
Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=

// Cookie — cookies для сессии
Cookie: session_id=abc123; user_id=456

// Referer — откуда пришёл запрос
Referer: https://example.com/page

// Connection — управление соединением
Connection: keep-alive
Connection: close

// Cache-Control — кеширование
Cache-Control: no-cache
Cache-Control: max-age=3600

// User-Agent — браузер/клиент
User-Agent: Mozilla/5.0...

// X-* headers — пользовательские заголовки
X-Api-Key: secret-key-123
X-Request-ID: request-uuid-12345
X-Custom-Header: custom-value

3. Пустая строка

Обязательный разделитель между headers и body. Состоит из CRLF (\r\n):

Host: example.com\r\n
Content-Type: application/json\r\n
\r\n← Пустая строка (две CRLF)
{"name": "Alice"}

4. Body (тело запроса)

Опциональная часть с данными. Используется в POST, PUT, PATCH запросах.

// JSON
Content-Type: application/json

{
  "id": 123,
  "name": "Alice",
  "email": "alice@example.com"
}

// Form data
Content-Type: application/x-www-form-urlencoded

username=alice&password=secret&remember=true

// Multipart (для файлов)
Content-Type: multipart/form-data; boundary=----WebKitFormBoundary7MA4YWxkTrZu0gW

------WebKitFormBoundary7MA4YWxkTrZu0gW
Content-Disposition: form-data; name="username"

alice
------WebKitFormBoundary7MA4YWxkTrZu0gW
Content-Disposition: form-data; name="avatar"; filename="photo.jpg"
Content-Type: image/jpeg

[бинарные данные файла]
------WebKitFormBoundary7MA4YWxkTrZu0gW--

// Plain text
Content-Type: text/plain

Это просто текст

Полный пример HTTP-запроса

POST /api/v1/users HTTP/1.1
Host: api.example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64)
Content-Type: application/json
Content-Length: 51
Accept: application/json
Accept-Encoding: gzip, deflate
Connection: keep-alive
Authorization: Bearer token-abc123

{
  "name": "John",
  "email": "john@example.com",
  "age": 30
}

JavaScript и HTTP-запросы

// Fetch API
const response = await fetch('https://api.example.com/users', {
  method: 'POST',           // REQUEST LINE: метод
  headers: {                // HEADERS
    'Content-Type': 'application/json',
    'Authorization': 'Bearer token123',
    'X-Custom-Header': 'value'
  },
  body: JSON.stringify({    // BODY
    name: 'Alice',
    email: 'alice@example.com'
  })
});

// Что отправится браузером:
// POST /users HTTP/1.1
// Host: api.example.com
// Content-Type: application/json
// Authorization: Bearer token123
// X-Custom-Header: value
// Content-Length: 48
//
// {"name":"Alice","email":"alice@example.com"}

// XMLHttpRequest (старый способ)
const xhr = new XMLHttpRequest();
xhr.open('POST', 'https://api.example.com/users');  // REQUEST LINE
xhr.setRequestHeader('Content-Type', 'application/json');  // HEADERS
xhr.setRequestHeader('Authorization', 'Bearer token');
xhr.send(JSON.stringify({                            // BODY
  name: 'Bob',
  email: 'bob@example.com'
}));

Методы HTTP и когда использовать

// GET — получить данные (нет body)
GET /api/users HTTP/1.1
GET /api/users/123 HTTP/1.1
GET /api/users?page=1&limit=10 HTTP/1.1

// POST — создать новый ресурс
POST /api/users HTTP/1.1
Content-Type: application/json

{"name": "New User"}

// PUT — полностью заменить ресурс
PUT /api/users/123 HTTP/1.1
Content-Type: application/json

{"name": "Updated Name", "email": "new@email.com"}

// PATCH — частично обновить
PATCH /api/users/123 HTTP/1.1
Content-Type: application/json

{"name": "Just Name Changed"}

// DELETE — удалить ресурс
DELETE /api/users/123 HTTP/1.1

// HEAD — как GET но без body в ответе
HEAD /api/users HTTP/1.1

// OPTIONS — какие методы доступны
OPTIONS /api/users HTTP/1.1

Status Line в ответе

Важно понимать что в ОТВЕТЕ сервера структура немного отличается:

┌──────────────────────────────┐
│ STATUS LINE (не REQUEST LINE)│  ← HTTP/1.1 200 OK
├──────────────────────────────┤
│ HEADERS                      │
├──────────────────────────────┤
│ (пустая строка)              │
├──────────────────────────────┤
│ BODY                         │  ← Ответ
└──────────────────────────────┘

Примеры status line:
HTTP/1.1 200 OK
HTTP/1.1 201 Created
HTTP/1.1 400 Bad Request
HTTP/1.1 401 Unauthorized
HTTP/1.1 403 Forbidden
HTTP/1.1 404 Not Found
HTTP/1.1 500 Internal Server Error

Выводы

1. Request Line — метод, URL, версия HTTP (обязателен)
2. Headers — метаинформация о запросе (обязателен Host)
3. Пустая строка — разделитель заголовков и тела
4. Body — данные (опционально, только для POST/PUT/PATCH)
5. Content-Type и Content-Length — важны для body
6. Headers используются для аутентификации, кеширования, сжатия
7. В JavaScript используй Fetch API вместо XMLHttpRequest