Google Script Video Upload失败

时间:2017-03-30 14:38:50

标签: javascript google-apps-script google-api google-drive-api google-apps

我是Google Scripts的新手 - 就像我刚开始学习如何使用它一样。我根据this answer的代码整理了一个谷歌驱动器dropzone。我的脚本正常工作,并将照片上传到正确的文件夹。问题是,我无法上传大于10mb的文件,我需要能够上传视频。我做了一些研究,我找到了解决同一问题的其他问题,但没有一个问题可以解决问题。

对于杂乱的代码感到抱歉,因为这是我修改过的另一个项目。

以下是form.html

<head>
  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/flatly/bootstrap.min.css">
  <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.3.0/min/dropzone.min.css">
  <link href="https://fonts.googleapis.com/css?family=Catamaran:900" rel="stylesheet">

  <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.3.0/min/dropzone.min.js"></script>
</head>
<body>
  <div class="flex-center-wrap">
    <div class="flex-center">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h2>Media Dropzone</h2>
        </div>
        <div class="panel-body">
          <form class="dropzone" id="myForm" action="#">
            <div class="fallback">
              <input name="file" type="file" multiple/>
            </div>
          </form>
          <div id="status" class="hidden">
            <br>
            <p id="status-message"></p>
          </div>
        </div>
      </div>
    </div>    
  </div>

  <script>
    $(document).ready(function(){
      var numUploads = {};
      numUploads.done = 0;
      numUploads.total = 0;

      var myDropzone = new Dropzone("#myForm", { url: "#"});
      myDropzone.on("addedfile", function() {
        iteratorFileUpload();
      });

      // Upload the files into a folder in drive
      // This is set to send them all to one folder (specificed in the .gs file)
      function iteratorFileUpload() {
        myDropzone.disable();
        var allFiles = document.getElementsByTagName("input")[0].files;
        if (allFiles.length == 0) {
          alert('No file selected!');
        } else {
          numUploads.total = allFiles.length;
          $("#status").removeClass("hidden");
          $("#status-message").text("Uploading file " + numUploads.done + " of " + numUploads.total + "...");
          for (var i = 0; i < allFiles.length; i++) {
            sendFileToDrive(allFiles[i]);
          }
        }
      }

      function sendFileToDrive(file) {
        var reader = new FileReader();
        reader.onload = function (e) {
          var content = reader.result;
          console.log('Sending ' + file.name);
          var currFolder = 'Something';
          google.script.run.withSuccessHandler(function(){
            numUploads.done = numUploads.done + 1;
            if(numUploads.done !== numUploads.total){
              $("#status-message").text("Uploading file " + numUploads.done + " of " + numUploads.total + "...");
            } else{
              $("#status-message").text("Uploading finished!");
            }
            
          }).withFailureHandler(function(e){
            alert(e.message);
          }).uploadFileToDrive(content, file.name, currFolder);
        }
        reader.readAsDataURL(file);
      }
    });
  </script>

  <style>
    body, html{
      margin: 0;
      padding: 0;
    }

    html{
      height: 100%;
    }

    body{
      min-height: 100%;
      overflow-x: hidden;
      background-color: #3498db;
    }

    .flex-center-wrap{
      height: 100vh;
      width: 100vw;
      padding: 0;
      position: absolute;
      top: 0;
      left: 0;
      margin: 0;
      display: -webkit-flex;
      display: -moz-flex;
      display: -o-flex;
      display: -ms-flex;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .flex-center{
      position: relative;
      max-height: 80vh;
      width: 500px;
      max-width: 90vw;
    }
    
    .dropzone{
      height: 300px;
      border: 3px dashed  #3498db;
    }
    
    .dropzone .dz-message{
      margin: 117px 0 !important;
    }

    .dz-progress,
    .dz-error-message,
    .dz-success-mark,
    .dz-error-mark{
      display: none !important;
    }
    
    h1,h2,h3,h4,h5,h6{
      text-align: center;
      font-family: 'Catamaran', sans-serif;
      margin: 10px 0;
    }
    
    p{
      text-align: center;
    }
  </style>
</body>

这是server.gs

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

function uploadFileToDrive(base64Data, fileName) {
  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 folder;

    try{
      folder = DriveApp.getFolderById(""); //removed this for security
    } catch(e){
      folder = DriveApp.createFolder("social-media-dropzone");
    }

    var file = folder.createFile(ss);
    return file.getName();
  } catch(e){
    return 'Error: ' + e.toString();
  }
}

有没有办法增加限制,还是应该废弃此方法并尝试Google脚本以外的其他内容?

此处server.gs使用的是Advanced Drive API:

function doGet() {
  var output = HtmlService.createHtmlOutputFromFile('form').setSandboxMode(HtmlService.SandboxMode.IFRAME);
  output.addMetaTag('viewport', 'width=device-width, initial-scale=1');
  return output;
}

function uploadFileToDrive(base64Data, fileName) {
    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 file = folder.createFile(ss);
    var folderId = ""; //removed for security
    var file = {
      title: fileName,
      mimeType: ss.type,
      parents: [{id: folderId }]
    };
    Drive.Files.insert(file, ss);

    return null;
}

即使使用高级API,上传也会因为太大而失败。我用8mb视频和15mb视频测试了它,后者失败了。

1 个答案:

答案 0 :(得分:0)

Apps脚本不是我的首选。这取决于你的用例,但我可能会采用纯粹的客户端JavaScript方法。

无论您使用哪种客户,您都需要使用可恢复的上传。我相信这可以通过高级驱动器服务提供给Apps脚本。请参阅https://developers.google.com/apps-script/advanced/drivehttps://developers.google.com/drive/v2/reference/files/update