React Http
React Http is built on top of fetch for browser side and node-fetch for server side. It provides an lightweight and fancy way to interact with backend REST API.
ReactHttp provides 5 basic method of REST API: POST, GET, PATCH, DELETE, PUT
and new method sendFiles
for upload file.
Installation
- With npm:
npm install reacthttp
- With bower:
bower install reacthttp
- cdnjs
Usage
Basic usage
; // Get methodReactHttp // Post methodReactHttp // Upload filevar input = documentReactHttp
With URL Search Params
UrlSearchParams supports all method of ReactHttp
;let searchParams = ;searchParams;searchParams// Send requestReactHttp
Custome Header
By default, ReactHttp's header
let defaultHeaderOptions = 'Accept': 'application/json' 'Content-Type': 'application/json';
You can add or modify global headers by setHeader
function
;// custom header, if you want to override default header, just add it.const customHeader = Authorization: "Bearer askjdhui2343asdfjkhadsf" // Want to override Content-Type: ...;// change global header;// Now ReactHttp will use new custom header
Modify header for only one request
;const headerOptions = Authorization: "Bearer askjdhui2343asdfjkhadsf";ReactHttp
API
ReactHttp.get(url, urlSearchParams, customHeader);
ReactHttp.post(url, body, urlSearchParams, customHeader);
ReactHttp.put(url, body, urlSearchParams, customHeader);
ReactHttp.patch(url, body, urlSearchParams, customHeader);
ReactHttp.delete(url, urlSearchParams, customHeader);
ReactHttp.sendFiles(url, fileObj, urlSearchParams, customHeader);
setHeader(options);
options is a pure js object.
Default sendfiles Content-Type is multipart/form-data
urlSearchParams is an instance of UrlSearchParams class
customHeader is an js object with key is a Http Header Field.
Examples
See examples