Ce tutoriel vous guide dans la création d'un système de téléchargement de fichiers à l'aide de Node.js, Express et Multer. Nous couvrirons les téléchargements de fichiers uniques et multiples, et nous ferons même de la démonstration de stockage d'images dans une base de données MongoDB pour une récupération ultérieure.
Tout d'abord, configurez votre projet:
mkdir upload-express cd upload-express npm init -y npm install express multer mongodb file-system --save touch server.js mkdir uploads
Ensuite, créez votre fichier server.js
. Cela gérera les téléchargements de fichiers et la logique du serveur. Initialement, nous créerons une application Express de base:
const express = require('express'); const multer = require('multer'); const app = express(); app.get('/', (req, res) => { res.json({ message: 'WELCOME' }); }); app.listen(3000, () => console.log('Server started on port 3000'));
Maintenant, configurons Multer pour gérer les téléchargements de fichiers sur disque:
//server.js (add this to your existing server.js) var storage = multer.diskStorage({ destination: function (req, file, cb) { cb(null, 'uploads') }, filename: function (req, file, cb) { cb(null, file.fieldname + '-' + Date.now()) } }); var upload = multer({ storage: storage });
Créez un point de terminaison pour gérer les téléchargements de fichiers uniques. N'oubliez pas de créer un <form></form>
correspondant avec une entrée de fichier dans votre index.html
(non illustré ici, mais devrait utiliser une demande de post à /uploadfile
).
//server.js (add this to your existing server.js) app.post('/uploadfile', upload.single('myFile'), (req, res, next) => { const file = req.file; if (!file) { const error = new Error('Please upload a file'); error.httpStatusCode = 400; return next(error); } res.send(file); });
Ce point de terminaison gère le téléchargement de plusieurs fichiers (jusqu'à 12 dans cet exemple):
//server.js (add this to your existing server.js) app.post('/uploadmultiple', upload.array('myFiles', 12), (req, res, next) => { const files = req.files; if (!files) { const error = new Error('Please choose files'); error.httpStatusCode = 400; return next(error); } res.send(files); });
Pour stocker des images dans MongoDB, nous devrons installer le package mongodb
:
npm install mongodb --save
Ensuite, ajoutez la connexion MongoDB et la logique de gestion de l'image à server.js
. (Remarque: les détails de gestion des erreurs et de connexion sont omis pour la concision. Remplacez les espaces réservés comme <your_mongodb_connection_string></your_mongodb_connection_string>
par votre chaîne de connexion réelle).
const { MongoClient } = require('mongodb'); const fs = require('file-system'); // For file system operations // ... (previous code) ... const client = new MongoClient("<your_mongodb_connection_string>"); // ... (rest of your code) ... app.post('/uploadImage', upload.single('myImage'), async (req, res) => { try { await client.connect(); const db = client.db('your_database_name'); const imageBuffer = fs.readFileSync(req.file.path); const result = await db.collection('images').insertOne({ image: { filename: req.file.filename, buffer: imageBuffer } }); res.send(result); } catch (error) { console.error(error); res.status(500).send("Error uploading image"); } finally { await client.close(); } }); app.get('/photos', async (req, res) => { try { await client.connect(); const db = client.db('your_database_name'); const result = await db.collection('images').find().toArray(); const imgArray = result.map(element => element._id); res.send(imgArray); } catch (error) { console.error(error); res.status(500).send("Error retrieving images"); } finally { await client.close(); } }); app.get('/photo/:id', async (req, res) => { try { await client.connect(); const db = client.db('your_database_name'); const result = await db.collection('images').findOne({ _id: new ObjectId(req.params.id) }); res.contentType('image/jpeg'); // Adjust content type as needed res.send(result.image.buffer); } catch (error) { console.error(error); res.status(500).send("Error retrieving image"); } finally { await client.close(); } }); // ... (rest of your code) ...</your_mongodb_connection_string>
N'oubliez pas d'installer les packages mongodb
et file-system
. Remplacez également les espaces réservés par votre nom de base de données et votre chaîne de connexion. Cet exemple amélioré comprend la gestion des erreurs et les opérations asynchrones pour une meilleure robustesse.
Ce tutoriel amélioré fournit une solution plus complète et robuste pour gérer les téléchargements de fichiers dans une application Node.js. N'oubliez pas d'adapter le code à vos besoins et à l'environnement spécifiques. Prioriser toujours les meilleures pratiques de sécurité lors de la gestion des téléchargements de fichiers en production.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!