Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/423.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript NodeJS Multer不工作_Javascript_Html_Node.js_Express_Multer - Fatal编程技术网

Javascript NodeJS Multer不工作

Javascript NodeJS Multer不工作,javascript,html,node.js,express,multer,Javascript,Html,Node.js,Express,Multer,我尝试使用NodeJS+ExpressJS+Multer上传文件,但效果不好 我的ExpressJS版本是4.12.3 这是我的消息来源 server.js: var express = require('express'), multer = require('multer'); var app = express(); app.use(express.static(__dirname + '/public')); app.use(multer({ dest: './uploads

我尝试使用NodeJS+ExpressJS+Multer上传文件,但效果不好

我的ExpressJS版本是4.12.3

这是我的消息来源

server.js:

var express = require('express'),
    multer  = require('multer');

var app = express();
app.use(express.static(__dirname + '/public'));
app.use(multer({ dest: './uploads/'}));

app.post('/', function(req, res){
    console.log(req.body); // form fields
    console.log(req.files); // form files
    res.status(204).end()
});
app.get('/', function(req, res)  {
    res.sendFile('public/index.html');
});

app.listen(5000, function() {
    console.log("start 5000");
});
public/index.html:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <form method="post" enctype="multipart/form-data">
        <input id="file" type="file"/>
        <button type="submit">test</button>
    </form>
</body>
</html>
在NodeJS控制台上,req.files处有空对象
我的源代码有问题吗?

我没有看到您在单击提交按钮时调用任何API来上载文件。让我给你更全面的实施

app.js中的multer配置
看法
在用户控制器中上载配置文件pic逻辑
试试这个

var multer = require('multer')

var storage = multer.diskStorage({
    destination: function (request, file, callback) {
        callback(null, './uploads/');
    },
    filename: function (request, file, callback) {
        console.log(file);
        callback(null, file.originalname)
    }
});

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

app.post('/', upload.single('photo'), function (req, res) {

    console.log(req.body) // form fields
    console.log(req.file) // form files
    res.status(204).end()
});
参考:

表单是否实际到达端点<代码>应用程序post('/',函数(请求,恢复)
?您的文件输入没有
名称
属性,而且对于
req.body
@RichardMacarhy,您仍然需要
正文解析器
。@RichardMacarhy是的。这是正确的。@BenFortune抱歉,这是我源代码的一部分。我复制到我的项目中提出问题。可能是我的错误。不管multer有什么不好的地方。@dinggu我说的是inputs r需要一个
名称
属性。根据自述文件中的文档,我不相信其中任何一个(在dest之外)是当前的multer选项@lfender6445是的,你是对的。我花了大约一个小时试图弄清楚为什么没有调用onFile*函数。它给出错误:
app.use()需要一个中间件功能
对不起,这是我的错误。找到了解决方案。我使用
res
而不是
文件
函数(req,res,…)
这一个对我来说最有效,谢谢你,我的英雄
app.use(multer({ 
    dest: './uploads/',
    rename: function (fieldname, filename) {
        return filename.replace(/\W+/g, '-').toLowerCase() + Date.now()
    },
    onFileUploadStart: function (file) {
        console.log(file.fieldname + ' is starting ...')
    },
    onFileUploadData: function (file, data) {
        console.log(data.length + ' of ' + file.fieldname + ' arrived')
    },
    onFileUploadComplete: function (file) {
        console.log(file.fieldname + ' uploaded to  ' + file.path)
    }
}));
<form id="uploadProfilePicForm" enctype="multipart/form-data" action="/user/profile_pic_upload" method="post">
          <input type="file" multiple="multiple" id="userPhotoInput" name="userPhoto"  accept="image/*" />
          <input type="submit" name="submit" value="Upload">
</form> 
var control = require('../controllers/controller');
app.post('/user/profile_pic_upload',control.uploadProfilePic);
uploadProfilePic = function(req,res){
    // get the temporary location of the file
    var tmp_path = req.files.userPhoto.path;
    // set where the file should actually exists 
    var target_path = '/Users/narendra/Documents/Workspaces/NodeExpressWorkspace/MongoExpressUploads/profile_pic/' + req.files.userPhoto.name;
    // move the file from the temporary location to the intended location
    fs.rename(tmp_path, target_path, function(err) {
        if (err) throw err;
        // delete the temporary file, so that the explicitly set temporary upload dir does not get filled with unwanted files
        fs.unlink(tmp_path, function() {
            if (err) {
                throw err;
            }else{
                    var profile_pic = req.files.userPhoto.name;
                    //use profile_pic to do other stuffs like update DB or write rendering logic here.
             };
            });
        });
};
var multer = require('multer')

var storage = multer.diskStorage({
    destination: function (request, file, callback) {
        callback(null, './uploads/');
    },
    filename: function (request, file, callback) {
        console.log(file);
        callback(null, file.originalname)
    }
});

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

app.post('/', upload.single('photo'), function (req, res) {

    console.log(req.body) // form fields
    console.log(req.file) // form files
    res.status(204).end()
});