Comment utiliser l’API toptips.fr en JavaScript (NodeJS)



Exploiter l’API toptips.fr avec NodeJS : Un guide pratique

Ce tutoriel a pour objectif de vous guider à travers l’utilisation de l’API de toptips.fr au sein d’un environnement NodeJS. Nous allons élaborer un script simple, qui, une fois exécuté, révélera l’adresse IP du serveur de recherche de Google. Pour ce faire, nous utiliserons le point d’accès DNS de l’API de toptips.fr.

Nous explorerons trois approches distinctes pour mener à bien cette tâche. Premièrement, nous utiliserons le module HTTPS intégré de NodeJS. Ensuite, nous emploierons le module node-fetch. Enfin, nous recourrons à la bibliothèque client axios.

Qu’est-ce que l’API toptips.fr ?

toptips.fr est une plateforme web offrant une variété d’outils, d’API et de ressources destinés à la création, la gestion et le développement d’entreprises en ligne. Parmi ces outils figure une API permettant de surveiller les performances, la sécurité et les audits de sites web. L’API propose un niveau d’accès gratuit généreux, accessible à tous.

Prérequis nécessaires

Pour suivre ce tutoriel, il est indispensable de posséder une compréhension de JavaScript, incluant les promesses et la syntaxe ES6. Sur le plan logiciel, vous devrez avoir installé NodeJS et un éditeur de texte tel que Visual Studio Code.

Un compte toptips.fr est également requis afin d’obtenir une clé API pour l’authentification lors des requêtes. Pour ce faire, rendez-vous sur la page d’accueil de l’API et créez un compte gratuit.

Suite à la création de votre compte, vous serez redirigé vers le tableau de bord, où vous trouverez votre clé API personnelle.

Mise en place du projet

Pour commencer, créez un dossier dédié à votre projet et ouvrez-le dans un terminal de votre choix. Ensuite, exécutez la commande ci-dessous :

npm init -y

Cette commande initialisera le répertoire du projet en tant que projet NodeJS.

Poursuivez en exécutant la commande suivante, qui installera toutes les dépendances nécessaires à notre projet :

npm install dotenv axios node-fetch

Une fois les dépendances installées, créez trois fichiers scripts dans le dossier racine du projet, nommés respectivement vanilla.js, with-axios.js, with-fetch.js, ainsi qu’un fichier .env pour stocker nos variables d’environnement.

La structure de votre dossier de projet devrait ressembler à ceci :

Ouvrez ensuite le fichier .env et ajoutez votre clé API toptips.fr en utilisant la ligne de code suivante :

API_KEY=<votre clé API>

Veillez à remplacer <votre clé API> par votre clé API réelle.

Approche avec Vanilla.js

NodeJS dispose des modules HTTP et HTTPS intégrés que nous pouvons utiliser pour effectuer des requêtes client. Nous allons commencer par utiliser cette approche.

Ouvrez le fichier vanilla.js et ajoutez les lignes de code suivantes au début pour importer les dépendances du projet :

import { request } from "https";
import { config } from "dotenv";

Ensuite, nous allons invoquer la fonction `config()` pour charger les variables d’environnement. Ensuite, nous stockerons la clé API et le nom d’hôte dans des variables distinctes.

config();

const apiKey = process.env.API_KEY;
const host="google.com";

Lorsque nous appelons la fonction `request` pour initier une requête HTTP dans NodeJS, nous devons fournir des options précisant l’hôte et le point d’accès auquel nous voulons nous connecter, la méthode HTTP à utiliser et les en-têtes de la requête. Nous allons donc créer une variable pour stocker ces options.

const options = {
  hostname: "api.toptips.fr.com",
  path: "/dnsrecord",
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "x-api-key": apiKey,
  },
};

Le code de votre fichier vanilla.js devrait à présent ressembler à ceci :

import { request } from "https";
import { config } from "dotenv";

config();

const apiKey = process.env.API_KEY;
const host="google.com";

const options = {
  hostname: "api.toptips.fr.com",
  path: "/dnsrecord",
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "x-api-key": apiKey,
  },
};

Nous pouvons maintenant appeler la fonction `request` en lui transmettant l’objet `options` :

