上传文件时nodejs和表示错误,“无法读取未定义的属性”

时间:2013-08-28 06:11:52

标签: node.js file-upload express

编辑:===为了清楚起见,我希望将文件上传到服务器,无论是图片还是一点点.txt ===

我已经查看了与此类似的其他常见问题,但无法缓解我的问题。

目的是创建文件上传功能。前端看起来像这样:

<div class="holdingDiv">
    <form action="/file-upload" name="upload" class="dropzone dz-clickable" id="dropzoneArea" enctype="multipart/form-data">
        <input style="display:none" type="file" name="thumbnail[thumbs]" />                      
        <button id="uploadSubmitter" class="btn btn-primary btn-large" type="submit">Finished</button>
    </form>
</div>

我有表单类型和所有爵士乐设置。

处理post请求的server.js如下所示:

app.post('/file-upload', imports.upload);

请注意,我还有以下要求:

//needed for forms
app.use(express.bodyParser()); 

以及调用imports.upload exports函数所需的函数。

exports.upload函数看起来像这样:

exports.upload = function (req, res) {
    console.log('FIRST TEST: ' + JSON.stringify(req.files));

    console.log('second TEST: ' +req.files.thumbnail.thumbs.name);
    //get the file extenstion:
    //console.log('size' + req.files.thumbnail.size);
  //  console.log('test this: ' + req.files.thumbnail.name);
   // var fileExtension = JSON.stringify(req.files);

    //console.log('Im getting this file type: '+ fileExtension.name);
   // console.log('this: '+req.files.upload);

    //fs.readFile(req.files.uploadFiles.path, function (err, data) {
    //    // ...
    //    var newPath = __dirname + "/uploads/"+uploadFiles.name;
    //    fs.writeFile(newPath, data, function (err) {
    //        res.redirect("back");
    //    });
    //});
}

很多东西被注释掉了,因为我正在尝试不同的方法让它发挥作用。我可以用JSON Stringify作为整个对象来调用它,但是我希望它可以作为一个对象,我可以从中获取信息,例如我想知道文件的类型,将其名称拆分为'。':

req.files.thumbnail.thumbs.name

但是当我尝试这个(甚至是JSON Stringyfied)时,它说它是未定义的。

我做过的事:

将整个函数移动到app.js(有一个使用req.body工作的小型登录函数,我认为这可能会解决它。

使用JSON Stringyfy获取对象的特定部分。 (返回undefined)

把头撞在键盘上。 (返回undefined)

将表单enctype更改为几个不同的东西,但是这里的大多数答案都表明form-data是文件上传的最佳enctype。

任何帮助和指示,为什么会发生这种情况将非常感谢!!

2 个答案:

答案 0 :(得分:3)

我不明白为什么你把输入名称保留为“缩略图[拇指]”。 您必须将method =“POST”添加到表单中。

我将name属性更改为“theFile”,这里是html

<div class="holdingDiv">
  <form action="/file-upload" name="upload" class="dropzone dz-clickable" id="dropzoneArea" enctype="multipart/form-data" method = "post">
    <input  type="file" name="theFile" />                      
    <button id="uploadSubmitter" class="btn btn-primary btn-large" type="submit">Finished</button>
  </form>
</div>

现在在您的节点js服务器中执行此操作。

app.post('/file-upload',function(req,res){
    console.log('FIRST TEST: ' + JSON.stringify(req.files));
    console.log('second TEST: ' +req.files.theFile.name);
    fs.readFile(req.files.theFile.path, function (err, data) {
        var newPath = "/home/path/to/your/directory/"+req.files.theFile.name;
        fs.writeFile(newPath, data, function (err) {
          res.send("hi");  
        });
    });
});

req.files是一个json,它提供了上传请求的详细信息。

希望这有帮助。

答案 1 :(得分:1)

仅限其他人使用快递4.X访问此链接。 “multipart”中间件不再受支持。您需要使用其他中间件,例如“multiparty”或“multer”。

参考:TypeError: Cannot read property 'image' of undefined