Fitted

Ajusté

Utilisez les décorateurs ECMAScript (actuellement une proposition de phase 2) pour exécuter des requêtes HTTP et gérer le traitement des réponses, un moyen simple et lisible de gérer la façon dont les données circulent à travers la couche réseau de votre application.

Exemple

Deux parties principales, les décorateurs de méthodes qui feront réellement la requête, et les décorateurs de classe qui vous permettront de gérer la façon dont les réponses du serveur sont transformées et traitées.

L'exemple le plus simple est simplement une récupération de données à partir d'un point de terminaison JSON :

 import { get } from 'fitted' ;

class HackerNews {
    @ get ( 'https://hacker-news.firebaseio.com/v0/topstories.json' )
    topstories ( request , response ) {
      return request ( { } , response ) ;
    }
}

Et récupérez :

 const hackerNews = new HackerNews ( ) ;
const topstories = await hackerNews . topstories ( ) ;
console . log ( topstories ) ; 

Usage

Demande de base

En utilisant le décorateur get , vous pouvez déclencher une requête GET :

 import { get } from 'fitted' ;

class HackerNews {
    @ get ( 'https://hacker-news.firebaseio.com/v0/topstories.json' )
    topstories ( request , response ) {
      return request ( { } , response ) ;
    }
}

Fusionner les paramètres

Pour fusionner les paramètres avec l'URL, nous utilisons url-template, qui utilise des accolades pour encapsuler une variable à fusionner.

 import { get } from 'fitted' ;

class HackerNews {
      @ get ( 'https://hacker-news.firebaseio.com/v0/item/{id}.json' )
      item ( id , request , response ) {
          return request ( {
                template : {
                    id : 123
                 }
          } , response ) ;
      }
}

URL de base

La plupart du temps, vos points de terminaison partageront la même URL de base, donc Fitted vous permet de définir une URL de base qui sera préfixée à tous les chemins définis dans vos décorateurs de méthode.

 import { base , get } from 'fitted' ;

@ base ( 'https://hacker-news.firebaseio.com/v0/' )
class HackerNews {
      @ get ( 'item/{id}.json' )
      item ( id , request , response ) {
          return request ( {
                template : {
                    id : 123
                 }
          } , response ) ;
      }
}

Envoi de données

Pour ajouter des données à votre demande de requêtes post , put et destroy et en spécifiant une chaîne de requête pour votre requête get , vous ajoutez un objet data à la définition de votre demande.

 import { put } from 'fitted' ;

class HackerNews {
      @ put ( 'https://hacker-news.firebaseio.com/v0/item/{id}.json' )
      item ( id , name , request , response ) {
          return request ( {
                template : {
                    id : 123
                } ,
                data : {
                   name : name
                }
          } , response ) ;
      }
}

Demander une décoration

Souvent, tous les points de terminaison auront les mêmes exigences de requête, exigeant, par exemple, qu'ils aient tous un en-tête défini. Pour cela, le décorateur @request peut être utilisé. Il obtiendra la configuration de chaque requête transmise avant de la transmettre au pilote.

 import { get , request } from 'fitted' ;

const myRequestHandler = config => {
    config . headers = {
        'accept' : 'application/json' 
    }
    
    return config ;
}

@ request ( myRequestHandler )
class HackerNews {
    @ get ( 'item/{id}.json' )
    item ( id , request , response ) {
      return request ( {
            template : {
                id : id
            }
        } , response ) ;
    }
}

Gestion des réponses

Lorsque le serveur répond avec un en-tête Content-Type contenant application/json Fitted le transmettra automatiquement à la fonction JSON.parse afin que la promesse résultante génère l'objet correspondant.

Tout autre Content-Type entraînera une erreur et vous obligera à implémenter votre propre gestionnaire.

Processeur de réponse personnalisé

Lorsque votre point de terminaison renvoie quelque chose qui nécessite un prétraitement, vous pouvez définir un processeur pour tous les points de terminaison dans votre définition d'API. Il s'agit d'une fonction qui reçoit la réponse du serveur et transmet les données analysées à l'objet de réponse.

 import { get , processor } from 'fitted' ;

const myProcessor = response => {
    const data = JSON . parse ( response . getBody ( ) ) ;
    response . setBody ( data ) ;
    
    return data ;
}

@ processor ( myProcessor )
class HackerNews {
    @ get ( 'item/{id}.json' )
    item ( id , request , response ) {
      return request ( {
            template : {
                id : id
            }
        } , response ) ;
    }
}