使用 Google Apps Script 从数组中的输入元素处理多个文件 [英] Handling multiple files from an input element in an array with Google Apps Script
问题描述
我有一个表单,它允许从下拉列表中选择一个项目并上传文件.项目的名称和 ID 保存在电子表格文档中.适用于一个文件...但我想上传多个文件.你能帮我修改脚本吗?
HTML 部分看起来像这样
<div class="caption"><h3>比尔道斯瓦尔</h3><p align="center"><input type="file" name="myFiles[]" id="myFiles" multiple></p>
我的脚本不起作用,如下所示:
var dropBoxId = "XYZ";var logSheetId = "ABC";函数 doGet(e) {return HtmlService.createHtmlOutputFromFile('InputForm.html');}函数上传文件(formObject){尝试 {//根据表单中提供的文件在 Drive 中创建一个文件var folder = DriveApp.getFolderById(dropBoxId);var input = document.getElementById('myFiles');for (i = 0; i
谢谢.
截至目前,您必须使用变通方法来处理多个文件.multiple 属性仅在 IFRAME 模式下有效,但文件输入在 IFRAME 模式下被破坏.
要查看此解决方法,请查看针对此问题的错误提交:https://code.google.com/p/google-apps-script-issues/issues/detail?id=4610
同样在你的代码中,你有一些服务器端和客户端代码的混合,这些代码不起作用:
var folder = DriveApp.getFolderById(dropBoxId);//服务器端var input = document.getElementById('myFiles');//客户端
您需要在客户端进行多文件处理
我想出了一个很好的多文件上传解决方案.限制是文件必须小于 10 MB.
代码.GS
function doGet() {return HtmlService.createHtmlOutputFromFile('index').setSandboxMode(HtmlService.SandboxMode.IFRAME);}功能保存文件(数据,名称,文件夹ID){var contentType = data.substring(5,data.indexOf(';'));var file = Utilities.newBlob(Utilities.base64Decode(data.substr(data.indexOf('base64,')+7)), contentType, name);DriveApp.getFolderById(folderId).createFile(file);}
index.html
<input type="file" id="myFiles" name="myFiles" multiple/><input type="button" value="Submit" onclick="SaveFiles()"/><脚本>var reader = new FileReader();var 文件;var 文件计数器 = 0;var folderId = "";reader.onloadend = 函数 () {google.script.run.withSuccessHandler(function(){文件计数器++;postNextFile();}).saveFile(reader.result,files[fileCounter].name,folderId);}函数保存文件(){var folderSelect = document.getElementById("folderSelectId");folderId = folderSelect.options[e.selectedIndex].value;files = document.getElementById("myFiles").files;postNextFile();}function postNextFile(){if(fileCounter < files.length){reader.readAsDataURL(files[fileCounter]);}else{fileCounter=0;alert("上传完成")}}
I have a form, which allows to select an item from a dropdown list and upload a file. The name and the ID of the item are saved in a Spreadsheet document. Works with one file...but I want to upload multiple files. Could you help me fixing the script?
The HTML part looks like this
<div class="col-md-4 col-sm-6 ">
<div class="caption">
<h3>Bildauswahl</h3>
<p align="center"><input type="file" name="myFiles[]" id="myFiles" multiple></p>
</div>
</div>
My script, which is not working, is the following:
var dropBoxId = "XYZ";
var logSheetId = "ABC";
function doGet(e) {
return HtmlService.createHtmlOutputFromFile('InputForm.html');
}
function uploadFiles(formObject) {
try {
// Create a file in Drive from the one provided in the form
var folder = DriveApp.getFolderById(dropBoxId);
var input = document.getElementById('myFiles');
for (i = 0; i<input.files.length; i++) {
var blob = input.files[i];
var file = folder.createFile(blob);
var ss = SpreadsheetApp.openById(logSheetId);
var sheet = ss.getSheets()[0];
sheet.appendRow([file.getName(), file.getUrl(), formObject.myName]);
}
// Return the new file Drive URL so it can be put in the web app output
return file.getUrl();
} catch (error) {
return error.toString();
}
}
Thanks.
As of right now you have to use a work around to work with multiple files. The multiple attribute only works in IFRAME mode, but file inputs are broken in IFRAME mode.
To see this workaround take a look at the bug submission for this issue: https://code.google.com/p/google-apps-script-issues/issues/detail?id=4610
Also in your code you have some mixing of server side and client side code that will not work:
var folder = DriveApp.getFolderById(dropBoxId); //server side
var input = document.getElementById('myFiles'); //client side
You will need to do your multiple file processing on the client side
I came up with a nice solution for multi-file uploading. Limitations are files must be under 10 MB.
CODE.GS
function doGet() {
return HtmlService.createHtmlOutputFromFile('index').setSandboxMode(HtmlService.SandboxMode.IFRAME);
}
function saveFile(data,name,folderId) {
var contentType = data.substring(5,data.indexOf(';'));
var file = Utilities.newBlob(Utilities.base64Decode(data.substr(data.indexOf('base64,')+7)), contentType, name);
DriveApp.getFolderById(folderId).createFile(file);
}
index.html
<div>
<input type="file" id="myFiles" name="myFiles" multiple/>
<input type="button" value="Submit" onclick="SaveFiles()" />
</div>
<script>
var reader = new FileReader();
var files;
var fileCounter = 0;
var folderId = "";
reader.onloadend = function () {
google.script.run
.withSuccessHandler(function(){
fileCounter++;
postNextFile();
}).saveFile(reader.result,files[fileCounter].name,folderId);
}
function SaveFiles(){
var folderSelect = document.getElementById("folderSelectId");
folderId = folderSelect.options[e.selectedIndex].value;
files = document.getElementById("myFiles").files;
postNextFile();
}
function postNextFile(){if(fileCounter < files.length){reader.readAsDataURL(files[fileCounter]);}else{fileCounter=0;alert("upload done")}}
</script>
这篇关于使用 Google Apps Script 从数组中的输入元素处理多个文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!