2016-04-07 13 views
8

ho usato seguente codice:come caricare file immagine e display utilizzando nodejs espressi

fileupload.html

<html> 
<head> 
<title>File Uploading Form</title> 
</head> 
<body> 
<h3>File Upload:</h3> 
Select a file to upload: <br /> 
<form action="http://127.0.0.1:8081/file_upload" method="POST" enctype="multipart/form-data"> 
<input type="file" name="file" size="50" /> 
<br /> 
<input type="submit" value="Upload File" /> 
</form> 
</body> 
</html> 

fileupload.js:

var express = require('express'); 
var app = express(); 
var fs = require("fs"); 

var bodyParser = require('body-parser'); 
var multer = require('multer'); 

//console.log(multer); 

app.use(express.static('public')); 
app.use(bodyParser.urlencoded({ extended: false })); 
app.use(multer({ dest: '/tmp/'})); 

app.get('/fileupload.html', function (req, res) { 
    res.sendFile(__dirname + "/" + "fileupload.html"); 
}) 

app.post('/file_upload', function (req, res) { 

    console.log(req.files.file.name); 
    console.log(req.files.file.path); 
    console.log(req.files.file.type); 

    var file = __dirname + "/" + req.files.file.name; 
    fs.readFile(req.files.file.path, function (err, data) { 
     fs.writeFile(file, data, function (err) { 
     if(err){ 
       console.log(err); 
     }else{ 
       response = { 
        message:'File uploaded successfully', 
        filename:req.files.file.name 
       }; 
      } 
      console.log(response); 
      res.end(JSON.stringify(response)); 
     }); 
    }); 
}) 

var server = app.listen(8081, function() { 
    var host = server.address().address 
    var port = server.address().port 

    console.log("Example app listening at http://%s:%s", host, port) 
}) 

Ho usato questi codice qui sopra per il caricamento di file, ma quando escuto utilizzando il nodo fileupload.js nel terminale sto ricevendo errore di tipo TypeError('app.use() requires middleware functions');

Qualcuno può aiutare a risolvere questo problema.

risposta

8

Si sta tentando di utilizzare la vecchia API di multer. È cambiato da un po 'di tempo, vedere lo documentation per ulteriori informazioni.

Nel vostro caso particolare di caricare un singolo file, si dovrebbe rimuovere la riga app.use(multer({ ... })) e di utilizzare invece .single() e req.file come:

var upload = multer({ dest: '/tmp/'}); 

// File input field name is simply 'file' 
app.post('/file_upload', upload.single('file'), function(req, res) { 
    var file = __dirname + '/' + req.file.filename; 
    fs.rename(req.file.path, file, function(err) { 
    if (err) { 
     console.log(err); 
     res.send(500); 
    } else { 
     res.json({ 
     message: 'File uploaded successfully', 
     filename: req.file.filename 
     }); 
    } 
    }); 
}); 
+0

Grazie mille mscdex .FILE caricato con successo – Khushboo

+0

req.file è indefinito? Come posso risolvere questo ? –

+0

@SunilGarg Assicurati di inviare l'immagine in un campo chiamato "file" quando pubblichi sul tuo server ... – duhaime

2

Multer aggiunge un oggetto corpo e uno o più file oggetto alla richiesta oggetto. L'oggetto body contiene i valori dei campi di testo del modulo, l'oggetto file o file contiene i file caricati tramite il modulo.

Usa questo codice, spero che questo ti possa aiutare.

var express = require('express'); 
var app = express(); 
var fs = require("fs"); 

var bodyParser = require('body-parser'); 
var multer = require('multer'); 

app.use(express.static('public')); 
app.use(bodyParser.urlencoded({ extended: false })); 
var upload = multer({ dest: '/tmp' }) 

app.get('/fileupload.html', function (req, res) { 
    res.sendFile(__dirname + "/" + "fileupload.html"); 
}) 

app.post('/file_upload', upload.single("file"), function (req, res) { 
    var file = __dirname + "/" + req.file.originalname; 
    fs.readFile(req.file.path, function (err, data) { 
     fs.writeFile(file, data, function (err) { 
     if(err){ 
       console.error(err); 
       response = { 
        message: 'Sorry, file couldn\'t be uploaded.', 
        filename: req.file.originalname 
       }; 
     }else{ 
       response = { 
        message: 'File uploaded successfully', 
        filename: req.file.originalname 
       }; 
      } 
      res.end(JSON.stringify(response)); 
     }); 
    }); 
}) 

var server = app.listen(8081, function() { 
    var host = server.address().address 
    var port = server.address().port 

    console.log("Example app listening at http://%s:%s", host, port) 
}) 
+0

Questa soluzione ha funzionato anche risolvendo il problema di caricamento dei file – Khushboo

0

La soluzione di cui sopra non ha funzionato per me il metodo di stoccaggio in modo che ho usato:

var express = require('express'); 
var app = express(); 
var fs = require("fs"); 

var bodyParser = require('body-parser'); 
var multer = require('multer'); 

app.use(express.static('public')); 
app.use(bodyParser.urlencoded({ extended: false })); 

app.get('/index.htm', function (req, res) { 
    res.sendFile(__dirname + "/" + "index.htm"); 
}) 


var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
     cb(null, './uploads/') 
    }, 
    filename: function (req, file, cb) { 
     var ext = require('path').extname(file.originalname); 
     ext = ext.length>1 ? ext : "." + require('mime').extension(file.mimetype); 
     require('crypto').pseudoRandomBytes(16, function (err, raw) { 
      cb(null, (err ? undefined : raw.toString('hex')) + ext); 
     }); 
    } 
}); 

var upload = multer({ storage: storage }); 

app.post('/file_upload', upload.any(), function (req, res, next) { 
    res.send(req.files); 
}) 
-1

Sembra che non è sicuro per mantenere il nome originale del file o estensione e ho trovato/fatto questo codice per la visualizzazione di immagini direttamente in tutto il mondo con l'aggiunta di .jpg al vostro URL del file:

restapi.get('/uploads/:id', function (req, res) { 
    var storedMimeType = 'image/jpeg'; 
    res.setHeader('Content-Type', storedMimeType) 
fs.createReadStream(path.join('./uploads/', req.params.id).replace(/\.[^/.]+$/, "")).pipe(res) 
}) 
Problemi correlati