用於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);
},