• 10 hours
  • Medium

Free online content available in this course.

course.header.alt.is_video

course.header.alt.is_certifying

Got it!

Last updated on 11/12/24

Acceptez les fichiers entrants avec multer

Dans cette dernière partie du cours, nous allons implémenter des téléchargements de fichiers pour que les utilisateurs puissent télécharger des images d'articles à vendre. Pour ce faire, nous utiliserons multer , un package qui nous permet de gérer les fichiers entrants dans les requêtes HTTP. Commençons par installer multer et par créer un élément de middleware pour gérer ces fichiers entrants.

Configurez le middleware de gestion des fichiers

Nous devrons d'abord installer multer dans notre projet :

npm install multer

Les images seront enregistrées dans un sous-dossier appelé images . Créez donc ce sous-dossier dans votre dossier backend .

Vous pouvez maintenant créer un middleware dans notre dossier middleware appelé multer-config.js :

const multer = require('multer');

const MIME_TYPES = {
  'image/jpg': 'jpg',
  'image/jpeg': 'jpg',
  'image/png': 'png'
};

const storage = multer.diskStorage({
  destination: (req, file, callback) => {
    callback(null, 'images');
  },
  filename: (req, file, callback) => {
    const name = file.originalname.split(' ').join('_');
    const extension = MIME_TYPES[file.mimetype];
    callback(null, name + Date.now() + '.' + extension);
  }
});

module.exports = multer({storage: storage}).single('image');

Dans ce middleware :

  1. Nous créons une constante storage , à passer à multer comme configuration, qui contient la logique nécessaire pour indiquer à multer où enregistrer les fichiers entrants :

    • la fonction destination indique à multer d'enregistrer les fichiers dans le dossier images ;

    • la fonction filename indique à multer d'utiliser le nom d'origine, de remplacer les espaces par des underscores et d'ajouter un timestamp Date.now() comme nom de fichier. Elle utilise ensuite la constante dictionnaire de type MIME pour résoudre l'extension de fichier appropriée.

  2. Nous exportons ensuite l'élément multer entièrement configuré, lui passons notre constante storage et lui indiquons que nous gérerons uniquement les téléchargements de fichiers image.

En résumé

  • multer est un package de gestion de fichiers.

  • Sa méthode diskStorage()  configure le chemin et le nom de fichier pour les fichiers entrants.

  • Sa méthode single()  crée un middleware qui capture les fichiers d'un certain type (passé en argument), et les enregistre au système de fichiers du serveur à l'aide du storage configuré.

Avant de pouvoir appliquer notre middleware à nos routes stuff , nous devrons les modifier quelque peu, car la structure des données entrantes n'est pas tout à fait la même avec des fichiers et des données JSON. Voyons ça dans le chapitre suivant ! 

Example of certificate of achievement
Example of certificate of achievement