0

Put together this script that will upload a file to my google drive. I need it to be able to handle either a big .zip file, OR multiple image files. Currently it times out if you upload a big .zip file (around 7MB)

I would prefer to have it upload multiple files.

Apps Script:

function doGet(e) {
  return HtmlService.createHtmlOutputFromFile('form.html');
}

function uploadFiles(form) {

  try {
    var unitNumber = form.unitNumber;
    if (unitNumber == "") {
      unitNumber = "";
    } else {
      unitNumber = " #" + unitNumber;
    }
    var foldertitle = form.streetAddress + unitNumber + ' ' + form.cityName + ' ' + form.stateName + ' - ' + form.businessName + ' ' + form.managerName + ' - ' + form.propertyType;
    var folder, folders = DriveApp.getFolderById("0B0V8-0eo7tx8MTQzcGFwdXF6SFU");
    var createfolder = folders.createFolder(foldertitle);
    folder = createfolder;
    var blob = form.filename;
    var file = folder.createFile(blob);

    return "File uploaded successfully ";

  } catch (error) {
    Logger.log('err: ' + error.toString());
    return error.toString();
  }

}

Form Code

<body>
  <div id="formcontainer">
    <form id="myForm">
      <div>
        <input type="text" name="businessName" placeholder="Business Name">
      </div>
      <div>
        <input type="text" name="managerName" placeholder="Manager Name">
      </div>
      <div>
        <input type="text" name="streetAddress" placeholder="Street Address">
      </div>
      <div>
        <input type="text" name="unitNumber" placeholder="Unit Number">
      </div>
      <div>
        <input type="text" name="cityName" placeholder="City">
      </div>
      <div>
        <input type="text" name="stateName" placeholder="State">
      </div>
      <br>
      <label for="propertyType">Choose Type</label>
      <br>
      <select name="propertyType">
        <option value="Interactive Floor Plan">IFP</option>
        <option value="Pictures Only">Pictures</option>
        <option value="Video Only">Video</option>
        <option value="Complete Property">All</option>
      </select>
      <br>
      <label for="myFile">Compress All Files into .zip file</label>
      <br>
      <input type="file" name="filename" id="myFile" multiple>
      <input type="submit" value="Upload File" onclick="this.value='Uploading..';
                    google.script.run.withSuccessHandler(fileUploaded)
                    .uploadFiles(this.parentNode);
                    return false;">
    </form>
  </div>

  <div id="output"></div>

  <script>
    function fileUploaded(status) {
      document.getElementById('myForm').style.display = 'none';
      document.getElementById('output').innerHTML = status;
    }
  </script>

  <style>
    body {
      max-width: 400px;
      padding: 20px;
      margin: auto;
    }
    input {
      display: inline-block;
      width: 100%;
      padding: 5px 0px 5px 5px;
      margin-bottom: 10px;
      -webkit-box-sizing: border-box;
      ‌​ -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    select {
      margin: 5px 0px 15px 0px;
    }
    input[type="submit"] {
      width: auto !important;
      display: block !important;
    }
    input[type="file"] {
      padding: 5px 0px 15px 0px !important;
    }
  </style>
</body>
Rock Erekson
  • 13
  • 1
  • 4
  • As per the documentation it should work fine for a file size less than 10MB. Check this link http://stackoverflow.com/questions/26003437/google-drive-script-not-uploading-file-larger-than-10mb – KRR Mar 31 '15 at 22:08
  • Here is a multiple file upload I use in GAS: http://stackoverflow.com/questions/28147486/handling-multiple-files-from-an-input-element-in-an-array-with-google-apps-scrip/28161468#28161468 – Spencer Easton Apr 01 '15 at 06:32
  • This looks cool: http://stackoverflow.com/questions/31126181/uploading-multiple-files-to-google-drive-with-google-app-script – Ryan May 13 '17 at 01:29

1 Answers1

0

I don't see other way to make GAS work with multiple files if not with multiple files inputs. You can add dinamically input with Jquery (or plain Javascript), and test in the server side to check how many input files got carried over.

Like so: in HTML:

<input type="file" name="filename0" id="myFile"><div id="moreInputs"></div>

<button onClick="moreFieds()">Add more Fieds</button>
<script>
var numInputs = 1;
function moreFieds(){
  $('#moreInputs').append($('<input type="file" name="filename'+numInputs+'"   id="myFile">'));
  numInputs++;
}
</script>

In code.gs:

var numForms = 0;
while( form[ (filename + numForms) ] ){
  var blob = form[ (filename + numForms) ];
  var file = folder.createFile(blob);
  numForms++;
}

Or as I like more, send files inputs one by one in the script, giving each input it's own form, that way you can know when each file has done loading with the successHandler.

Kriggs
  • 3,731
  • 1
  • 15
  • 23