Axios Wrapper
— это библиотека, которая предоставляет удобную обертку над Axios, добавляя к ее функционалу автоматическую отмену одновременно выполняемых запросов.
npm install --save-dev @gravity-ui/axios-wrapper
Конфигурация экземпляра axios
.
Конфигурация сборщика запросов представляется в виде объекта:
{
"collectErrors": 10,
"collectRequests": 10
}
Axios Wrapper
поддерживает следующие HTTP-методы: get
, head
, put
, post
, delete
.
Методы get
и head
имеют сигнатуру (url, params, options)
, а put
, post
и delete
— (url, data, params, options)
.
В params
задаются параметры строки запроса, а в options
— настройки запроса.
На данный момент поддерживаются следующие настройки запроса:
concurrentId (string)
— идентификатор запроса. Данная настройка является опциональной.collectRequest (bool)
— флаг для включения или отключения логирования запроса (по умолчанию —true
). Данная настройка является опциональной.requestConfig (object)
— конфигурация с пользовательскими параметрами запроса. Данная настройка является опциональной.headers (object)
— объект с пользовательскими заголовками запроса. Данная настройка является опциональной.timeout (number)
— таймаут запроса. Данная настройка является опциональной.onDownloadProgress (function)
— обратный вызов для обработки прогресса загрузки файла. Данная настройка является опциональной.
Метод setDefaultHeader({name (string), value (string), methods (array)})
позволяет добавить заголовок по умолчанию для запроса.
name
и value
— обязательные аргументы, а methods
— опциональный аргумент, указывающий все методы, которым будут переданы такие заголовки по умолчанию (по умолчанию заголовки передаются всем методам).
Метод setCSRFToken
позволяет задать CSRF-токен, который будет добавляться ко всем запросам put
, post
и delete
.
В некоторых случаях лучше отменить запрос в процессе его выполнения, если его результаты больше не нужны. Для этого в options
запроса необходимо передать concurrentId
.
При следующем запросе с тем же значением concurrentId
предыдущий запрос будет отменен.
Также можно вручную отменить запрос, вызвав метод cancelRequest(concurrentId)
.
С помощью параметра collector
можно настроить сбор запросов в локальное хранилище. Он хранит все запросы и ошибки отдельно.
Следующий экземпляр apiInstance
будет хранить 10 последних запросов (как успешных, так и неудачных) и 10 последних ошибочных запросов.
const apiInstance = new API({
collector: {
collectErrors: 10,
collectRequests: 10
}
});
Для получения сохраненных запросов необходимо вызвать метод getCollectedRequests
, который возвращает объект {errors: [...], requests: [...]}
.
Рекомендуется использовать наследование от базового класса AxiosWrapper
:
export class API extends AxiosWrapper {
getProjects() {
return this.get('/projects');
}
getSensors({project, selectors}) {
return this.get(`/projects/${project}/sensors`, {selectors, pageSize: 200});
}
getNames({project, selectors}) {
return this.get(`/projects/${project}/sensors/names`, {selectors});
}
getLabels({project, names, selectors}) {
return this.get(`/projects/${project}/sensors/labels`, {names, selectors});
}
}
Когда параметр baseURL
передается в конфигурацию axios
, запрашиваемые пути будут добавляться к нему:
const apiInstance = new API({
config: {
baseURL: '/api/v2'
}
});