Каким методом будешь отправлять значения с формы?

HTTP методы для отправки значений из формы

HTTP методы (verbs) — это действия, которые клиент может выполнить на ресурсе. Для отправки данных из форм используются разные методы в зависимости от типа операции и требований.

Основные HTTP методы

┌──────────┬──────────────────────────────────────┬─────────────────┐
│ Метод    │ Назначение                           │ Безопасный      │
├──────────┼──────────────────────────────────────┼─────────────────┤
│ GET      │ Получение данных (читать)           │ ✓ (идемпотент)  │
│ POST     │ Создание новых ресурсов             │ ✗ (изменяет)    │
│ PUT      │ Полное замещение ресурса            │ ✗ (изменяет)    │
│ PATCH    │ Частичное обновление ресурса        │ ✗ (изменяет)    │
│ DELETE   │ Удаление ресурса                    │ ✗ (изменяет)    │
│ HEAD     │ Как GET, но без тела ответа         │ ✓ (идемпотент)  │
│ OPTIONS  │ Информация о допустимых методах     │ ✓ (идемпотент)  │
└──────────┴──────────────────────────────────────┴─────────────────┘

Безопасный = не изменяет состояние на сервере
Идемпотентный = повторное выполнение даёт тот же результат

1. GET метод (для отправки значений из форм)

Использование: Отправка ПРОСТЫХ, НЕКРИТИЧНЫХ данных

<!-- HTML форма с методом GET -->
<form method="GET" action="/api/search">
    <input type="text" name="query" placeholder="Поисковый запрос">
    <input type="text" name="category" placeholder="Категория">
    <input type="submit" value="Поиск">
</form>

<!-- При отправке форме запрос будет:
GET /api/search?query=java&category=backend HTTP/1.1
-->

// Spring Controller для GET
@RestController
@RequestMapping("/api")
public class SearchController {
    
    @GetMapping("/search")
    public List<Result> search(
            @RequestParam String query,
            @RequestParam String category) {
        return searchService.search(query, category);
    }
}

Характеристики GET:

✅ ПРЕИМУЩЕСТВА:
├─ Простой и быстрый
├─ Кешируется браузером
├─ Можно давать ссылки на результаты
├─ Видно в истории браузера
└─ Идемпотентный (безопасно повторять)

❌ НЕДОСТАТКИ:
├─ Данные видны в URL (не безопасно для паролей)
├─ Ограничение на длину (2000+ символов)
├─ Нельзя отправлять файлы
├─ Мусорит в истории браузера
└─ Легко перехватить (plaintext в URL)

Когда использовать GET:

• Поиск
• Фильтрация
• Пагинация
• Получение данных (не создание/редактирование)

2. POST метод (стандартный для форм)

Использование: Создание НОВЫХ ресурсов, отправка КОНФИДЕНЦИАЛЬНЫХ данных

<!-- HTML форма с методом POST -->
<form method="POST" action="/api/users" enctype="application/x-www-form-urlencoded">
    <input type="text" name="name" placeholder="Имя" required>
    <input type="email" name="email" placeholder="Email" required>
    <input type="password" name="password" placeholder="Пароль" required>
    <button type="submit">Зарегистрироваться</button>
</form>

<!-- При отправке форме запрос будет:
POST /api/users HTTP/1.1
Content-Type: application/x-www-form-urlencoded

name=John&email=john@example.com&password=secret123
-->

// Spring Controller для POST
@RestController
@RequestMapping("/api")
public class UserController {
    
    @PostMapping("/users")
    public ResponseEntity<UserDTO> createUser(
            @RequestParam String name,
            @RequestParam String email,
            @RequestParam String password) {
        User user = userService.createUser(name, email, password);
        return ResponseEntity.status(HttpStatus.CREATED)
                .body(new UserDTO(user));
    }
}

Характеристики POST:

✅ ПРЕИМУЩЕСТВА:
├─ Данные в теле запроса (не в URL)
├─ Нет ограничений на размер (разумные)
├─ Может отправлять файлы (multipart/form-data)
├─ Конфиденциально (с HTTPS)
├─ Не кешируется автоматически
└─ Не видно в истории браузера

❌ НЕДОСТАТКИ:
├─ Нельзя давать ссылки на результаты
├─ Не идемпотентный (повторная отправка может привести к дублю)
├─ Медленнее GET (нужно отправить тело)
└─ Нужна защита от CSRF атак

Когда использовать POST:

• Регистрация пользователя
• Создание записи
• Загрузка файла
• Отправка пароля
• Любые конфиденциальные данные

3. Сравнение GET vs POST для форм

<!-- Форма регистрации -->

