2.1.0 • Published 2 years ago

woopear-fetch-service v2.1.0

Weekly downloads
-
License
ISC
Repository
github
Last release
2 years ago

Fetch service

package qui fournis une fonction de requête api, dédié pour le front
il utilise fetch JS bibliothèque.
simple d'utilisation, avec prise en charge await et typescript

Fonctionnement d'utilisation

  • exemple d'utilisation de la fonction : callApi

NOTE : l'objet retourner par la fonction est deja pret à l'emploi
EX : response.propriete => fonctionne, pas besoin de parse ou autre formatage.

// les imports
import { callApi, headersSample } from 'woopear-fetch-service';
import { EMethodeFetch } from 'woopear-fetch-service';

// creation de votre interface objet
interface ICar {
  id?: string;
  engine: string;
  nbDoor: string;
  energy: string;
}

// utilisation de la fonction callApi
// ici on recupere une liste de Car
const response = await callApi<ICar[]>(
  'my-url/car',
  EMethodeFetch.GET,
  headersSample()
);

console.log(response);

// output
/* response : [
    ...

    {
        id: '4f6sd45f6sd5f4sd5f',
        engine: 'v8 bi-turbo',
        nbDoor: '5',
        energy: 'essence'
    }

    ...
]
*/
  • description : callApi(url, method, data?, headers?): Promise
// url => votre url d'api, vous pouvez combiner avec les points de terminaison
// ex : `${urlBase}/${endpoint}/${id}`

// methode => pour facilité l'utilisation l'enum EMethodeFetch existe pour vous dans le package
// ex : import { EMethodeFetch } from 'woopear-fetch-service';
/* contenue :
enum EMethodeFetch {
  POST = 'POST',
  PUT = 'PUT',
  GET = 'GET',
  PATCH = 'PATCH',
  DELETE = 'DELETE',
}
*/
// choisissez votre methode

// headers => voir la description de la fonction headerSample() ci-dessous

// data? => argument optionnel, doit contenir les datas que vous souhaitez envoyer
// pas besoin de stringify la fonction le fait pour vous, envoyer l'objet tel quel
// optionnel, car si vous avez des requetes GET, vous n'aurez pas besoin de cette argument

callApi: async function <T>(
    url: string,
    method: EMethodeFetch,
    data?,
    header: HeadersInit = {},
  ): Promise<T> {
    const response: T = await (
      await fetch(url, this.configRequest(method, header, data))
    ).json();

    return response;
  },
  • description : headersSample(): HeadersInit
headersSample: function (): HeadersInit {
    return {
      accept: 'application/json',
      'Content-Type': 'application/json',
    };
  },

fonction headersSample() renvoie un header pré-formater
de base il contient
accept: 'application/json'
'Content-Type': 'application/json'
woopear travail sur le sujet afin de permettre un parametrage en global
cela permettra d'avoir quelque chose de customisable
il est possible toute fois de combiner cette fonction dans un nouvel objet
avec vos parametres supplémentaires

2.0.3

2 years ago

2.0.2

2 years ago

2.0.5

2 years ago

2.0.4

2 years ago

2.0.7

2 years ago

2.0.6

2 years ago

2.0.9

2 years ago

2.0.8

2 years ago

2.1.0

2 years ago

2.0.1

2 years ago

2.0.0

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago