我正在尝试更改 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?
谢谢
最佳答案
首先请注意 multiple
HTML 上的属性 <input>
标签是在 HTML5 上引入的,并且仅受现代浏览器支持(例如,对于来自 Gecko 1.9.2 的 Firefox,它将来自 3.6 版)
现在,要为多个文件上传设置 HTML 表单,您必须:
明确指定您的 HTML 文档是 HTML5。您的文档必须以:
<!DOCTYPE html>
为了正确上传文件到您的服务器,您必须设置您的 表格 enctype属性为 multipart/form-data :
<form id="myForm" enctype="multipart/form-data">
您还必须指定您的文件 input标记为多个 file input使用 multiple attribute 标记.你好像有 这是正确的,但以防万一尝试:
<input type="file" name="myFile" id="filesID" multiple="multiple" />
相反。
在 for
中也(至少)有几个问题用于处理所选文件的 Javascript 代码循环;您正在引用 input.length
和 input.input[i]
什么时候应该引用 input.files.length
和 input.files[i]
相反:
for (var i = 0; i < input.files.length; i++) {
var file = folder.createFile(input.files[i]);
file.setDescription("Uploaded by " + form.myName);
}
我强烈建议您查看 super 有用的 MDN mini tutorial on handling file uploads有关详细信息和示例。
此外,如果您愿意添加库和插件,bootstrap fileinput是一个非常有用的工具,非常容易合并和用于您想要的任何形式。
在任何情况下,您最终都会得到一个发送文件数组的表单,您也可以在客户端上以 FileList 的形式访问这些文件。对象存储在 files property 上包含 File 的输入元素对象,而不仅仅是单个文件元素。如上代码所示,您可以访问此 FileList
中的任何文件。对象作为数组 ( input.files[i]
)。
关于html - 尝试使用 appscripts 将多个文件上传到 Google 云端硬盘,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31664648/