Codez votre première API avec Node.js et Express connecter une base de données

Construire une API REST avec Node.js et Express: Connexion d'une base de données

Dans le premier didacticiel, Comprendre les API RESTful, nous avons appris l’architecture REST, les méthodes de requête HTTP et leurs réponses, ainsi que la compréhension d’un noeud final d’API RESTful. Dans le deuxième tutoriel, Comment configurer un serveur Express API, nous avons appris à créer des serveurs avec les fonctions intégrées aux deux nœuds. http module et le cadre Express, et comment router l'application que nous avons créée vers différents points de terminaison d'URL.

Actuellement, nous utilisons des données statiques pour afficher les informations utilisateur sous la forme d'un flux JSON lorsque le point de terminaison de l'API est touché par un message. OBTENIR demande. Dans ce tutoriel, nous allons configurer une base de données MySQL pour stocker toutes les données, vous connecter à la base de données à partir de notre application Node.js et permettre à l'API d'utiliser le OBTENIR, POSTER, METTRE, et EFFACER méthodes pour créer une API complète.

Installation

Jusqu'à présent, nous n'avons pas utilisé de base de données pour stocker ou manipuler des données, nous allons donc en créer une. Ce tutoriel utilisera MySQL. Si MySQL est déjà installé sur votre ordinateur, vous serez prêt à passer à l'étape suivante..

Si MySQL n'est pas installé, vous pouvez télécharger MAMP pour macOS et Windows, qui fournit un environnement de serveur local et une base de données gratuits. Une fois que vous avez téléchargé ceci, ouvrez le programme et cliquez sur Démarrer les serveurs pour démarrer MySQL.

En plus de la configuration de MySQL, nous souhaitons que le logiciel graphique affiche la base de données et les tables. Pour Mac, téléchargez SequelPro et pour Windows, téléchargez SQLyog. Une fois MySQL téléchargé et en cours d’exécution, vous pouvez utiliser SequelPro ou SQLyog pour vous connecter à localhost avec le nom d'utilisateur racine et mot de passe racine sur le port 3306.

Une fois que tout est configuré ici, nous pouvons passer à la configuration de la base de données pour notre API..

Configuration de la base de données

Dans votre logiciel d’affichage de base de données, ajoutez une nouvelle base de données et appelez-la. api. Assurez-vous que MySQL est en cours d'exécution, sinon vous ne pourrez pas vous connecter à localhost.

Quand vous avez le api base de données créée, ouvrez-la et exécutez la requête suivante pour créer une nouvelle table.

CREATE TABLE 'users' ('id' int (11) non signé NON NULL AUTO_INCREMENT, 'nom' varchar (30) DEFAULT ", 'email' varchar (50) DEFAULT", PRIMARY KEY ("id")) ENGINE = InnoDB DEFAULT CHARSET = utf8; 

Cette requête SQL créera la structure de notre utilisateurs table. Chaque utilisateur aura un identifiant auto-incrémenté, un nom et une adresse email..

Nous pouvons également remplir la base de données avec les mêmes données que nous affichons actuellement via un tableau JSON statique en exécutant un INSÉRER question.

INSERT INTO users (nom, email) VALUES ('Richard Hendricks', '[email protected]'), ('Bertram Gilfoyle', '[email protected]'); 

Il n’est pas nécessaire de saisir le identifiant champ, comme il est auto-incrémenté. À ce stade, nous avons la structure de notre tableau ainsi que des exemples de données avec lesquels travailler..

Connexion à MySQL

De retour dans notre application, nous devons nous connecter à MySQL à partir de Node.js pour pouvoir utiliser les données. Plus tôt, nous avons installé le mysql module npm, et maintenant nous allons l'utiliser.

Créez un nouveau répertoire appelé Les données et faire un config.js fichier.

Nous allons commencer par exiger la mysql module dans data / config.js.

const mysql = require ('mysql'); 

Créons un config objet contenant l'hôte, l'utilisateur, le mot de passe et la base de données. Cela devrait faire référence à la api base de données que nous avons faite et utilisons les paramètres par défaut de l'hôte local.

// Définir les références de connexion à la base de données const config = hôte: 'hôte local', utilisateur: 'racine', mot de passe: 'racine', base de données: 'api',; 

