Maison > interface Web > js tutoriel > Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Lisa Kudrow
Libérer: 2025-03-13 12:58:10
original
410 Les gens l'ont consulté

Dans ce tutoriel, vous verrez comment démarrer avec la configuration et l'utilisation d'un faux serveur API REST à l'aide de JSON-Server, que vous pouvez utiliser lors du développement d'applications mobiles ou Web. Ce tutoriel suppose que vous avez une connaissance de base des demandes JSON et HTTP.

Qu'est-ce que le repos?

REST signifie transfert d'état de représentation. Il s'agit d'un style d'architecture pour concevoir des applications connectées. Il utilise un HTTP simple pour rendre la communication entre les machines possible. Ainsi, au lieu d'utiliser une URL pour manipuler certaines informations utilisateur, REST envoie une demande HTTP comme Get, Post, Delete, etc. à une URL pour manipuler les données.

Par exemple, au lieu de faire une demande GET à une URL comme /deleteuser?id=10 , la demande serait comme DELETE /user/10 .

Pourquoi avons-nous besoin d'une fausse API de repos?

Les API REST forment le back-end pour les applications mobiles et Web. Lors du développement d'applications, vous n'aurez parfois pas les API de repos prêtes à être utilisées à des fins de développement. Pour voir l'application mobile ou Web en action, nous avons besoin d'un serveur qui jette dans certaines données JSON facturées.

C'est alors que la fausse API REST entre en scène. json-server fournit la fonctionnalité pour configurer un faux serveur API REST avec un effort minimum.

Commencer

Pour commencer à utiliser json-server , installez le package à l'aide de Node Package Manager (NPM).

 NPM Install -g JSON-Server<br>
Copier après la connexion

Créez un fichier JSON factice avec certaines données selon vos besoins. Par exemple, j'ai besoin de données JSON avec des informations utilisateur comme l'ID, le nom, l'emplacement, etc. Je vais donc créer un fichier appelé info.json avec les informations JSON suivantes:

 {<br> "utilisateurs": [{<br> "id": 1,<br> "Nom": "Roy",<br> "Emplacement": "Inde"<br> }, {<br> "id": 2,<br> "Nom": "Sam",<br> "Emplacement": "Pays de Galles"<br> }]<br> }<br>
Copier après la connexion

À partir du terminal, exécutez le serveur JSON avec info.json comme source de données, et vous devriez faire fonctionner l'API REST sur http: // localhost: 3000.

 json-server info.json<br>
Copier après la connexion

Tester les points de terminaison de l'API REST

Étant donné que notre faux serveur API REST est opérationnel, voyons comment accéder à l'API REST à l'aide d'un client. J'utilise le client Postman Rest pour passer les appels API.

Faire une demande

Commençons par faire une demande GET à l'URL de repos. À l'intérieur du fichier JSON, nous avons défini un users de point de terminaison qui contient des informations liées aux utilisateurs. En faisant une demande GET à l'URL http: // localhost: 3000 / utilisateurs, il devrait afficher les données existantes.

Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Demande de poste

Afin d'ajouter de nouvelles données aux données existantes, nous ferons une demande POST à l'URL http: // localhost: 3000 / utilisateurs. Voici à quoi ressemblerait la demande POST :

Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Essayez de faire une demande GET et vous devriez avoir les données nouvellement ajoutées dans le fichier info.json .

 [<br> {<br> "id": 1,<br> "Nom": "Roy",<br> "Emplacement": "Inde"<br> },<br> {<br> "id": 2,<br> "Nom": "Sam",<br> "Emplacement": "Pays de Galles"<br> },<br> {<br> "Nom": "II",<br> "Emplacement": "la",<br> "id": 7<br> },<br> {<br> "Nom": "Shona",<br> "Emplacement": "la",<br> "id": 8<br> },<br> {<br> "Nom": "Shona",<br> "Emplacement": "la",<br> "id": 9<br> }<br> ]]<br>
Copier après la connexion

Supprimer la demande

Pour supprimer une entrée des données json-server , vous devez envoyer une demande DELETE au point de terminaison de l'API avec l'ID utilisateur. Par exemple, pour supprimer l'utilisateur avec l'ID 1, vous devez envoyer une demande DELETE au point de terminaison http: // localhost: 3000 / utilisateurs / 1. Une fois supprimé, essayez de faire une demande GET et l'utilisateur avec ID 1 ne doit pas être dans le JSON retourné.

Demande de patch