<!-- ❌ Неправильно: использовать GET для пароля -->
<form method="GET" action="/register">
    <input name="password" type="text">
    <button>Отправить</button>
</form>
<!-- URL: /register?password=secret123 - ВИДИТ КАЖДЫЙ! -->

<!-- ✅ Правильно: использовать POST для пароля -->
<form method="POST" action="/register">
    <input name="password" type="password">
    <button>Отправить</button>
</form>
<!-- Пароль в теле, не видно в URL -->

4. PUT метод (полное обновление)

Использование: ПОЛНОЕ замещение ресурса

<!-- HTML форма не может использовать PUT нативно -->
<!-- Нужно использовать JavaScript или отправлять вручную -->

// JavaScript (с fetch API)
const userData = {
    name: "John Updated",
    email: "john.new@example.com",
    age: 31
};

fetch('/api/users/123', {
    method: 'PUT',
    headers: {
        'Content-Type': 'application/json',
    },
    body: JSON.stringify(userData)
}).then(response => response.json())
  .then(data => console.log(data));

// Spring Controller
@RestController
@RequestMapping("/api")
public class UserController {
    
    @PutMapping("/users/{id}")
    public ResponseEntity<UserDTO> updateUser(
            @PathVariable Long id,
            @RequestBody UserUpdateRequest request) {
        User user = userService.updateUser(id, request);
        return ResponseEntity.ok(new UserDTO(user));
    }
}

Характеристики PUT:

• Идемпотентный (повторный запрос = тот же результат)
• Замещает ВСЕ поля
• Обычно вызывает 200 OK или 204 No Content
• Требует полное представление ресурса

5. PATCH метод (частичное обновление)

Использование: ЧАСТИЧНОЕ обновление ресурса (только измененные поля)

// JavaScript
const partialUpdate = {
    name: "John Updated"  // Только одно поле
};

fetch('/api/users/123', {
    method: 'PATCH',
    headers: {
        'Content-Type': 'application/json',
    },
    body: JSON.stringify(partialUpdate)
}).then(response => response.json());

// Spring Controller
@RestController
@RequestMapping("/api")
public class UserController {
    
    @PatchMapping("/users/{id}")
    public ResponseEntity<UserDTO> partialUpdateUser(
            @PathVariable Long id,
            @RequestBody Map<String, Object> updates) {
        User user = userService.partialUpdate(id, updates);
        return ResponseEntity.ok(new UserDTO(user));
    }
}

Характеристики PATCH:

• Идемпотентный (повторный запрос = тот же результат)
• Обновляет ТОЛЬКО переданные поля
• Используется JSON Patch формат часто
• Обычно вызывает 200 OK

6. DELETE метод

Использование: Удаление ресурса

// JavaScript
fetch('/api/users/123', {
    method: 'DELETE',
    headers: {
        'Authorization': 'Bearer token...',
    }
}).then(response => {
    if (response.ok) {
        console.log('Пользователь удалён');
    }
});

// Spring Controller
@RestController
@RequestMapping("/api")
public class UserController {
    
    @DeleteMapping("/users/{id}")
    public ResponseEntity<Void> deleteUser(@PathVariable Long id) {
        userService.deleteUser(id);
        return ResponseEntity.noContent().build(); // 204 No Content
    }
}

7. Форматы кодирования данных

<!-- 1. application/x-www-form-urlencoded (по умолчанию) -->
<form method="POST" action="/api/login">
    <input name="username" value="john">
    <input name="password" value="secret123">
</form>

<!-- Отправляется как:
username=john&password=secret123
-->

<!-- 2. multipart/form-data (для файлов) -->
<form method="POST" action="/api/profile/upload" enctype="multipart/form-data">
    <input type="text" name="bio" value="Developer">
    <input type="file" name="avatar">
</form>

<!-- Отправляется как многочастный запрос -->

<!-- 3. application/json (современный подход) -->
<!-- HTML форма не может отправить JSON автоматически -->
<!-- Нужен JavaScript -->

// Spring Controller с разными форматами

// 1. Form data (application/x-www-form-urlencoded)
@PostMapping("/login")
public ResponseEntity<TokenDTO> loginFormData(
        @RequestParam String username,
        @RequestParam String password) {
    // username=john&password=secret123
    return authenticate(username, password);
}

// 2. JSON (application/json)
@PostMapping("/users")
public ResponseEntity<UserDTO> createUserJson(
        @RequestBody CreateUserRequest request) {
    // {
    //   "name": "John",
    //   "email": "john@example.com"
    // }
    return createUser(request);
}

// 3. Multipart (multipart/form-data)
@PostMapping("/profile/upload")
public ResponseEntity<ProfileDTO> uploadProfile(
        @RequestParam String bio,
        @RequestParam("avatar") MultipartFile file) {
    return updateProfile(bio, file);
}

