POST-запросы

Bliss.js предоставляет удобный и лаконичный API для работы с HTTP-запросами, включая поддержку POST-запросов. POST-запросы используются для отправки данных на сервер, чаще всего в формате JSON или form-data, и позволяют создавать новые ресурсы или выполнять действия, которые изменяют состояние сервера.

В Bliss.js для выполнения POST-запроса используется метод Bliss.ajax или его сокращённые формы. Важные аспекты включают указание URL, метода запроса, заголовков, а также тела запроса.

Bliss.ajax({
    url: '/api/users',
    method: 'POST',
    headers: {
        'Content-Type': 'application/json'
    },
    data: JSON.stringify({
        name: 'Иван',
        email: 'ivan@example.com'
    }),
    success(response) {
        console.log('Пользователь создан:', response);
    },
    error(err) {
        console.error('Ошибка при создании пользователя:', err);
    }
});

В данном примере ключевое внимание уделено нескольким моментам:

  • url — адрес конечной точки сервера, принимающей POST-запрос.
  • method: 'POST' — указание метода запроса.
  • headers — заголовки запроса, определяющие формат передаваемых данных.
  • data — тело запроса, передаваемое серверу.
  • success и error — колбэки для обработки ответа и ошибок.

Работа с формами

Bliss.js позволяет легко отправлять данные из HTML-форм без ручного сериализования. Используется метод Bliss.serialize, который превращает форму в объект данных, пригодный для передачи.

const form = document.querySelector('#userForm');

form.addEventListener('submit', function(event) {
    event.preventDefault();
    const formData = Bliss.serialize(form);

    Bliss.ajax({
        url: '/api/users',
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        data: JSON.stringify(formData),
        success(response) {
            console.log('Данные отправлены успешно', response);
        },
        error(err) {
            console.error('Ошибка отправки формы', err);
        }
    });
});

Особенность использования Bliss.serialize — автоматическое преобразование значений полей формы в объект, что упрощает работу с JSON.

Асинхронные POST-запросы с промисами

Bliss.js поддерживает промисы, что позволяет использовать синтаксис async/await для упрощения асинхронной логики.

async function createUser(userData) {
    try {
        const response = await Bliss.ajax({
            url: '/api/users',
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            data: JSON.stringify(userData)
        });
        console.log('Пользователь успешно создан:', response);
    } catch (err) {
        console.error('Ошибка создания пользователя:', err);
    }
}

createUser({ name: 'Мария', email: 'maria@example.com' });

Использование async/await повышает читаемость кода и упрощает обработку ошибок по сравнению с традиционными колбэками.

Отправка данных в формате FormData

Для передачи файлов или сложных данных используется объект FormData. Bliss.js позволяет интегрировать его напрямую в POST-запрос:

const fileInput = document.querySelector('#avatar');
const formData = new FormData();
formData.append('name', 'Пётр');
formData.append('avatar', fileInput.files[0]);

Bliss.ajax({
    url: '/api/upload',
    method: 'POST',
    data: formData,
    processData: false, // отключение автоматического преобразования
    contentType: false, // отключение автоматического заголовка
    success(response) {
        console.log('Файл загружен:', response);
    },
    error(err) {
        console.error('Ошибка загрузки файла:', err);
    }
});

Параметры processData: false и contentType: false важны для корректной работы с FormData, чтобы браузер сам устанавливал заголовки multipart/form-data.

Настройка таймаутов и дополнительных параметров

Bliss.js позволяет задавать таймауты, настраивать кеширование и обрабатывать статусы HTTP через отдельные колбэки:

Bliss.ajax({
    url: '/api/data',
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    data: JSON.stringify({ key: 'value' }),
    timeout: 5000, // 5 секунд
    status: {
        201(response) { console.log('Ресурс создан', response); },
        400(response) { console.error('Некорректный запрос', response); }
    },
    success(response) { console.log('Запрос успешен', response); },
    error(err) { console.error('Произошла ошибка', err); }
});

Параметр status позволяет обрабатывать различные HTTP-коды отдельно, что полезно для сложной логики обработки ошибок.

Использование глобальных настроек для POST

Bliss.js поддерживает глобальную настройку AJAX-запросов, что удобно при работе с единой базовой конфигурацией API:

Bliss.ajaxSetup({
    headers: { 'Authorization': 'Bearer TOKEN' },
    timeout: 10000
});

Bliss.ajax({
    url: '/api/profile',
    method: 'POST',
    data: JSON.stringify({ username: 'ivan123' }),
    success(response) { console.log(response); }
});

Глобальные настройки применяются ко всем последующим запросам, позволяя централизованно управлять авторизацией, таймаутами и заголовками.

Обработка ошибок и повторные запросы

Bliss.js позволяет реализовать механизмы повторной отправки при сетевых ошибках:

function postWithRetry(url, data, retries = 3) {
    return Bliss.ajax({
        url,
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        data: JSON.stringify(data)
    }).catch(err => {
        if (retries > 0) {
            return postWithRetry(url, data, retries - 1);
        }
        throw err;
    });
}

postWithRetry('/api/users', { name: 'Сергей' })
    .then(response => console.log('Запрос успешен', response))
    .catch(err => console.error('Не удалось отправить данные', err));

Рекурсивная логика позволяет автоматически повторять POST-запросы, снижая вероятность сбоев при временных сетевых проблемах.

Выводы по работе с POST в Bliss.js

  • Гибкость: поддержка JSON, FormData, колбэков и промисов.
  • Удобство: автоматическая сериализация форм и глобальные настройки AJAX.
  • Контроль: таймауты, обработка статусов, повторные запросы.

Bliss.js превращает работу с POST-запросами в лаконичный и структурированный процесс, позволяя управлять отправкой данных на сервер и обработкой ответов с минимальными усилиями.

Оглавление