Pour plus d'efficacité, nous allons créer un pool MySQL, ce qui nous permet d'utiliser plusieurs connexions à la fois au lieu d'avoir à ouvrir et fermer manuellement plusieurs connexions..

// Créer un pool MySQL const pool = mysql.createPool (config); 

Enfin, nous allons exporter le pool MySQL afin que l'application puisse l'utiliser.

// Exporte le pool module.exports = pool; 

Vous pouvez voir le fichier de configuration de la base de données terminé dans notre dépôt GitHub.

Maintenant que nous nous connectons à MySQL et que nos paramètres sont complets, nous pouvons passer à l’interaction avec la base de données à partir de l’API..

Obtenir des données API de MySQL

Actuellement, notre routes.js Le fichier crée manuellement un tableau d'utilisateurs JSON, qui ressemble à ceci.

const utilisateurs = [… 

Puisque nous n'utiliserons plus de données statiques, nous pouvons supprimer tout ce tableau et le remplacer par un lien vers notre pool MySQL..

// Charge la connexion au pool MySQL const pool = require ('… / data / config'); 

Auparavant, le OBTENIR pour le /utilisateurs chemin envoyait la statique utilisateurs Les données. Notre code mis à jour va interroger la base de données pour ces données à la place. Nous allons utiliser une requête SQL pour SÉLECTIONNER tous du utilisateurs table, qui ressemble à ceci.

SELECT * FROM utilisateurs 

Voici ce que notre nouvelle /utilisateurs get route ressemblera, en utilisant le pool.query () méthode.

// Affiche tous les utilisateurs app.get ('/ users', (demande, réponse) => pool.query ('SELECT * FROM utilisateurs', (erreur, résultat) => si (erreur) renvoie une erreur; réponse. send (result););); 

Ici, nous courons le SÉLECTIONNER interroger puis envoyer le résultat sous forme de code JSON au client via le /utilisateurs point final. Si vous redémarrez le serveur et accédez à la /utilisateurs page, vous verrez les mêmes données que précédemment, mais maintenant il est dynamique.

Utiliser les paramètres d'URL

Jusqu'ici, nos points de terminaison étaient des chemins statiques, soit le / racine ou /utilisateurs-mais qu'en est-il lorsque nous voulons voir des données uniquement sur un utilisateur spécifique? Nous aurons besoin d'utiliser un point de terminaison variable.

Pour nos utilisateurs, nous souhaitons peut-être extraire des informations sur chaque utilisateur en fonction de leur identifiant unique. Pour ce faire, nous utiliserions deux points (:) pour indiquer qu'il s'agit d'un paramètre de route.

// Affiche un seul utilisateur par identifiant app.get ('/ users /: id', (demande, réponse) => …); ); 

Nous pouvons récupérer le paramètre pour ce chemin avec le request.params propriété. Depuis le nôtre est nommé identifiant, ce sera comment nous nous référons à elle.

const id = request.params.id; 

Maintenant, nous allons ajouter un clause à notre SÉLECTIONNER instruction pour obtenir uniquement des résultats qui ont le spécifié identifiant.

Nous allons utiliser ? en tant qu'espace réservé pour éviter l'injection SQL et transmettre l'identifiant en tant que paramètre, au lieu de créer une chaîne concaténée, qui serait moins sécurisée.

pool.query ('SELECT * FROM utilisateurs WHERE id =?', id, (erreur, résultat) => si (erreur) renvoie une erreur; response.send (résultat);); 

Le code complet de notre ressource utilisateur individuelle ressemble maintenant à ceci:

// Affiche un seul utilisateur par ID app.get ('/ users /: id', (demande, réponse) => const id = request.params.id; pool.query ('SELECT * FROM utilisateurs WHERE id =? ', id, (error, result) => if (erreur) erreur de rejet; response.send (result););); 

Maintenant, vous pouvez redémarrer le serveur et accéder à http: // localhost / users / 2 pour ne voir que les informations pour Gilfoyle. Si vous obtenez une erreur comme Impossible d'obtenir / utilisateurs / 2, cela signifie que vous devez redémarrer le serveur.

Aller à cette URL devrait renvoyer un seul résultat.

[id: 2, nom: "Bertram Gilfoyle", email: "[email protected]"] 

Si c'est ce que vous voyez, félicitations: vous avez correctement configuré un paramètre de route dynamique.!

Envoi d'une demande POST

Jusqu'à présent, tout ce que nous avons fait a été utilisé OBTENIR demandes. Ces demandes sont sécurisées, ce qui signifie qu'elles ne modifient pas l'état du serveur. Nous avons simplement visualisé des données JSON.

Maintenant, nous allons commencer à rendre l’API vraiment dynamique en utilisant un POSTER demande d'ajouter de nouvelles données.

J'ai mentionné précédemment dans l'article de Understanding REST que nous n'utilisions pas de verbes comme ajouter ou effacer dans l'URL pour effectuer des actions. Afin d'ajouter un nouvel utilisateur à la base de données, nous allons POSTER à la même URL, nous les voyons depuis, mais nous venons de définir un itinéraire séparé pour cela.

// Ajouter un nouvel utilisateur app.post ('/ users', (demande, réponse) => …); 

Notez que nous utilisons app.post () au lieu de app.get () à présent.

Puisque nous créons au lieu de lire, nous allons utiliser un INSÉRER requête ici, un peu comme nous l'avons fait à l'initialisation de la base de données. Nous enverrons la totalité request.body jusqu'à la requête SQL.

pool.query ('INSERT INTO users SET?', request.body, (erreur, résultat) => si (erreur) génère une erreur; 

Nous allons également spécifier le statut de la réponse comme 201, Qui veut dire Créé. Pour obtenir l'identifiant du dernier élément inséré, nous allons utiliser le insertId propriété.

response.status (201) .send ('Utilisateur ajouté avec l'ID: $ result.insertId'); 

Notre ensemble POSTER recevoir le code ressemblera à ceci.

// Ajouter un nouvel utilisateur app.post ('/ users', (demande, réponse) => pool.query ('INSERT INTO users SET?', Request.body, (erreur, résultat) => if (erreur ) throw error; response.status (201) .send ('Utilisateur ajouté avec l'ID: $ result.insertId'););); 

Maintenant nous pouvons envoyer un POSTER demande par. La plupart du temps, lorsque vous envoyez un message POSTER demande, vous le faites via un formulaire Web. Nous allons apprendre à configurer cela d’ici la fin de cet article, mais le moyen le plus rapide et le plus simple d’envoyer un test POSTER est avec cURL, en utilisant le -d (--data) drapeau.

Nous allons courir curl -d, suivi d'une chaîne de requête contenant toutes les paires clé / valeur et le noeud final de la requête.

curl -d "name = Dinesh [email protected]" http: // localhost: 3002 / users 

Une fois cette demande envoyée, vous devriez obtenir une réponse du serveur..

Utilisateur ajouté avec l'ID: 3 

Si vous naviguez vers http: // localhost / users, vous verrez la dernière entrée ajoutée à la liste.

Envoi d'une demande PUT

POSTER est utile pour ajouter un nouvel utilisateur, mais nous voudrons utiliser METTRE modifier un utilisateur existant. METTRE est idempotent, ce qui signifie que vous pouvez envoyer la même demande plusieurs fois et qu’une seule action sera effectuée. Ceci est différent de POSTER, parce que si nous envoyions notre nouvelle demande d'utilisateur plus d'une fois, cela créerait de nouveaux utilisateurs.

Pour notre API, nous allons configurer METTRE pour pouvoir éditer un seul utilisateur, nous allons donc utiliser le : id paramètre de route cette fois.

Créons un METTRE À JOUR requête et assurez-vous qu'il ne s'applique qu'à l'ID demandé avec le clause. Nous utilisons deux ? espaces réservés, et les valeurs que nous transmettons iront dans un ordre séquentiel.

// Mettre à jour un utilisateur existant app.put ('/ users /: id', (demande, réponse) => const id = request.params.id; pool.query ('UPDATE users SET? WHERE id =?', [request.body, id], (error, result) => if (erreur) renvoie une erreur; response.send ('L'utilisateur a été correctement mis à jour.'););); 

Pour notre test, nous allons éditer l'utilisateur 2 et mettez à jour l'adresse électronique de [email protected] à [email protected]. Nous pouvons utiliser cURL à nouveau, avec le [-X (--quest)) drapeau, pour spécifier explicitement que nous envoyons une demande PUT via.

curl -X PUT -d "nom = Bertram Gilfoyle" -d "[email protected]" http: // localhost: 3002 / users / 2 

Assurez-vous de redémarrer le serveur avant d’envoyer la demande, sinon vous obtiendrez le Impossible de PUT / utilisateurs / 2 Erreur.

Vous devriez voir ceci:

Utilisateur mis à jour avec succès. 

Les données utilisateur avec id 2 devrait maintenant être mis à jour.

Envoi d'une demande DELETE

Notre dernière tâche pour compléter la fonctionnalité CRUD de l'API consiste à créer une option permettant de supprimer un utilisateur de la base de données. Cette demande utilisera le EFFACER Requête SQL avec , et il supprimera un utilisateur individuel spécifié par un paramètre de route.

// Supprimer un utilisateur app.delete ('/ users /: id', (demande, réponse) => const id = request.params.id; pool.query ('DELETE FROM users WHERE id =?', Id, (erreur, résultat) => si (erreur) renvoie une erreur; response.send ('Utilisateur supprimé.'););); 

On peut utiliser -X à nouveau avec cURL pour envoyer la suppression. Supprimons le dernier utilisateur créé.

curl -X DELETE http: // localhost: 3002 / users / 3 

Vous verrez le message de réussite.

Utilisateur supprimé. 

Aller vers http: // localhost: 3002, et vous verrez qu'il n'y a que deux utilisateurs maintenant.

Toutes nos félicitations! À ce stade, l'API est terminée. Visitez le dépôt GitHub pour voir le code complet de routes.js.

Envoi de demandes via le demande Module

Au début de cet article, nous avons installé quatre dépendances, l’une d’elles étant la demande module. Au lieu d'utiliser des requêtes cURL, vous pouvez créer un nouveau fichier avec toutes les données et l'envoyer. Je vais créer un fichier appelé post.js qui va créer un nouvel utilisateur via POSTER.

const request = require ('request'); const json = "name": "Dinesh Chugtai", "email": "[email protected]",; request.post (url: 'http: // localhost: 3002 / users', corps: json, json: true,, fonction (erreur, réponse, corps) console.log (corps);); 

Nous pouvons appeler cela en utilisant noeud post.js dans une nouvelle fenêtre de terminal lorsque le serveur est en cours d’exécution, et cela aura le même effet que cURL. Si quelque chose ne fonctionne pas avec cURL, le demande module est utile car nous pouvons voir l'erreur, la réponse et le corps.

Envoi de demandes via un formulaire Web

habituellement, POSTER et d'autres méthodes HTTP modifiant l'état du serveur sont envoyées à l'aide de formulaires HTML. Dans cet exemple très simple, nous pouvons créer un index.html déposer n'importe où et créer un champ pour un nom et une adresse électronique. L'action du formulaire pointera vers la ressource, dans ce cas http // localhost: 3002 / users, et nous allons spécifier la méthode comme poster.

Créer index.html et ajoutez-y le code suivant:

     API REST Node.js Express   

Ouvrez ce fichier HTML statique dans votre navigateur, remplissez-le et envoyez-le pendant que le serveur est en cours d'exécution sur le terminal. Vous devriez voir la réponse de Utilisateur ajouté avec l'ID: 4, et vous devriez pouvoir voir la nouvelle liste d'utilisateurs.

Conclusion

Dans ce didacticiel, nous avons appris à connecter un serveur Express à une base de données MySQL et à configurer des itinéraires correspondant à la OBTENIR, POSTER, METTRE, et EFFACER méthodes pour les chemins et les paramètres de route dynamique. Nous avons également appris à envoyer des requêtes HTTP à un serveur API à l’aide de cURL, le fichier Node.js. demande module et formulaires HTML.

À ce stade, vous devez bien comprendre le fonctionnement des API RESTful et créer votre propre API à part entière dans Node.js avec Express et MySQL.!