Le guide ultime de l'API Node Fetch : Effectuer des requêtes HTTP en Node.js

Les requêtes HTTP sont un élément fondamental du développement web moderne. Avec l'introduction de l'API Fetch dans Node.js, les développeurs disposent désormais d'un moyen puissant et cohérent d'effectuer des requêtes réseau dans les environnements de navigateur et de serveur. Dans ce tutoriel complet, nous allons explorer comment utiliser Node fetch efficacement dans vos projets.

Qu'est-ce que l'API Node Fetch et pourquoi devriez-vous l'utiliser ?

L'API Node fetch est un mécanisme moderne, basé sur les promesses, pour effectuer des requêtes HTTP dans les applications Node.js. À l'origine une fonctionnalité réservée aux navigateurs, fetch est devenu une fonctionnalité expérimentale dans Node.js v18 et a atteint la stabilité dans Node.js v21.

Principaux avantages de l'utilisation de Node Fetch :

Fonctionnalité intégrée : pas besoin d'installer des packages tiers
Basé sur les promesses : syntaxe propre et moderne avec prise en charge async/await
Familiarité multiplateforme : même API que fetch côté navigateur
Performances améliorées : basé sur le client HTTP Undici hautes performances

Tester vos requêtes d'API Node Fetch avec des outils modernes

Tout en apprenant à utiliser Node fetch, il est essentiel de disposer d'outils fiables pour tester vos points de terminaison d'API. Apidog se distingue comme la meilleure alternative à Postman pour tester et documenter vos requêtes d'API Node fetch.

En tant que plateforme de développement d'API tout-en-un, Apidog combine la documentation, les tests et les serveurs simulés d'API dans une seule interface intuitive.

Lors du développement d'applications avec Node fetch, Apidog vous aide à visualiser les réponses, à collaborer avec les membres de l'équipe et à vous assurer que vos appels d'API fonctionnent correctement avant de les implémenter dans le code. Sa capacité à générer des extraits de code pour les requêtes Node fetch rend la transition des tests à l'implémentation transparente.

button

Configuration de votre environnement pour Node Fetch

Conditions préalables à l'utilisation de Node Fetch

Avant de vous plonger dans les exemples de Node fetch, assurez-vous d'avoir :

Node.js v18 ou supérieur (de préférence v21+ pour une prise en charge stable de fetch)
Vérifiez votre version de Node.js :

node -v

Compatibilité des versions de Node Fetch

Node.js v21+ : Fetch est stable et prêt pour une utilisation en production
Node.js v18-v20 : Fetch est disponible mais expérimental (utilisez l'indicateur -experimental-fetch)
Anciennes versions de Node.js : installez le package node-fetch ou mettez à niveau Node.js

Si vous utilisez v18-v20, exécutez vos applications avec :

node --experimental-fetch app.js

Effectuer votre première requête Node Fetch

Commençons par une requête GET de base en utilisant Node fetch :

// Requête GET de base avec Node fetch
fetch('<https://api.example.com/data>')
  .then(response => {
    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }
    return response.json(); // Parse JSON response
  })
  .then(data => {
    console.log('Data received:', data);
  })
  .catch(error => {
    console.error('Fetch error:', error);
  });

Utilisation de Node Fetch avec Async/Await

Pour un code plus propre, vous pouvez utiliser async/await avec Node fetch :

async function fetchData() {
  try {
    const response = await fetch('<https://api.example.com/data>');

    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }

    const data = await response.json();
    console.log('Data received:', data);
    return data;
  } catch (error) {
    console.error('Fetch error:', error);
  }
}

// Call the function
fetchData();

Méthodes de requête Node Fetch avancées

Effectuer des requêtes POST avec Node Fetch

async function postData(url, data) {
  try {
    const response = await fetch(url, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify(data),
    });

    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }

    return await response.json();
  } catch (error) {
    console.error('Fetch POST error:', error);
  }
}

// Example usage
const newUser = {
  name: 'John Doe',
  email: 'john@example.com',
};

postData('<https://api.example.com/users>', newUser)
  .then(data => console.log('User created:', data));

Requêtes PUT avec Node Fetch

async function updateData(url, data) {
  try {
    const response = await fetch(url, {
      method: 'PUT',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify(data),
    });

    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }

    return await response.json();
  } catch (error) {
    console.error('Fetch PUT error:', error);
  }
}

// Example usage
const updatedUser = {
  id: 1,
  name: 'Jane Smith',
  email: 'jane@example.com',
};

updateData('<https://api.example.com/users/1>', updatedUser)
  .then(data => console.log('User updated:', data));

Requêtes DELETE avec Node Fetch

async function deleteResource(url) {
  try {
    const response = await fetch(url, {
      method: 'DELETE',
    });

    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }

    // Some APIs return no content on DELETE
    if (response.status === 204) {
      return { success: true };
    }

    return await response.json();
  } catch (error) {
    console.error('Fetch DELETE error:', error);
  }
}

// Example usage
deleteResource('<https://api.example.com/users/1>')
  .then(result => console.log('Delete result:', result));

Gestion de différents types de réponses avec Node Fetch

Node fetch peut fonctionner avec différents formats de réponse :

Gestion des réponses JSON

fetch('<https://api.example.com/data>')
  .then(response => response.json())
  .then(data => console.log(data));

Gestion des réponses texte

fetch('<https://example.com/plain-text>')
  .then(response => response.text())
  .then(text => console.log(text));

Gestion des données binaires

fetch('<https://example.com/image.png>')
  .then(response => response.arrayBuffer())
  .then(buffer => {
    // Handle binary data
    const bytes = new Uint8Array(buffer);
    console.log('Binary data length:', bytes.length);
  });

Personnalisation des requêtes Node Fetch avec des en-têtes et des options

Définition d'en-têtes personnalisés

fetch('<https://api.example.com/protected-data>', {
  headers: {
    'Authorization': 'Bearer YOUR_TOKEN_HERE',
    'Content-Type': 'application/json',
    'Accept': 'application/json',
    'User-Agent': 'My Node.js Application'
  }
})
.then(response => response.json())
.then(data => console.log(data));

Configuration des options de requête

fetch('<https://api.example.com/data>', {
  method: 'GET',
  headers: { 'Content-Type': 'application/json' },
  cache: 'no-cache',
  redirect: 'follow',      // follow, error, or manual
  referrerPolicy: 'no-referrer'
})
.then(response => response.json())
.then(data => console.log(data));

Gestion des erreurs avec Node Fetch

Gestion complète des erreurs

Un aspect important à comprendre à propos de Node fetch est qu'il ne rejette pas les codes d'état d'erreur HTTP. La promesse ne rejette que les erreurs réseau ou si quelque chose a empêché la requête de se terminer.

Voici une approche complète de la gestion des erreurs :

async function fetchWithErrorHandling(url) {
  try {
    const response = await fetch(url);

    // Check for HTTP errors
    if (!response.ok) {
      // Attempt to get error details from response
      let errorDetails;
      try {
        errorDetails = await response.json();
      } catch (e) {
        errorDetails = await response.text();
      }

      throw new Error(
        `HTTP error! Status: ${response.status}, Details: ${
          typeof errorDetails === 'object'
            ? JSON.stringify(errorDetails)
            : errorDetails
        }`
      );
    }

    return await response.json();
  } catch (error) {
    // Network errors, parsing errors, and our custom HTTP errors
    console.error('Fetch failed:', error.message);
    throw error; // Re-throw to allow calling code to handle
  }
}

Implémentation du délai d'attente de requête avec Node Fetch

Node fetch n'a pas de prise en charge intégrée des délais d'attente, mais vous pouvez l'implémenter à l'aide d'AbortController :

