尝试使用 appscripts 将多个文件上传到 Google Drive

Posted

技术标签:

【中文标题】尝试使用 appscripts 将多个文件上传到 Google Drive【英文标题】:Trying to upload multiple files into Google Drive using appscripts 【发布时间】:2015-10-18 07:41:53 【问题描述】:

我正在尝试更改 ctrlq 的代码(可在此处找到:http://ctrlq.org/code/19747-google-forms-upload-files)以上传多个文件而不是 1 个。

这是我目前所拥有的: html

    <form id="myForm">
    <input type="text" name="myName" placeholder="Name">
    <input type="password" name="psw" placeholder="Password">
    <input type="text" name="myFolder" placeholder="Folder Name">
    <input type="file" name="myFile" id="filesID" multiple>
    <input type="submit" value="Upload File" 
           onclick="this.value='Uploading..';
                    google.script.run.withSuccessHandler(fileUploaded)
                    .uploadFiles(this.parentNode);
                    return false;">
</form>

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

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

<style>
 input  display:block; margin: 20px; 
</style>

谷歌脚本:

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


function uploadFiles(form) 

  try 
    var input = document.getElementById('filesID');
    var dropbox = "User Files";
    var folder, folders = DriveApp.getFoldersByName(dropbox);

    if (folders.hasNext()) 
      folder = folders.next();
     else 
      folder = DriveApp.createFolder(dropbox);
    

    for (var i = 0; i < input.length; i++) 
      var file = folder.createFile(input.input[i]);    
      file.setDescription("Uploaded by " + form.myName);
    
    return "File uploaded successfully " + file.getUrl();

   catch (error) 

    return error.toString();
  


我收到错误消息,指出函数 createFile 无法运行。我希望这是因为变量 myFile 最初不是一个数组。如何将所有上传的文件放入一个数组中,然后为每个文件运行 createFile?

谢谢

【问题讨论】:

这是我如何处理多个文件上传:***.com/questions/28147486/… 【参考方案1】:

首先要知道,HTML &lt;input&gt; 标记上的 multiple 属性是在 HTML5 上引入的,并且仅受现代浏览器支持(例如,对于 Gecko 1.9.2 中的 Firefox,这将是从 3.6 版开始)

现在,要为多个文件上传设置 HTML 表单,您必须:

明确指定您的 HTML 文档是 HTML5。您的文档必须以:

&lt;!DOCTYPE html&gt;

为了正确地将文件上传到您的服务器,您必须设置您的 将enctype 属性转化为multipart/form-data:

&lt;form id="myForm" enctype="multipart/form-data"&gt;

您还必须使用multiple attribute 将文件input 标记指定为多个file input 标记。你好像有 没错,但以防万一:

&lt;input type="file" name="myFile" id="filesID" multiple="multiple" /&gt;

改为。

在处理所选文件的 javascript 代码的 for 循环中也存在(至少)几个问题;当您应该引用 input.files.lengthinput.files[i] 时,您正在引用 input.lengthinput.input[i]

for (var i = 0; i < input.files.length; i++) 
      var file = folder.createFile(input.files[i]);    
      file.setDescription("Uploaded by " + form.myName);

我强烈建议您查看超级有用的 MDN mini tutorial on handling file uploads 了解详细信息和示例。

此外,如果您愿意添加库和插件,bootstrap fileinput 是一个非常有用的工具,可以很简单地以任何您想要的形式合并和使用。

无论如何,您最终会得到一个发送文件数组的表单,您也可以在客户端上以 FileList 对象的形式访问这些文件,该对象存储在包含 File 对象的输入元素的 files property 上,而不是只是一个文件元素。如上面的代码所示,您可以将 FileList 对象中的任何文件作为数组 (input.files[i]) 访问。

【讨论】:

由于某种原因,这给了我错误“ReferenceError: "document" is not defined" 您正在调用一个函数,该函数需要在加载文档之前引用当前文档。使用 chrome 开发工具调试脚本。如果您从给您错误的行进行回溯,您将看到您在哪里进行调用,您应该将其放入 document.addEventListener("DOMContentLoaded", function(event)

以上是关于尝试使用 appscripts 将多个文件上传到 Google Drive的主要内容,如果未能解决你的问题,请参考以下文章