Morioh
Login
André Schürrle

André Schürrle

11 months ago

So laden Sie Dateien mit Node.js hoch

In diesem Tutorial erfahren Sie, wie Sie mit node.js Dateien hochladen. In diesem Tutorial geben wir Ihnen ein einfaches Beispiel für Knoten-JS mit Express-JS-Datei-Upload mit Multer. Wir können das Multer-Modul zum Hochladen von Dateien auf den Server verwenden. Multer ist eine node.js-Middleware, die für die Verarbeitung von Multipart-/Formulardaten verwendet wird, die hauptsächlich als Bibliothek zum Hochladen von Dateien verwendet wird.

Besuchen Sie das Multer-Paket:  Installieren Sie das Multer-Modul

Um Dateien mit Node.js hochzuladen, befolgen wir diese Schritte.

  • Schritt 1: Knoten-App erstellen
  • Schritt 2: Eingebettete JavaScript-Vorlagen (EJS) installieren
  • Schritt 3: Installieren Sie Express.js in der App
  • Schritt 4: Installieren Sie Multer in der App
  • Schritt 5: Erstellen Sie File_upload_form.ejs
  • Schritt 6: Erstellen Sie die Datei index.js
  • Schritt 7: Führen Sie die Datei index.js aus

Schritt 1: Knoten-App erstellen

Erstellen Sie in diesem Schritt eine Knotenanwendung mit dem folgenden Befehl

mkdir express_js_file_upload

cd express_js_file_upload

npm init

Schritt 2: Eingebettete JavaScript-Vorlagen (EJS) installieren

 In diesem Schritt installieren wir EJS mit dem folgenden Befehl

npm install ejs

Schritt 3: Installieren Sie Express.js in der App

Installieren Sie nun Express im  express_js_file_upload Verzeichnis und speichern Sie es in der Abhängigkeitsliste. Zum Beispiel:

$ npm install express --save

Schritt 4: Installieren Sie Multer in der App

 In diesem Schritt installieren Sie Multer mit dem folgenden Befehl. Sie können auch den Link  Multer-Modul installieren besuchen .

npm install multer

Schritt 5: Erstellen Sie File_upload_form.ejs

 Erstellen Sie in diesem Schritt  File_upload_form.ejs im Ordner „views“.  und kopieren Sie den folgenden Code in die Datei.

<!DOCTYPE html>
<html>
<head>
	<title>How To File Upload Using Node.js - Websolutionstuff</title>
</head>
<body>
    <h1>How To File Upload Using Node.js - Websolutionstuff</h1>   
    <form action="/uploadFile" enctype="multipart/form-data" method="POST">      
        <span>Upload File: </span>  
        <input type="file" name="pic" required/> <br>
        <input type="submit" value="submit"> 
    </form>
</body>
</html>

Schritt 6: Erstellen Sie die Datei index.js

Erstellen Sie nun die Datei index.js in Ihrem App-Verzeichnis. und kopieren Sie den folgenden Code in die Datei index.js

const express = require("express")
const path = require("path")
const multer = require("multer")
const app = express()
    
app.set("views",path.join(__dirname,"views"))
app.set("view engine","ejs")
    
var storage = multer.diskStorage({
    destination: function (req, file, cb) {          
        cb(null, "uploads")
    },
    filename: function (req, file, cb) {
      cb(null, file.fieldname + "-" + Date.now()+".jpg")
    }
  })
       
const maxSize = 1 * 1000 * 1000;
    
var upload = multer({ 
    storage: storage,
    limits: { fileSize: maxSize },
    fileFilter: function (req, file, cb){
           
        var filetypes = /jpeg|jpg|png/;
        var mimetype = filetypes.test(file.mimetype);
  
        var extname = filetypes.test(path.extname(
                    file.originalname).toLowerCase());
        
        if (mimetype && extname) {
            return cb(null, true);
        }
      
        cb("Error: File upload only supports the "
                + "following filetypes - " + filetypes);
      } 
 
}).single("pic");       
  
app.get("/",function(req,res){
    res.render("File_upload_form");
})
    
app.post("/uploadFile",function (req, res, next) {
         
    upload(req,res,function(err) {
  
        if(err) {            
            res.send(err)
        }
        else {            
            res.send("Successfully Image uploaded..!")
        }
    })
})    
app.listen(3000);

und Ihre Dateistruktur wie im Bild unten

Dateistruktur

Hinweis: Erstellen Sie in der App einen Upload-Ordner für Store-Dateien.

Schritt 7: Führen Sie die Datei index.js aus

Führen Sie index.js mit dem folgenden Code aus

node index.js

Viel Spaß beim Codieren!!!

1.00 GEEK