fd-fetch-wrapper
v0.3.2
Published
Simple wrapper around fetch function to manage in a simple way the errors from BE using http status code
Downloads
17
Readme
Simple wrapper around fetch function to manage in a simple way the errors from BE using http status code
Usage
- Installation
fd-fetch-wrapper
- Import
import { FetchWrapper } from 'fd-fetch-wrapper';
- Create an instance of FetchWrapper
const runner = new FetchWrapper(apiVersion, labels, status_401_403);
Where
apiVersion: optional parameter that can be used when we have different api version on our server, a parameter named 'api-version' will be added to the header
labels: optional parameter used to let you choose the message to show at FE for common error
static labels = {
errorGeneric: 'Sorry we have errors on the remote server',
errorServerNotAvailable: 'Server not available',
errorSessionExpired: 'Your session has expired, please login.',
};
- status_401_403: this is a callback function with no parameters that can be used to let you logout the user
- Avaliable methods
delete = (url, params, token, isFile = false, isBlob = false)
get = (url, token, params, isFile = false, isBlob = false)
post = (url, params, token, isFile = false, isBlob = false, additionalParams = [])
put = (url, params, token, isFile = false, isBlob = false)
Sample
You can find this code in github, App.js of this repository
function App() {
function status_401_403() {
alert("Log Out");
}
const runner = new FetchWrapper(null, null, status_401_403);
function onClick() {
runner.get('http://localhost:61419/weatherforecast').then(response => {
alert(response);
}).catch(errorMessage => {
if (errorMessage)
alert(errorMessage);
});
runner.post('http://localhost:61419/weatherforecast', null, null, false, false, [{ namme: 'nome', value: 123 }]).then(response => {
alert(response);
}).catch(errorMessage => {
if (errorMessage)
alert(errorMessage);
});
}
return (
<React.Fragment>
<button onClick={onClick}>Fetch Test</button>
</React.Fragment>
);
}
Available Scripts
In the project directory, you can run:
npm start
Runs the Demo app in the development mode. Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits. You will also see any lint errors in the console.
npm run distribute
Builds (made for windows) the app for production to the dist
folder.
It correctly bundles the React component.
npm publish
Publish the dist on npmjs.