Pour mettre à jour une entrée existante, vous devez envoyer une demande PATCH avec les détails qui doivent être mis à jour pour cette entrée particulière. Par exemple, afin de mettre à jour les détails d'un utilisateur avec ID 2, nous enverrons une demande PATCH à l'URL http: // localhost: 3000 / utilisateurs / 2 comme indiqué:

Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Recherche des API JSON-Server REST

À l'aide d'API json-server REST, vous pouvez rechercher les données pour trouver des données en fonction de certains critères. Par exemple, afin de trouver des utilisateurs avec un nom particulier, vous devez envoyer une demande GET à l'URL de l'API REST comme indiqué:

Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Comme on le voit dans l'image ci-dessus, l'envoi d'une demande GET à l'URL http: // localhost: 3000 / utilisateurs? Name = Shona renverrait les utilisateurs avec le nom Shona . De même, pour rechercher des utilisateurs avec d'autres champs, vous devez ajouter ce champ à la chaîne de requête.

Afin d'exécuter une recherche de texte intégral sur le point de terminaison de l'API REST, vous devez ajouter la chaîne de recherche avec le paramètre q au point de terminaison. Par exemple, pour rechercher des utilisateurs avec des informations contenant des s de recherche, la demande ressemblerait à:

Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Manipulation de la pagination

Lors de l'affichage d'une grille de données paginée, il serait nécessaire de récupérer certaines données en fonction de la pagination. Dans de tels scénarios, json-server fournit la fonctionnalité pour paginer les données JSON. Par défaut, le nombre de données renvoyés de json-server est de 10. Nous pouvons explicitement définir cette limite à l'aide du paramètre _limit .

 http: // localhost: 3000 / utilisateurs? _limit = 5<br>
Copier après la connexion

Une demande de GET à l'URL ci-dessus retournerait cinq enregistrements. Maintenant, pour paginer les données, nous devons ajouter un autre paramètre _page à l'URL. _page définit la page qui doit être récupérée sur le retour des données.

 http: // localhost: 3000 / utilisateurs? _limit = 5 & _page = 2<br>
Copier après la connexion

Une demande de GET à l'URL ci-dessus renverrait la deuxième page de l'ensemble de données avec cinq enregistrements par page. En modifiant la variable _page , nous pouvons récupérer les enregistrements de page requis.

Manipulation du tri

json-server fournit la fonctionnalité pour trier les données récupérées. Nous pouvons trier les données en fournissant le nom de la colonne qui doit être trié et l'ordre dans lequel les données doivent être triées. Par défaut, les données sont triées par ordre croissant. Nous pouvons fournir le nom de la colonne dans l'URL du point de terminaison à l'aide du mot-clé _sort et définir l'ordre à l'aide du mot-clé _order . Voici un exemple d'URL:

 http: // localhost: 3000 / utilisateurs? _sort = id & _order = desc<br>
Copier après la connexion

L'URL ci-dessus trierait les données en fonction de l' Id de colonne, et elle serait triée par ordre décroissant.

Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Opérateurs de manipulation

json-server fournit également la fonctionnalité pour soutenir les opérateurs comme trouver une entrée avec un ID dans une plage entre deux valeurs ou une entrée correspondant à une expression régulière particulière.

Pour trouver une entrée dans une plage particulière, nous pouvons utiliser les opérateurs _gte et _lte . Par exemple, pour trouver des utilisateurs avec ID supérieur à 3 et moins de 5, faites une demande GET à l'URL http: // localhost: 3000 / utilisateurs? Id_gte = 3 & id_lte = 5 comme indiqué:

Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Si nous voulons rechercher des noms à partir d'une certaine lettre, nous pouvons utiliser des expressions régulières. Par exemple, pour rechercher des noms à commencer par les lettres sa , nous utiliserons l'opérateur _like et faire une demande GET à l'URL http: // localhost: 3000 / utilisateurs? Name_like = ^ sa.

Obtenez une fausse API de repos en cours d'exécution à l'aide de Json-Server

Conclusion

Dans ce tutoriel, vous avez vu comment utiliser les API json-server REST pour créer une base de données factice pour une utilisation rapide. Vous avez appris à commencer à utiliser json-server et à interroger l'URL pour ajouter, mettre à jour, modifier et supprimer des données. Vous avez vu comment paginer, trier et rechercher les données factices. Vous avez également vu comment utiliser les opérateurs pour rechercher des entrées en utilisant des expressions régulières.

Avez-vous utilisé json-server ou tout autre serveur API Fake REST pour la création de données factices? Comment était votre expérience? Faites-nous savoir vos réflexions sur le forum Envato.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal