Explication détaillée de l'utilisation de nodejs+express pour implémenter une fonction de téléchargement de fichiers simple

Cet article présente principalement la fonction simple de téléchargement de fichiers utilisant nodejs+express. Les amis qui en ont besoin peuvent s'y référer. J'espère que cela pourra aider tout le monde.

1. Créer un projet express

express -e nodejs-uploadfile

2. Télécharger le middleware Multer

npm i multer or yarn multer

3. Référencez multer dans routes/index.js Puisque les opérations sur les fichiers sont également utilisées, vous devez également référencer le module fs et spécifier le répertoire de téléchargement de fichiers

const multer = require('multer');
const fs = require('fs');
const UPLOAD_PATH = './uploads'

Téléchargement de fichier unique : les fichiers dans index.html sont les suivants (le type de fichier de formulaire doit être enctype="multipart/form-data") ,

<form action="/upload" method="post" enctype="multipart/form-data">
 <input name="fileUpload" type="file" />
 <img src="" alt="">
 <button type="submit">上传</button>
</form>

Ajouter la route de téléchargement dans routes/index.js pour gérer l'opération de téléchargement de fichiers

router.post('/upload', upload.single('fileUpload'), function (req, res, next) {
 const { file } = req;
 fs.readFile(file.path, function(err, data) {
 fs.writeFile(`${UPLOAD_PATH}/${file.originalname}`, data, function (err) {
  if (err) res.json({ err })
  res.json({
  msg: '上传成功'
  });
 });
 })
})

Si le fichier téléchargé est une image, vous pouvez également utiliser l'objet FileReader pour prévisualiser l'image

(function($){
 $('input').on('change', function(event) {
 var files = event.target.files,
  reader = new FileReader();
 if(files && files[0]){
  reader.onload = function (ev) {
   $('img').attr('src', ev.target.result);
  }
  reader.readAsDataURL(files[0]);
 }
 })
}(jQuery))

Téléchargement de fichiers multiples : Le principe du multi- téléchargement de fichiers et principe du téléchargement de fichiers uniques Idem, le code est le suivant :

router.post('/upload', upload.array('fileUpload'), function (req, res, next) {
 const files = req.files;
 const response = [];
 const result = new Promise((resolve, reject) => {
 files.map((v) => {
  fs.readFile(v.path, function(err, data) {
  fs.writeFile(`${UPLOAD_PATH}/${v.originalname}`, data, function(err, data) {
   const result = {
   file: v,
   }
   if (err) reject(err);
   resolve('成功');
  })
  })
 })
 })
 result.then(r => {
 res.json({
  msg: '上传成功',
 })
 }).catch(err => {
 res.json({ err })
 });
})

Le code associé se trouve sur github.com/bWhirring/n…

Recommandations associées :

Explication détaillée d'Ajax et de node.js multer pour implémenter la fonction de téléchargement de fichiers

Un exemple de fichier thinkjs fonction de téléchargement

jQuery pour implémenter la fonction d'aperçu du fichier image avant le téléchargement

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!