用于AJAX文件上传的多部分或base64？

Question

我正在使用EmberJS编写一个单页应用程序，并且需要上传一些文件。

我写了一个特殊的视图，该视图包装了文件输入字段并提取了第一个选定的文件。 这使我可以将File -Object绑定到模型属性。

现在我必须选择。

我可以编写一个特殊的文件转换，将File -Object序列化为base64并简单地将其PUT / POST。

或者，我可以截取RESTAdapter方法createRecord和updateRecord来检查每个模型的File -Objects并将PUT / POST请求切换为multipart/form-data并在FormData的帮助下进行发送

这些指示之一是否构成重大问题？

Answer 1

我必须对正在开发的Restful API进行同样的评估。 在我看来，最理想的方法是仅将RESTAdapter与base64编码的数据一起使用。

话虽如此，我必须使用multipart / form-data方法，因为在对base64编码文件数据时，数据传输要高30％。 由于我的API必须接受大文件（超过100MB），因此我选择了API的POST方法来接收多部分表单数据，其中文件和json数据是POST变量之一。

因此，除非您需要像我这样上载大型文件，否则我建议始终坚持使用REST方法。

Answer 2

自己碰到了这个问题，最后使用FormData对象使用了一个简单的jQuery AJAX调用。 我的多选实现（可以一次删除多个文件）如下所示：

filesDidChange: function() {
  // Get FileList
  var $input = this.$('input'),
      fileList = $input.get(0).files;

  // Iterate files
  for (var i = 0; i < fileList.length; i++) {
    var file = fileList[i],
      formData = new FormData();

    // Append information to FormData instance
    formData.append('attachment[title]', file.name);
    formData.append('attachment[file]', file);
    formData.append('attachment[post_id]', this.get('post.id'));

    // Send upload request
    Ember.$.ajax({
      method: 'POST',
      url: '/attachments',
      cache: false,
      contentType: false,
      processData: false,
      data: formData,
      success: makeSuccessHandler(this),
      error: makeErrorHandler(this)
    });
  }

  // Notify
  this.container.lookup('util:notification').notify('Uploading file, please wait...');

  // Clear FileList
  $input.val(null);
},