Retour aux articles

Transformer des données d'API en CSV avec NodeJS

Je récupère les données d'une API pour les transformer en fichier CSV
7 minutes de lecture- 93 vues

J'ai récemment eu besoin de manipuler des données CSV avec NodeJS. Dans cet article, je vous propose de convertir les données d'une API en fichier CSV. J'utilise l'exemple d'une API, mais vous pouvez utiliser des données provenant d'une base de données.

Nous utiliserons csv-stringify qui répond totalement à notre besoin.

Retrouvez le guide vidéo sur YouTube !

Pré-requisHeader Icon

Configurer notre projet NodeJSHeader Icon

Nous allons générer une nouvelle application node.js afin de pouvoir installer la librairie csv-stringify. Pour ce faire, ouvrez votre terminal dans un dossier vite, et entez la commande suivante. Cela va créer un fichier package.json.


_10
mkdir json-to-csv # Commande optionnelle pour créer un nouveau dossier vide
_10
cd json-to-csv # Commande optionnelle pour entrer dans le dossier créé
_10
npm init -y

Il faut également modifier le fichier package.json et y copier la ligne "type":"module".

Voici à quoi ressemble un fichier bien configuré :


_15
{
_15
"name": "json-to-csv",
_15
"version": "1.0.0",
_15
"description": "",
_15
"main": "index.js",
_15
"type": "module",
_15
"scripts": {
_15
"test": "echo \"Error: no test specified\" && exit 1"
_15
},
_15
"keywords": [],
_15
"author": "",
_15
"license": "ISC",
_15
"dependencies": {
_15
}
_15
}

Nous avons terminé la configuration. Nous pouvons maintenant créer un nouveau fichier server.js qui va contenir le code source. Je vous conseille de l'ouvrir avec votre éditeur de code préféré (je recommande d'utiliser VSCode).

Récupération de la donnée APIHeader Icon

Pour pouvoir transformer notre donnée, nous devons d'abord la récupérer. J'utilise le site JSON Placeholder qui met à disposition des fausses données destinées à prototyper des projets.

Nous allons écrire une première fonction afin de récupérer une liste de posts grâce à la librairie fetch de Node. J'appelle ma fonction getPosts, elle est asynchrone et va utiliser fetch pour récupérer nos données depuis JSON Placeholder.

Si vous utilisez la version 18 de Node ou supérieur, la librairie fetch est maintenant implémentée par défaut.

J'utilise la version 16.7, et la librairie fetch n'est pas native à Node.JS. Nous devons la télécharger et l'importer dans notre application. Ouvrez votre terminal, et lancez la commande suivante :


_10
npm install node-fetch

Il suffit maintenant d'importer fetch à l'intérieur du fichier server.js.


_16
/* server.js */
_16
import fetch from 'node-fetch'; /* La librairie fetch n'est pas native à NodeJS dans la version 16.7 */
_16
_16
export const getPosts = async () => {
_16
/* Requête AJAX permettant de récupérer nos données */
_16
const response = await fetch('https://jsonplaceholder.typicode.com/posts');
_16
/* Nous convertissons la réponse en JSON */
_16
const posts = await response.json();
_16
/* Nous vérifions la récupération de notre donnée */
_16
console.log(posts);
_16
/* Nous renvoyons un tableau de posts */
_16
return posts;
_16
};
_16
_16
// N'oublions pas d'appeler la méthode pour s'assurer qu'elle fonctionne !
_16
getPosts();

Après avoir sauvegardé notre fichier, nous allons exécuter le code avec la commande node server.js. Nous devrions voir un tableau de posts dans notre terminal. Cela signifie que le projet est bien configuré !

Création de notre première route avec ExpressJSHeader Icon

Nous voulons pouvoir télécharger un fichier CSV depuis notre navigateur. Nous allons mettre en place plusieurs routes avec le serveur ExpressJS. Pour ce faire il suffit d'installer la librarie. Entrez la commande suivante dans votre invité de commande :


_10
npm i express

Express nous permet de définir des routes pour accéder à nos données sous forme d'API. Une route est un chemin d'accès qui associe une URL et une méthode à une action spécifique de l'application. Nous allons tout de suite créer notre première route /posts en GET pour pouvoir y accéder avec notre navigateur à l'adresse localhost:3000/posts.

La documentation officielle d'Express nous donne une base de code à exploiter. Nous allons le modifier légèrement.


_10
import express from 'express';
_10
const app = express();
_10
_10
app.get('/posts', async function (req, res) {
_10
const posts = await getPosts();
_10
res.send(posts);
_10
});
_10
_10
app.listen(3000);

Ci-dessus, nous importons la librarie express.

  • Nous créons une instance d'express dans la variable app.
  • Nous créons ensuite une route de type GET, à l'URL /posts
  • La fonction de rappel est asynchrone. Nous devons attendre de récupérer les données depuis notre API avant de pouvoir les traiter
  • Nous renvoyons la donnée telle quel sous forme de réponse avec la ligne res.send(posts);.
  • Nous demandons finalement à Express d'écouter les requêtes sur le port 3000

Nous pouvons modifier notre fichier server.js en conséquence :


_17
/* server.js */
_17
import express from 'express';
_17
const app = express();
_17
_17
app.get('/posts', async function (req, res) {
_17
const posts = await getPosts();
_17
res.send(posts);
_17
});
_17
_17
app.listen(3000);
_17
_17
export const getPosts = async () => {
_17
const response = await fetch('https://jsonplaceholder.typicode.com/posts');
_17
_17
const posts = await response.json();
_17
return posts;
_17
};

Convertir la donnée en CSVHeader Icon

Présentation de csv-stringifyHeader Icon

Nous venons de créer notre première route avec Express ! Mais cela ne répond pas encore à notre besoin. Nous souhaitons télécharger un fichier au format CSV correspondant à notre modèle de données. Nous avons besoin de télécharger une librairie supplémentaire pour effectuer la conversion. Nous pouvons installer csv-stringify dans notre terminal avec la commande suivante :


_10
npm i csv-stringify

Une fois installé, il est important de relancer notre serveur Express. La documentation officielle de csv-stringify nous donne une base de code suffisante pour notre besoin :


_10
import { stringify } from 'csv-stringify/sync';
_10
_10
const output = stringify([
_10
[ '1', '2', '3', '4' ],
_10
[ 'a', 'b', 'c', 'd' ]
_10
]);

Il suffit d'importer la méthode stringify depuis csv/stringify/sync et de passer en paramètre un tableau de données. Une fois les données converties au format csv, nous devons les renvoyer à l'utilisateur grâce à une nouvelle route Express.

Création d'une nouvelle routeHeader Icon

En dessous de notre première route, nous allons déclarer une deuxième route qui sera liée à l'URL /posts/csv.


_14
app.get('/posts/csv', async function (req, res) {
_14
const posts = await getPosts(); /* Récupération des données depuis notre API */
_14
/* Conversion de notre object clé-valeur en ligne au format CSV */
_14
const postsInCsv = stringify(posts, {
_14
header: true,
_14
});
_14
_14
/* L'en-tête Content-Type permet d'informer le navigateur du type de contenu */
_14
res.setHeader('Content-Type', 'text/csv');
_14
/* L'en-tête Content-Disposition permet de choisir la disposition de contenu : sous forme de page, ou sous forme de fichier */
_14
res.setHeader('Content-Disposition', 'attachment; filename=posts.csv');
_14
_14
res.send(postsInCsv);
_14
});

Revenons sur le code ci-dessus :

  • Nous déclarons une nouvelle route à l'URL /posts/csv avec la méthode GET
  • La fonction de rappel est asynchrone
  • Nous obtenons la donnée de posts depuis l'API, que nous sauvegardons dans une variable post avec l'instruction const posts = await getPosts()
  • Nous utilisons csv-stringify pour convertir notre object clé-valeur en valeurs séparées par des virgules.
  • La méthode stringify accepte un premier paramètre qui sera notre donnée de posts, et un tableau optionnel d'options. Nous souhaitons afficher l'en-tête dans le fichier CSV. Par défaut, l'en-tête sera les clés de notre object clé-valeur.
  • Avant de renvoyer la réponse au navigateur, nous spécifions un type de contenu grâce à l'en-tête Content-Type qui prend la valeur text/csv
  • L'en-tête Content-Disposition permet de changer la disposition du contenu : Accéder à la route ne va pas afficher une page, mais va à la place télécharger un fichier posts.csv
  • Nous pouvons ensuite renvoyer la réponse

Code completHeader Icon

Voici le code complet que nous venons de développer :


_30
import fetch from 'node-fetch';
_30
import { stringify } from 'csv-stringify/sync';
_30
import express from 'express';
_30
const app = express();
_30
_30
app.get('/posts', async function (req, res) {
_30
const posts = await getPosts();
_30
res.send(posts);
_30
});
_30
_30
app.get('/posts/csv', async function (req, res) {
_30
const posts = await getPosts();
_30
_30
const postsInCsv = stringify(posts, {
_30
header: true,
_30
});
_30
_30
res.setHeader('Content-Type', 'text/csv');
_30
res.setHeader('Content-Disposition', 'attachment; filename=posts.csv');
_30
_30
res.send(postsInCsv);
_30
});
_30
app.listen(3000);
_30
_30
export const getPosts = async () => {
_30
const response = await fetch('https://jsonplaceholder.typicode.com/posts');
_30
_30
const posts = await response.json();
_30
return posts;
_30
};

En résumé, nous avons chargé des données API avec JSONPlaceholder. Nous avons eu besoin d'installer la librairie fetch qui n'est pas native avant la version 18 de NodeJS. Nous utilisons la librairie ExpressJS pour créer des routes afin d'accéder à nos données depuis le navigateur. Nous transformons nos données JSON au format CSV avec la librairie csv-stringify, que nous renvoyons ensuite au navigateur au format CSV. Nous donnons l'instruction au navigateur de télécharger le fichier avec l'en-tête Content-Disposition.

Nous avons réussi la conversion de notre donnée d'API JSON en fichier CSV téléchargeable !

J'espère que ce guide vous a été utile. Merci aux contributeurs du projet qui proposent également d'autres librairies, permettant de manipuler davantage de fichiers CSV.

Articles similaires
Formation NestJS 2024
7 minutes de lecture - 203 vuesNestJSNodeJS

Créer un serveur API avec NestJS : le guide ultime

Découvre comment utiliser NestJS, un puissant framework NodeJS. Il donne une base de code solide pour développer un serveur API en NodeJS. Il inclut générateur de projet pré-configuré, Typescript, Prettier, Eslint et Docker.

Rejoins la

newsletter