Que prend la méthode fetch?

La méthode fetch accepte un argument obligatoire — le chemin de la requête (RequestInfo ou URL) — et un argument optionnel — un objet de configuration (RequestInit).

Argument obligatoire (input) :

• Chaîne : URL de la ressource.
• Objet Request : Instance de la classe Request, offrant une configuration plus flexible de la requête (en-têtes, méthode, etc.).

Argument optionnel (init) : Un objet avec des champs décrivant la configuration de la requête. Quelques champs couramment utilisés :

• method : Méthode HTTP de la requête (GET, POST, PUT, DELETE, OPTIONS, etc.).
• headers : En-têtes de la requête. Peut être un objet clé-valeur ou une instance de la classe Headers.
• body : Corps de la requête (pour des méthodes autres que GET ou HEAD). Peut être une chaîne, ArrayBuffer, TypedArray, DataView, Blob, FormData, URLSearchParams ou ReadableStream.
• mode : Mode de la requête (cors, no-cors, same-origin, navigate).
• credentials : Configuration pour l'envoi des identifiants (omit, same-origin, include).
• cache : Configuration du cache (default, no-store, reload, no-cache, force-cache, only-if-cached).
• redirect : Comment gérer les redirections (follow, error, manual).
• referrer : Valeur pour l'en-tête Referer.
• referrerPolicy : Politique d'envoi de l'en-tête Referer.
• integrity : Valeur pour l'en-tête Integrity. Utilisé pour l'intégrité des sous-ressources.
• keepalive : Valeur booléenne indiquant que la requête doit rester active après la fermeture de la page (pour l'envoi d'analyses ou de rapports).
• signal : Instance de AbortSignal pour annuler la requête.
• window : Objet Window associé à la requête (par défaut, la fenêtre courante).

Exemple d'utilisation :

// Requête GET
fetch('/api/users')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Erreur:', error));

// Requête POST avec corps et en-têtes
fetch('/api/products', {
  method: 'POST', // Méthode HTTP
  headers: {
    'Content-Type': 'application/json', // Type de données envoyées
    'Authorization': 'Bearer your_token' // Exemple d'en-tête d'autorisation
  },
  body: JSON.stringify({ name: 'Nouveau produit', price: 100 }) // Corps de la requête
})
  .then(response => {
    if (!response.ok) {
      throw new Error(`Erreur HTTP! statut : ${response.status}`);
    }
    return response.json();
  })
  .then(data => console.log('Succès:', data))
  .catch(error => console.error('Erreur:', error));