Question

我是骨干的初学者，请原谅我的愚蠢，我试图通过在Backbone.editors中添加一个函数来上传文件：在我的观点中，这就是我写的：

Backbone.Form.editors.Filepicker = Backbone.Form.editors.Base.extend(_.extend(
validatorExt, disablingExt, autoActionExt, {
  className: 'form-data',
  events: {
    'change input[type=file]': 'uploadFile' 
  },
  initialize: function (options) {
      Backbone.Form.editors.Base.prototype.initialize.call(this,options);
      this.$uploadInput = $(
      '<input type="file" multiple="multiple" id="' + this.key +
      '" name="' + this.key + '"  multiple/>');
      this.$loader = $(
      '<p class="upload-status"><span class="loader"></span> Uploading&hellip;</p>'
    );
      this.$error = $('<p class="upload-error error">Error</p>');
      this.$list = $('<ul class="file-list">');
  },
  uploadFile: function () {
  var xhr = new XMLHttpRequest();
    var url = 'upload/';
    this.onProgress(0, 'Upload started.');
 var files = document.getElementById(this.key)
      .files;
    var file = files[0];
  xhr.addEventListener('progress', function (e) {
      var done = e.position || e.loaded,
        total = e.totalSize || e.total;
      console.log('xhr progress: ' + (Math.floor(done / total *
        1000) / 10) + '%');
    }, false);
    if (xhr.upload) {
      xhr.upload.onprogress = function (e) {
        var done = e.position || e.loaded,
          total = e.totalSize || e.total;
        console.log('xhr.upload progress: ' + done + ' / ' +
          total + ' = ' + (Math.floor(done / total * 1000) /
            10) + '%');
      };
    }
    xhr.onreadystatechange = function (e) {
      if (4 === this.readyState) {
        console.log(['xhr upload complete', e]);
      }
    };
 xhr.open('POST', url, true);
    console.log(xhr);
    var formData = new FormData();
    formData.append(this.key, file, file.name);
     xhr.send(formData);
  }));

在我的服务器端：

app.post('/upload/', multer({dest: './tmp/my-uploads'}).array(), uploadFile);
function uploadFile(req, res) {
 console.log(req.body.file);
  console.log(req.file);
  res.status(204).end();
 }

此脚本会创建上传文件夹，但该文件不会在服务器端传输！虽然我可以读取文档的名称和大小，并且对于console.log都是未定义的！我认为真正的问题是，web服务'/ upload /不发送二进制数据。我该怎么办？

解决了！我必须使用以下代码行激活服务器中的上传服务：

   app.use(express.bodyParser({
      keepExtensions: true,
      uploadDir: '/uploads'
     });

Answer 1

仅使用.array()，您只保存非文件多部分字段。由于您似乎正在上传文件，因此您需要以下内容：

var upload = multer({dest: './tmp/my-uploads'});
app.post('/upload/', upload.single('foo'), function(req, res) {
  console.log(req.body.file);
  console.log(req.file);
  res.status(204).end();
});

其中'foo'是与文件输入字段相关联的name属性（在您的情况下为this.key）。

使用backbone，xhr和node js在上传中找不到文件

1 个答案: