Apply interceptors to fetch
and create a custom request function.
- ⚡ Dependency free and pretty small, 0.3KB (minified + gzipped);
- 🏷️ Well type defined with TypeScript (with generics);
- 📦 There are ESM, CommonJS and UMD distributions;
This library is published in the NPM registry and can be installed using any compatible package manager.
npm install @bitty/create-request --save
# Use the command below if you're using Yarn.
yarn add @bitty/create-request
@bitty/create-request
is curry function, which applies interceptors to fetch
and returns a new request function.
import createRequest from '@bitty/create-request';
type Method = 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH';
const request = createRequest(window.fetch, {
onRequest: (method: Method, route: string, data: any = undefined) => ({
url: 'https://api.example.com' + route,
body: JSON.stringify(data),
method,
headers: { 'Content-Type': 'application/json' }
}),
onResponse: (response: Response) => {
if (response.status === 403)
throw new Error('Authorization error.');
return response.json();
},
onError: (error:? Error) => {
sentry.captureException(error);
return Promise.reject(message);
}
});
request('POST', '/user', {
name: 'Vitor'
})
.then((response) => response.success && alert('User was created!'));
-
onError
onError?: (reason?: Error) => Promise<never>;
Handle request and response errors.
-
onRequest
onRequest?: <A extends any[] = [RequestOptions]>(...params: A) => RequestOptions;
Handle request and define request arguments.
A
generic type defines returnedrequest
function arguments type. -
onRequestError
onRequestError?: (reason?: Error) => Promise<never>;
Handle request errors. Overwrites
onError
handling request errors. -
onResponse
onResponse?: <R = Response>(response: R) => R | PromiseLike<R>;
Handle response and define the request return.
R
generic type defines returnedrequest
function result type. -
onResponseError
onResponseError?: (reason?: Error) => Promise<never>;
Handle response errors. Overwrites
onError
handling response errors.
Older browsers don't support Fetch API
, but you can use unfetch
or other polyfill to achieve it.
import fetch from 'unfetch';
import createRequest from '@bitty/create-request';
export default createRequest(fetch, {
onRequest: (options) => ({
...options,
headers: {
...options.headers,
'Content-Type': 'application/json'
}
}),
onResponse: (response) => response.json()
});
Node environment does not provide global fetch
function, but you can use node-fetch
to achieve it.
const fetch = require('node-fetch');
const createRequest = require('@bitty/create-request');
module.exports = createRequest(fetch, {
onResponse (response) {
return response.json();
}
});
Released under MIT License.