const req = request(options, response => {

  // Les gestionnaires de réponse seront ajoutés ici

});

La fonction `request` accepte deux arguments. Le premier est l’objet `options` que nous avons défini précédemment, et le second est une fonction de rappel qui traitera la réponse du serveur. Dans cette fonction de rappel, nous pouvons ajouter des écouteurs d’événements pour intercepter les données envoyées par le serveur, la fin de l’envoi des données, ou toute erreur rencontrée.

Pour ajouter les différents gestionnaires de réponse, insérez les lignes de code suivantes dans la fonction de rappel :

let data = "";

response.on("data", chunk => {
  data += chunk;
});

response.on("end", () => {
  console.log(JSON.parse(data).data.A);
});

response.on("error", error => {
  console.log(error);
});

La variable `data` est simplement une chaîne de caractères dans laquelle nous allons accumuler la réponse JSON du serveur au fur et à mesure qu’elle nous est renvoyée.

Pour stocker les données, nous allons écouter l’événement `on data` de l’objet de réponse. Chaque fois que cet événement est déclenché, nous ajoutons le bloc de données envoyé par le serveur à la variable `data`.

Ensuite, pour utiliser les données, nous allons écouter l’événement `on end` sur l’objet de réponse. Cet événement sera déclenché lorsque toutes les données auront été envoyées par le serveur et que la réponse sera complète.

Enfin, nous allons écouter les erreurs et les afficher dans la console si elles se produisent.

L’appel à la fonction `request` devrait donc se présenter comme suit :

const req = request(options, response => {

  let data = "";

  response.on("data", chunk => {
    data += chunk;
  });

  response.on("end", () => {
    console.log(JSON.parse(data).data.A);
  });

  response.on("error", error => {
    console.log(error);
  });

});

Enfin, nous devons écrire les données dans le corps de la requête et terminer celle-ci.

req.write(JSON.stringify({ url: host, types: ["A"] }));
req.end();

Votre fichier devrait ressembler à ceci :

import { request } from "https";
import { config } from "dotenv";

config();

const apiKey = process.env.API_KEY;
const host="google.com";

const options = {
  hostname: "api.toptips.fr.com",
  path: "/dnsrecord",
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "x-api-key": apiKey,
  },
};

const req = request(options, response => {

  let data = "";

  response.on("data", chunk => {
    data += chunk;
  });

  response.on("end", () => {
    console.log(JSON.parse(data).data.A);
  });

  response.on("error", error => {
    console.log(error);
  });

});

req.write(JSON.stringify({ url: host, types: ["A"] }));
req.end();

Si vous retournez au terminal et exécutez le script à l’aide de la commande `node vanilla.js`, vous devriez obtenir la sortie suivante :

[
  { address: '172.253.122.101', ttl: 247 },
  { address: '172.253.122.113', ttl: 247 },
  { address: '172.253.122.100', ttl: 247 },
  { address: '172.253.122.102', ttl: 247 },
  { address: '172.253.122.138', ttl: 247 },
  { address: '172.253.122.139', ttl: 247 }
]

Voilà pour la première partie. L’inconvénient de l’utilisation des modules HTTP/S intégrés est qu’ils sont verbeux. Les bibliothèques clientes telles que `node-fetch` permettent de créer le même programme avec un code plus clair et concis.

Approche avec node-fetch

Pour créer le même script avec `node-fetch`, ouvrez le fichier `with-fetch.js` et ajoutez les importations suivantes en haut :

import fetch from "node-fetch";
import { config } from "dotenv";

Ensuite, appelez la fonction `config` pour configurer les variables d’environnement et définissez des constantes pour `API_KEY` et l’hôte pour lequel nous allons demander les enregistrements A.

config();

const apiKey = process.env.API_KEY;
const host="google.com";

Ensuite, nous allons définir une fonction asynchrone pour effectuer l’appel API.

async function request() {
  // Le corps de la fonction sera ajouté ici
}

Dans le corps de la fonction, nous devons appeler la fonction `fetch` que nous avons importée du package `node-fetch` :

