Многочастная загрузка Google Drive API приводит к повреждению файла размером 1 КБ

Question

Я пытался загрузить файл с помощью Google Drive API, но столкнулся с этой проблемой и, похоже, не могу найти решение. При загрузке изображения он загружает поврежденный файл размером 1 КБ с правильными метаданными, а при загрузке текстовых файлов он загружает текстовый файл с [объектным файлом] в качестве данных, а не с исходными данными файла.

$("form").submit(function(evt){  
      evt.preventDefault();
      var formData = new FormData($(this)[0]);
      var control = document.getElementById("csv");
      var files = control.files;
      var dat=files[0];
   $.ajax({
       url: 'https://www.googleapis.com/upload/drive/v3/files?uploadType=multipart',
         type: 'POST',
       contentType: false,
       data: "\n--foo_bar_baz\ \nContent-Type: application/json; charset=UTF-8\ \n\n{ 'name': '"+dat.name+"' }\ \n--foo_bar_baz\ \nContent-Type: "+dat.type+"\ \nContent-Transfer-Encoding: base64\ \n\n"+dat+"\ \n--foo_bar_baz--\ ",
       headers: {
            "Authorization":"Bearer <?php echo $result["access_token"]; ?>",
            "Content-Type": "multipart/related; boundary=foo_bar_baz",
            "Content-Length": formData.length
       },
       async: false,
       cache: false,
       enctype: 'multipart/form-data',
       processData: false,
       success: function (response) {
         var res = JSON.stringify(response);
        console.log("S: "+res);
       },
       error: function(response) {
        var res = JSON.stringify(response);
        console.log("E: "+res);
       }
   });
   return false;
 });

Answer 1

Как насчет этого ответа? Пожалуйста, подумайте об этом как об одном из нескольких возможных ответов.

Точки модификации:

• Вы пытаетесь загрузить файл как base64. Но в вашем скрипте dat не является base64.
  • В этом случае я использовал FileReader.
• Пожалуйста, удалите \ из \ \n в "\n--foo_bar_baz\ \nContent-Type: application/json; charset=UTF-8\ \n\n{ 'name': '"+dat.name+"' }\ \n--foo_bar_baz\ \nContent-Type: "+dat.type+"\ \nContent-Transfer-Encoding: base64\ \n\n"+dat+"\ \n--foo_bar_baz--\ ",.

Когда вышеуказанные точки отражены в вашем скрипте, он становится следующим:

Модифицированный скрипт:

$("form").submit(function(evt){  
  evt.preventDefault();
  var formData = new FormData($(this)[0]);
  var control = document.getElementById("csv");
  var files = control.files;
  var dat = files[0];

  var f = new FileReader();  // Added
  f.onload = function(){  // Added
    const base64Data = this.result.split(",")[1];  // Added
    $.ajax({
      url: 'https://www.googleapis.com/upload/drive/v3/files?uploadType=multipart',
      type: 'POST',
      contentType: false,
      data: "\n--foo_bar_baz\nContent-Type: application/json; charset=UTF-8\n\n{'name': '"+dat.name+"'}\n--foo_bar_baz\nContent-Type: "+dat.type+"\nContent-Transfer-Encoding: base64\n\n"+base64Data+"\n--foo_bar_baz--\n",  // Modified
      headers: {
        "Authorization": "Bearer <?php echo $result["access_token"]; ?>",
        "Content-Type": "multipart/related; boundary=foo_bar_baz",
        "Content-Length": formData.length
      },
      async: false,
      cache: false,
      enctype: 'multipart/form-data',
      processData: false,
      success: function (response) {
        var res = JSON.stringify(response);
        console.log("S: "+res);
      },
      error: function(response) {
        var res = JSON.stringify(response);
        console.log("E: "+res);
      }
    });
  }
  f.readAsDataURL(dat);  // Added
  return false;
});

Примечание:

• Когда используется uploadType=multipart , максимальный размер файла составляет 5 МБ. Пожалуйста, будьте осторожны с этим. Ссылка

Если это не было прямым решением вашей проблемы, прошу прощения.