1

我在任何地方找到的答案都没有奏效。我正在尝试扩展“开发 Backbone.js 应用程序”中的示例以上传文件。尽管表单具有 enctype="multipart/form-data"，但 request.files 始终未定义。

表单 HTML 是：

<form id="addBook" action="..." enctype="multipart/form-data">
    <div>
        <label for="coverImage">CoverImage: </label><input id="coverImage" name="coverImage" type="file" />
        <label for="title">Title: </label><input id="title" type="text" />
        <label for="author">Author: </label><input id="author" type="text" />
        <label for="releaseDate">Release date: </label><input id="releaseDate" type="text" />
        <label for="keywords">Keywords: </label><input id="keywords" type="text" />
        <button id="add">Add</button>
  </div>
</form>

保存新记录的主干是

  addBook: function( e ) {
    e.preventDefault();

    var formData = {};
    var reader = new FileReader();
    $( '#addBook div' ).children( 'input' ).each( function( i, el ) {
        if( $( el ).val() != '' )
        {
            if( el.id === 'keywords' ) {
                formData[ el.id ] = [];
                _.each( $( el ).val().split( ' ' ), function( keyword ) {
                    formData[ el.id ].push({ 'keyword': keyword });
                });
            } else if( el.id === 'releaseDate' ) {
                formData[ el.id ] = $( '#releaseDate' ).datepicker( 'getDate' ).getTime();
            } else {
                formData[ el.id ] = $( el ).val();
            }
        }
    });
        console.log(formData);
        this.collection.create( formData );
    }

被调用的节点。

//Insert a new book
app.post( '/api/books', function( request, response ) {
    console.log(request.body);
    console.log(request.files);
});

coverimage 发送到节点的值是正确的，我只是在 request.files 中没有得到任何东西。我有一个很酷的拖放功能，我想用它来代替，但是在我得到这个工作之前我被卡住了。

我尝试了 JQuery-file-upload，这让我无处可去。

如果我有头发，我会马上拔掉它。

4

3 回答 3

1

我不会将文件作为model.save/的一部分提交collection.create(model)。

我使用的是Plupload作为文件上传管理器，将文件提交给上传处理程序。此上传处理程序返回上传文件的路径，或者如果引用存储在数据库表中，则返回 fileId。

从那里我在我的主干模型中填充一个属性，然后持久化模型。您可以让您的模型listenToplupload，用于上传完成事件或类似事件。

于 2013-06-03T23:59:01.153 回答
0

我还遵循“开发 Backbone.js 应用程序”一书的示例，我扩展了将图像上传到服务器中的文件夹并将路径保存在我的模型中以显示正确图像的功能。它工作正常。我尝试使用 Plupload 和其他 jquery 插件，但我不喜欢它们。我的示例是使用 ajax 将图像上传到服务器然后使用它们。我阅读了许多引用使用 iframe 来获得 ajax 功能的帖子。我发现最好的方法是使用 jquery.form.js 来避免回发并以一种很好的方式加载图像。

正在运行的示例与 nodeJS 一起工作正常：

https://github.com/albertomontellano/bookLibrarySampleNodeJS

我的解决方案基于 Mark Dawson 的帖子：

http://markdawson.tumblr.com/post/18359176420/asynchronous-file-uploading-using-express-and-node-js

但是，我必须更正这篇文章的方法以使其正常工作：

app.post('/api/photos', function(req, res) {
var responseServerPath = 'images/' + req.files.userPhoto.name;
var serverPath = 'site/images/' + req.files.userPhoto.name;
console.log(req.files.userPhoto.path);
require('fs').rename(
    req.files.userPhoto.path,
    serverPath,
    function(error) {
        if(error) {
            console.log(error);
            res.send({
                error: 'Ah crap! Something bad happened'
            });
            return;
        }

        res.send({
            path: responseServerPath
        });
    }
);
});

我希望它有所帮助。

于 2014-03-13T16:23:32.237 回答
-2

结果我最终不得不雇人来做这件事，因为我在网上找不到任何人通过骨干上传文件的例子，即使没有更新任何数据库交互。对于使用什么工具来上传文件，每个人都有相同的基本建议，但我一辈子都找不到有人实现它的例子。

我计划将代码提供给所有人，这样他们就可以看到它是如何工作的。

于 2013-06-05T18:16:11.043 回答