8. Практический пример: Форма создания товара

<!DOCTYPE html>
<html>
<body>

<!-- Простая форма создания товара -->
<h1>Создать товар</h1>
<form method="POST" action="/api/products" enctype="multipart/form-data">
    <input type="text" name="name" placeholder="Название" required>
    <textarea name="description" placeholder="Описание"></textarea>
    <input type="number" name="price" step="0.01" placeholder="Цена" required>
    <select name="category">
        <option>Электроника</option>
        <option>Одежда</option>
        <option>Книги</option>
    </select>
    <input type="file" name="image" accept="image/*">
    <button type="submit">Создать товар</button>
</form>

<!-- Или с помощью JavaScript (JSON) -->
<h1>Создать товар (JSON)</h1>
<form id="productForm">
    <input type="text" id="name" placeholder="Название" required>
    <textarea id="description" placeholder="Описание"></textarea>
    <input type="number" id="price" step="0.01" placeholder="Цена" required>
    <select id="category">
        <option>Электроника</option>
        <option>Одежда</option>
        <option>Книги</option>
    </select>
    <button type="submit">Создать товар</button>
</form>

<script>
document.getElementById('productForm').addEventListener('submit', async (e) => {
    e.preventDefault();
    
    const product = {
        name: document.getElementById('name').value,
        description: document.getElementById('description').value,
        price: parseFloat(document.getElementById('price').value),
        category: document.getElementById('category').value
    };
    
    const response = await fetch('/api/products', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'Authorization': 'Bearer ' + getToken()
        },
        body: JSON.stringify(product)
    });
    
    if (response.ok) {
        alert('Товар создан!');
        document.getElementById('productForm').reset();
    } else {
        alert('Ошибка: ' + response.statusText);
    }
});
</script>

</body>
</html>

// Spring Controller для обработки
@RestController
@RequestMapping("/api")
public class ProductController {
    
    @Autowired
    private ProductService productService;
    
    // Для multipart/form-data
    @PostMapping("/products")
    public ResponseEntity<ProductDTO> createProductForm(
            @RequestParam String name,
            @RequestParam String description,
            @RequestParam BigDecimal price,
            @RequestParam String category,
            @RequestParam(required = false) MultipartFile image) throws IOException {
        
        CreateProductRequest request = new CreateProductRequest(
            name, description, price, category, image
        );
        
        Product product = productService.createProduct(request);
        return ResponseEntity.status(HttpStatus.CREATED)
                .body(new ProductDTO(product));
    }
    
    // Для application/json
    @PostMapping("/products-json")
    public ResponseEntity<ProductDTO> createProductJson(
            @RequestBody CreateProductJsonRequest request) {
        
        Product product = productService.createProduct(request);
        return ResponseEntity.status(HttpStatus.CREATED)
                .body(new ProductDTO(product));
    }
}

Рекомендации (Best Practices)

✅ ИСПОЛЬЗУЙ GET для:
- Поиска
- Фильтрации
- Пагинации
- Получения информации (READ операции)

✅ ИСПОЛЬЗУЙ POST для:
- Создания ресурсов (CREATE)
- Отправки конфиденциальных данных
- Файлов
- Когда данных много

✅ ИСПОЛЬЗУЙ PUT для:
- Полного обновления ресурса (UPDATE все поля)
- Когда важна идемпотентность

✅ ИСПОЛЬЗУЙ PATCH для:
- Частичного обновления (UPDATE отдельные поля)
- Когда отправляешь только изменённые данные

✅ ИСПОЛЬЗУЙ DELETE для:
- Удаления ресурсов

❌ НИКОГДА:
- Не отправляй пароли в URL (GET)
- Не используй GET для изменения данных
- Не доверяй только методу HTTP (нужна авторизация)
- Не забывай про CSRF защиту при POST

Выводы

Для отправки значений из формы:

1. GET: Простые данные, поиск, фильтрация

   • Данные в URL: /search?q=java&category=backend
   • Ограничение на размер
   • Видно в URL (небезопасно для паролей)

2. POST: Создание, конфиденциальные данные

   • Данные в теле запроса
   • Нет ограничений на размер
   • Может быть form-data или JSON

3. PUT: Полное обновление ресурса

   • Идемпотентный
   • Замещает все поля
   • Требует JSON

4. PATCH: Частичное обновление ресурса

   • Идемпотентный
   • Обновляет только переданные поля
   • Требует JSON

5. DELETE: Удаление ресурса

   • Идемпотентный
   • Обычно без тела запроса
   • Требует авторизацию

Современный подход: Использовать JSON с POST/PUT/PATCH вместо form-data для лучшей структурированности и гибкости.