如何更改我的 Google Apps 脚本代码以允许将多个文件上传到 Google Drive？答案

【问题标题】：How do I alter my Google Apps Script code to allow multiple files to be uploaded to Google Drive?如何更改我的 Google Apps 脚本代码以允许将多个文件上传到 Google Drive？
【发布时间】：2017-06-12 20:57:00
【问题描述】：

我开发了一个连接到 Google Drive 并允许将文件上传到特定文件夹的网络表单。当前代码仅上传选择的第一个文件，我希望能够上传所有选择的文件。我当前的代码发布在下面。有什么建议吗？

index.html

<body>

  <h2 class="col-sm-offset-4 col-sm-8" style="padding-bottom: 50px;">Smart-HR Connect Data Gather</h2>

  <form class="form-horizontal" id="genericForm">


    <div class="form-group" id="show-me6" style="display: none;">
      <label class="col-sm-3 control-label">Please upload your Chart of Payroll Accounts &amp; your Last Journal Entry:</label>
      <div>
        <input name="chartAccJournalEntry" type="file" id="file" multiple>
      </div><br><br>

    </div>


    <input class="col-sm-offset-3" type="submit" onclick="this.value='Thank you ...'; google.script.run.withSuccessHandler(formSubmitted) .writeForm(this.parentNode); return false;">

  </form>



  <div id="output"></div>
  <!-- where the confirmation message goes -->
  
  <script>
    var file,
      reader = new FileReader();

    // Upload the file to Google Drive


    reader.onloadend = function(e) {
      google.script.run
        .withSuccessHandler(showMessage)
        .uploadFileToGoogleDrive(
          e.target.result, file.name,
          $('input#distinguishedName').val()
        );
    };

    function showMessage(e) {
      $('#progress').html(e);
    }

    function formSubmitted(status) {
      document.getElementById('genericForm').style.display = 'none'; //matches your form name or whatever you want to disappear post-submission
      document.getElementById('output').innerHTML = status; //displays in item with the 'output' id
      file = $('#file')[0].files[0];
      reader.readAsDataURL(file);
      showMessage("Uploading file..");


    }
  </script>
</body>

代码.gs

//basic function that builds the form using index.html as the template
function doGet(e) {
     return HtmlService
     .createTemplateFromFile('index')
     .evaluate()
     .setTitle("Smart-HR Connect Data Gather")
     .setSandboxMode(HtmlService.SandboxMode.NATIVE);
}
 
function uploadFileToGoogleDrive(data, file, name, email) {

  try {

    var submissions = "Data Gather File Uploads";
    var folder, folders = DriveApp.getFoldersByName(submissions);

    if (folders.hasNext()) {
      folder = folders.next();
    } else {
      folder = DriveApp.createFolder(submissions);
    }

    var contentType = data.substring(5,data.indexOf(';')),
        bytes = Utilities.base64Decode(data.substr(data.indexOf('base64,')+7)),
        blob = Utilities.newBlob(bytes, contentType, file);

    folder.createFolder([name, email].join(" ")).createFile(blob);

    return "OK";

  } catch (f) {
    return f.toString();
  }

}

【问题讨论】：

标签： javascript google-apps-script

【解决方案1】：

您可以参考这个Multiple File Upload to Google Drive Using Google Script 教程。

function doGet() {
  return HtmlService.createHtmlOutputFromFile('form')
    .setSandboxMode(HtmlService.SandboxMode.IFRAME);
}


function uploadFileToDrive(base64Data, fileName, dropbox) {
  try{
    var splitBase = base64Data.split(','),
        type = splitBase[0].split(';')[0].replace('data:','');

    var byteCharacters = Utilities.base64Decode(splitBase[1]);
    var ss = Utilities.newBlob(byteCharacters, type);
    ss.setName(fileName);

    //var dropbox = "WTELNSD2016"; // Folder Name
    var folder, folders = DriveApp.getFoldersByName(dropbox);

    if (folders.hasNext()) {
      folder = folders.next();
    } else {
      folder = DriveApp.createFolder(dropbox);
    }
    var file = folder.createFile(ss);
    return file.getName();
  }catch(e){
    return 'Error: ' + e.toString();
  }
}

正如SO thread 中所述，multiple 属性仅适用于 IFRAME 模式，但文件输入在 IFRAME 模式下会被破坏。

希望这会有所帮助。

【讨论】：