2017-09-16 106 views
1

我想用multer从客户端的html表单上传文件到服务器端,multer模块处理服务器端的文件。Multer没有上传文件

这里的事情是一切都好,因为我得到服务器的200 OK响应,但该文件应该上传到我的fileSystem,我看不到它。

这是我的HTML形式

<template> 
    <div id="app"> 
    <form action="http://localhost:3000/upload" method="post" enctype="multipart/form-data"> 
     <h2>Select a file</h2> 
     <input name="curriculum" id="inputVal" type="file"> 
     <button type="submit">Send</button> 
    </form> 
    </div> 
</template> 

我的服务器端代码

var express = require('express'); 
var router = express.Router(); 
var path = require('path'); 
var fs = require('fs'); 
var multer = require('multer') 
var storage = multer.diskStorage({ 
    destination: function(req,file,callback) { 
    callback(null, '../files'); 
    }, 
    filename: function(req,file,callback) { 
    callback(null,Date.now() + file,callback); 
    } 

}) 
var upload = multer({ storage: storage }).single('curriculum'); 

router.post('/upload', function (req, res, next) { 
    upload(req,res, function(err){ 
    if(err) { 
     return res.status(404).send("a error ocurred"); 
    } 
    res.status(200).send("file uploaded"); 
    }); 
}); 

module.exports =路由器;

UPDATE

我改变溶液碱不要的NPM multer网站(服务器端)

var express = require('express'); 
var router = express.Router(); 
var path = require('path'); 
var fs = require('fs'); 
var multer = require('multer') 
var upload = multer({ dest: 'uploads/' }); 

router.post('/upload',upload.single('curriculum') ,function (req, res, next) { 
    console.log(req.files); 
}); 

module.exports =路由器;

Ty for the help!

+0

你有适当的读/写persmission设为您的目的地文件夹,您要上传文件? –

+0

是的,我有,我没有得到任何错误,通常我会得到一个CORS,但我允许它在我的应用程序文件,我不知道为什么它不起作用 –

+0

你可以请尝试添加'/'文件后作为'callback(null,'../ files /');'看看它是否工作? –

回答

1

您没有指定要上传的文件。把名称的input

router.post('/upload', upload.single('curriculum'), function (req, res, next) { 
    if(err) { 
     console.log(err); 
     return res.status(404).send("a error ocurred"); 
    } 
    console.log(req.file); 
    res.status(200).send("file uploaded"); 
}); 

另外,在你的文件名,确保与扩展,如.png.jpeg否则你会看到一堆没有任何意义的字节码文件结束。

您可以让您的客户端通过使用file.originalname

cb(null, file.originalname) 

或者你可以明确地添加它给你确切的文件名。

callback(null, file.fieldname + '-' + Date.now() + '.png') 

你可能想要删除的callback(null,Date.now() + file,callback)第三个参数是callback因为它可能被窃听程序,并更改+ file为类似+ file.originalname因为file是一个对象,计算机可能会参加对象有问题到一个文件名。

UPDATE

主要的NodeJS

var express = require('express') 
var multer = require('multer') 
var app = express() 

var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
    cb(null, __dirname + '/uploads')  //you tell where to upload the files, 
    }, 
    filename: function (req, file, cb) { 
    cb(null, file.fieldname + '-' + Date.now() + '.png') 
    } 
}) 

var upload = multer({storage: storage, 
    onFileUploadStart: function (file) { 
     console.log(file.originalname + ' is starting ...') 
    }, 
}); 

app.set('view engine', 'ejs'); 

app.get('/', function(req, res, next){  
    res.render('mult'); //our html document 
}) 

app.post('/profile', upload.single('avatar'), function (req, res, next) { 
    // req.file is the `avatar` file 
    console.log(req.file); 
    return false; 
}) 

HTML表单

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title></title> 
    </head> 
    <body> 
    <form accept="image/x-png,image/gif,image/jpeg" enctype="multipart/form-data" action="/profile" method="post"> 
     <input type="file" name="avatar" value=""> 
     <input type="submit" name="" value="ssss"> 
    </form> 
    </body> 
</html> 
+0

hey turmuka看我的编辑,仍然不工作 –

+0

嘿检查我的更新,这些代码适合我工作,你应该做一些改变你的'上传'变量@costacosta – turmuka

+0

让我知道它是否工作正常@costacosta – turmuka