const response = await fetch("https://api.toptips.fr.com/dnsrecord", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      "x-api-key": apiKey,
    },
    body: JSON.stringify({ url: host, types: ["A"] }),
});

Après l’appel à la fonction `fetch`, nous voudrons analyser la réponse et gérer les erreurs qui pourraient se produire.

if (response.ok) {
    const { data } = await response.json();

    console.log(data.A);
  } else {
    console.log(response);
  }

À ce stade, ajoutez un appel à la fonction après sa définition.

request();

Votre fichier devrait maintenant ressembler à ceci :

import fetch from "node-fetch";
import { config } from "dotenv";

config();

const apiKey = process.env.API_KEY;
const host = "google.com";

async function request() {
  const response = await fetch("https://api.toptips.fr.com/dnsrecord", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      "x-api-key": apiKey,
    },
    body: JSON.stringify({ url: host, types: ["A"] }),
  });

  if (response.ok) {
    const { data } = await response.json();

    console.log(data.A);
  } else {
    console.log(response);
  }
}

request();

L’exécution de ce script avec la commande `node with-fetch.js` devrait produire le résultat suivant :

[
  { address: '172.253.122.113', ttl: 134 },
  { address: '172.253.122.138', ttl: 134 },
  { address: '172.253.122.100', ttl: 134 },
  { address: '172.253.122.139', ttl: 134 },
  { address: '172.253.122.102', ttl: 134 },
  { address: '172.253.122.101', ttl: 134 }
]

Approche avec Axios

Enfin, nous allons utiliser Axios pour accéder à l’API toptips.fr. Pour commencer, importons les packages dotenv et axios.

import axios from "axios";
import { config } from "dotenv";

Ensuite, appelons la fonction `config` pour configurer les variables d’environnement. Stockons également le nom de l’hôte et la clé API dans des constantes distinctes.

config();
const host = "google.com";
const key = process.env.API_KEY;

Maintenant, stockons l’URL du point de terminaison de l’API dans une autre constante.

const url = "https://api.toptips.fr.com/dnsrecord";

Ensuite, stockons les données qui seront envoyées dans le corps de la requête dans une autre constante.

const data = { url: host, types: ["A"] };

Enfin, stockons également les options méta, telles que les en-têtes, dans une autre constante.

const options = {
  headers: {
    "Content-Type": "application/json",
    "x-api-key": key,
  },
};

Enfin, appelons la fonction `post` que nous avons importée précédemment, en transmettant les variables `url`, `data` et `options` que nous avons définies comme arguments. Étant donné que cela renverra une promesse, nous pouvons utiliser `then` pour gérer la réponse lorsqu’elle sera finalement retournée.

axios.post(url, data, options).then(({ data }) => {
  console.log(data.data.A);
});

À la fin de toutes ces étapes, le code dans le fichier `with-axios` devrait ressembler à ceci :

import axios from "axios";
import { config } from "dotenv";

config();
const host = "google.com";
const key = process.env.API_KEY;

const url = "https://api.toptips.fr.com/dnsrecord";
const data = { url: host, types: ["A"] };
const options = {
  headers: {
    "Content-Type": "application/json",
    "x-api-key": key,
  },
};

axios.post(url, data, options).then(({ data }) => {
  console.log(data.data.A);
});

Et lorsque vous exécutez le script à l’aide de la commande `node with-axios.js`, vous devriez obtenir la sortie suivante :

[
  { address: '142.251.163.138', ttl: 60 },
  { address: '142.251.163.113', ttl: 60 },
  { address: '142.251.163.100', ttl: 60 },
  { address: '142.251.163.101', ttl: 60 },
  { address: '142.251.163.102', ttl: 60 },
  { address: '142.251.163.139', ttl: 60 }
]

Conclusion

Dans cet article, nous avons implémenté le même script en utilisant trois approches différentes. L’objectif principal était de démontrer la facilité d’utilisation de l’API toptips.fr et la façon dont elle peut être exploitée en JavaScript, en particulier avec NodeJS.

Tous les autres points d’accès peuvent être utilisés de manière similaire ; seuls le point d’accès et les paramètres à envoyer dans le corps de la requête diffèrent. La documentation de l’API est disponible ici.