async function fetchWithTimeout(url, options = {}, timeoutMs = 5000) {
  const controller = new AbortController();
  const { signal } = controller;

  // Set up timeout
  const timeout = setTimeout(() => {
    controller.abort();
  }, timeoutMs);

  try {
    const response = await fetch(url, { ...options, signal });
    clearTimeout(timeout); // Clear timeout if fetch completes

    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }

    return await response.json();
  } catch (error) {
    clearTimeout(timeout);
    if (error.name === 'AbortError') {
      throw new Error(`Request timed out after ${timeoutMs}ms`);
    }
    throw error;
  }
}

// Example usage
fetchWithTimeout('<https://api.example.com/data>', {}, 3000)
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error.message));

Gestion de l'authentification avec Node Fetch

Authentification de base

const username = 'user';
const password = 'password';
const credentials = Buffer.from(`${username}:${password}`).toString('base64');

fetch('<https://api.example.com/protected>', {
  headers: {
    'Authorization': `Basic ${credentials}`
  }
})
.then(response => response.json())
.then(data => console.log(data));

Authentification par jeton porteur

const token = 'your_jwt_or_oauth_token';

fetch('<https://api.example.com/protected>', {
  headers: {
    'Authorization': `Bearer ${token}`
  }
})
.then(response => response.json())
.then(data => console.log(data));

Meilleures pratiques pour l'utilisation de Node Fetch en production

Vérifiez toujours l'état de la réponse : ne supposez pas que les réponses sont réussies
Gérez correctement les différents types de contenu : utilisez la méthode correcte pour votre type de réponse (json(), text(), etc.)
Implémentez une gestion appropriée des erreurs : créez des fonctions utilitaires qui gèrent les erreurs de manière cohérente
Définissez des délais d'attente de requête : empêchez les requêtes en attente avec AbortController
Créez des wrappers fetch réutilisables : créez une couche de service avec des modèles de requête courants
Envisagez une logique de nouvelle tentative pour les requêtes ayant échoué : implémentez un repli exponentiel pour les API instables
Utilisez des variables d'environnement pour les URL de base : conservez les URL spécifiques à l'environnement en dehors du code

Dépannage courant de Node Fetch

Erreur « Fetch n'est pas défini »

Si vous rencontrez ReferenceError: fetch is not defined, vérifiez :

Vous utilisez Node.js v18+
Pour Node.js v18-v20, utilisez l'indicateur -experimental-fetch
Pour les anciennes versions, installez le package node-fetch

Problèmes de certificat HTTPS

Node fetch hérite de la gestion des certificats HTTPS de Node. Pour les certificats personnalisés :

const https = require('https');
const fs = require('fs');

const httpsAgent = new https.Agent({
  ca: fs.readFileSync('./custom-certificate.pem')
});

fetch('<https://api.example.com/data>', {
  agent: httpsAgent
})
.then(response => response.json())
.then(data => console.log(data));

Conclusion : adopter Node Fetch dans vos projets

L'API Node fetch représente une amélioration significative de la façon dont nous effectuons des requêtes HTTP dans les applications Node.js. Avec son interface basée sur les promesses, son comportement cohérent sur toutes les plateformes et son implémentation native, elle devient le choix préféré pour le développement Node.js moderne.

En maîtrisant Node fetch, vous pouvez créer un code plus maintenable qui tire parti des fonctionnalités JavaScript modernes tout en bénéficiant de performances améliorées par rapport aux anciennes bibliothèques clientes HTTP. Au fur et à mesure que l'implémentation stable continue de mûrir dans Node.js, nous pouvons nous attendre à ce que encore plus de développeurs adoptent cette puissante API comme approche standard pour effectuer des requêtes HTTP.

Maintenant que vous avez une compréhension complète de Node fetch, vous êtes prêt à l'implémenter dans vos propres projets et à profiter de cette puissante API pour tous vos besoins de requêtes HTTP.

button