如何在Google驱动器文件上传上运行预加载器 [英] how to run a preloader on google drive file upload

问题描述

我有一个使用apps脚本制作的html.该html接受用户的输入和文件上传.

I have an html made using apps script. This html takes input and file upload from user.

<div class="inside_form file_upload">
<label>Upload Resume: </label>
<input id="file" type="file" onchange="saveFile(this)" class="custom_inputs">
</div>

<div class="input-field col s7">
<button id="btn" class="btn blue-grey darken-3 waves-effect waves-light right">Submit<i class="mdi-content-send right"></i></button>
</div>

在文件上传中，我使用了将文件上传到Google驱动器上的功能.我在"Tanaike"

On file upload I have used a function which uploads the file on google drive. I found this code on web made by "Tanaike"

它是这样的:-

 document.getElementById('btn').addEventListener('click',referstuff);

function saveFile(f) {
    const file = f.files[0];
    const fr = new FileReader();
    fr.onload = function(e) { 
      const obj = {
        filename: file.name,
        mimeType: file.type,
        bytes: [...new Int8Array(e.target.result)]
      };
      google.script.run.withSuccessHandler(e => console.log(e)).saveFile(obj);
    };
    fr.readAsArrayBuffer(file);   
  }

function referstuff()
{

 
 var ref = {};
 
 ref.ei = document.getElementById('ei').value;
 ref.en = document.getElementById('en').value;
 ref.emi = document.getElementById('emi').value;
 ref.mn = document.getElementById('mn').value;
 ref.doj = document.getElementById('doj').value;
 ref.pr = document.getElementById('pr').value;
 ref.nmref = document.getElementById('nmref').value;
 ref.emiref = document.getElementById('emiref').value;
 ref.mnref = document.getElementById('mnref').value;
 ref.pref = document.getElementById('pref').value;
 ref.rlink = document.getElementById('file').value;
 ref.reason = document.getElementById('reason').value;
 ref.plc = document.getElementById('plc').value;
 ref.dp = document.getElementById('dp').value;
 ref.exp = document.getElementById('exp').value;
 

      if (ref.ei == "" || ref.en== "" || ref.emi== "" || ref.mn== "" || ref.doj== "" || ref.pr== "" || ref.nmref== "" || ref.emiref== "" || ref.mnref== "" || ref.pref== "" || ref.plc== "" || ref.dp== "" || ref.exp== "") 
      {
           alert("You have missed to fill a mandatory field!!");
 
      } 
 
      else
      {
           if(confirm("Do you really want to submit?"))
           {
               google.script.run.refsubmission(ref);
               const elem = document.getElementById('modal1');
               const instance = M.Modal.init(elem, {dismissible: false});
               instance.open();                               
           }
           
           else
           {
               alert("Action Dismissed!")
           
           }
      }
}

服务器端代码

function saveFile(e) {
  var blob = Utilities.newBlob(e.bytes, e.mimeType, e.filename);
  DriveApp.getFolderById('0AIigAJ4047IdUk9PVA').createFile(blob);
  var file = DriveApp.getFilesByName(e.filename).next().getId();
  
 Logger.log(file);
  
}

现在的问题是，有时文件上传需要花费一些时间，用户可以在文件上传之前触发提交按钮.

Now the issue is sometimes the file takes times to upload and the user can fire the submit button before the file uploads.

我想在文件开始加载后阻止显示，并在完成后停止.

I want to block display once the file start loading and stop when its done.

推荐答案

文件上传后，启用:

After file upload, enable it:

google.script.run.withSuccessHandler(e => {
  console.log(e);
  document.getElementById("btn").disabled = false;
}).saveFile(obj);

这篇关于如何在Google驱动器文件上传上运行预加载器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！