ajax-minify v1.0.4

ajax-minify

Небольшой модуль для облегчения работы с ajax запросами на стороне клиента. Модуль использует файловый импорт и экспорт, поэтому для его успешного и комфортного использования необходим сборщик модулей, например webpack.

Пример использования

    import Ajax from 'ajax-minify';

    Ajax.get('/query', (res) => {
        console.log(res.text());
    });

    // Console:
    // Вы попали на страницу /query

Список функций

• get
• post
• query

get

Отправляет по указанному адресу запрос с методом GET

Список аргументов:

• url *обязательный
• success *обязательный - будет вызвана в случае успешного завершения запроса. В качестве параметра будет передан объект HttpSuccess
• error - будет вызвана в случае ошибки или тайм-аута. В качестве параметра будет передан объект HttpError

    Ajax.get('/query', (res) => {
        console.log(res.json());
    }, (error) => {
        console.log(error.type);
    });

post

Отправляет по указанному адресу запрос с методом POST. Если вам необходимо вместе с данными отправить на сервер и специфичные заголовки, то рекомендуется использовать метод query, так как к post нельзя прикрепить заголовки.

Список аргументов:

• url *обязательный
• data <string | object | Blob | ReadableStream | FormData | ArrayBuffer | TypedArray> - данные, которые будут отправлены на сервер в теле запроса. Если передан чистый объект, который не является экземпляром перечисленных выше классов, то он будет сериализован в json, который затем будет отправлен на сервер (заголовок также будет выставлен автоматически). Поведение с остальными типами будет стандартным, в соответствии со встроенной функциональностью браузера.
• success *обязательный - будет вызвана в случае успешного завершения запроса. В качестве параметра будет передан объект HttpSuccess
• error - будет вызвана в случае ошибки или тайм-аута. В качестве параметра будет передан объект HttpError

    const data = {
        type: "message",
        body: "Hello"
    };

    Ajax.post('/query', data, (res) => {
        console.log(res.text());
    }, (error) => {
        console.log(error.type);
    });

query

Более гибкий метод для отправки ajax запросов, который принимает в качестве параметра объект со следующими свойствами:

• url *обязательный
• method обязательный* - метод http запроса. (следует следить за тем, чтобы не использовать параметр data** вместе с методами запроса у которых не может быть тела)
• data <string | object | Blob | ReadableStream | FormData | ArrayBuffer | TypedArray> - данные, которые будут отправлены на сервер в теле запроса. Если передан чистый объект, который не является экземпляром перечисленных выше классов, то он будет сериализован в json, который затем будет отправлен на сервер (заголовок также будет выставлен автоматически). Поведение с остальными типами будет стандартным, в соответствии со встроенной функциональностью браузера.
• success *обязательный - будет вызвана в случае успешного завершения запроса. В качестве параметра будет передан объект HttpSuccess
• error - будет вызвана в случае ошибки или тайм-аута. В качестве параметра будет передан объект HttpError
• loadstart - будет вызвана прямо перед отправкой данных на сервер. Никаких параметров не передается.
• loadend - будет вызвана в конце обработки запроса, причем не важно завершился ли запрос успешно, с ошибкой или истек timeout. Никаких параметров не передается. Вызывается самым последним.
• progress - будет периодически вызываться по мере загрузки ответа с сервера. Количество вызовов зависит от размера получаемых данных. В качестве параметра будет передан объект HttpProgress, с помощью которого можно отслеживать процесс загрузки.
• headers - http заголовки, которые должны быть отправлены на сервер. Точный синтаксис смотрите в примере кода.

    Ajax.query({
        url: '/query',
        method: 'post',
        data: {
            message: 'Hello, Server'
        },
        headers: [
            ['Content-Type', 'text/plain']
        ],
        loadstart: () => {
            console.log('Start query');
        },
        loadend: () => {
            console.log('End query');
        },
        success: (res) => {
            console.log(res.text());
        },
        error: (error) => {
            console.log(`Error ${error.type} at ${error.url}`);
        },
        progress: (info) => {
            console.log(`Loaded: ${info.loaded} Total: ${info.total}`);
        }
    });

Объекты из параметров

• HttpSuccess
• HttpError
• HttpProgress

HttpSuccess

Передается в качестве параметра в функцию success. Список свойств:

• text() - возвращает тело ответа в виде строки
• json() - возвращает объект, если в теле запроса находится корректный json, иначе возвращает false
• status - числовой статус ответа.
• statusText - весь текст статуса ответа. Например: 200 OK.
• responseURL - url адрес ответа.
• loaded - количество загруженных байт
• timeStamp - прошедшее время
• headers - список заголовков, которые пришли с сервера в виде объекта
• headersText - необработанная строка с заголовками ответа
• getHeader(header) - возвращает значение указанного заголовка

HttpError

Передается в качестве параметра в функцию error. Список параметров:

• type - тип ошибки
• url - url адрес, который был передан для запроса

HttpProgress

Передается в качестве параметра в функцию progress. Список параметров:

• loaded - количество загруженных байт
• total - общее количество байт
• timeStamp - прошедшее время
• status - числовой статус ответа.
• statusText - весь текст статуса ответа. Например: 200 OK.
• responseURL - url адрес ответа.
• headers - список заголовков, которые пришли с сервера в виде объекта
• headersText - необработанная строка с заголовками ответа
• getHeader(header) - возвращает значение указанного заголовка