3 回答

TA貢獻2041條經驗 獲得超4個贊
更新:Google表單現在可以上傳文件。在Google表單可以上傳文件之前發布了此答案。
此解決方案不使用Google表單。這是一個使用Apps Script Web App的示例,它與Google表單非常不同。Web App本質上是一個網站,但您無法為其獲取域名。這不是Google表單的修改,無法上傳文件。
注意:我確實有一個同時包含UI服務和HTML服務的示例,但是由于不推薦使用UI服務,因此刪除了UI服務示例。
注意:現在只有唯一的沙箱設置IFRAME。我想onsubmit在開始的表單標簽中使用屬性: <form onsubmit="myFunctionName()">,這可能導致表單提交后從屏幕上消失。
如果您使用的是NATIVE模式,則文件上傳Web App可能不再起作用。使用NATIVE模式時,表單提交不會調用頁面從屏幕上消失的默認行為。如果您使用的是NATIVE模式,則文件上載表單不再起作用,那么您可能正在使用“提交”類型的按鈕。我猜測您可能還會使用“ google.script.run”客戶端API將數據發送到服務器。如果您希望頁面在提交表單后從屏幕上消失,則可以采用另一種方法。但是您可能不在乎,甚至不希望頁面停留在屏幕上。根據您的需要,您將需要配置設置并以某種方式編碼。
如果您使用的是“提交”類型的按鈕,并且想要繼續使用它,則可以嘗試event.preventDefault();在提交事件處理函數中添加到代碼中。否則,您將需要使用google.script.run客戶端API。
可以使用Apps腳本HTML服務創建用于將文件從用戶計算機驅動器上載到Google云端硬盤的自定義表單。這個例子需要編寫一個程序,但是我在這里提供了所有基本代碼。
本示例顯示了帶有Google Apps腳本HTML服務的上傳表單。
你需要什么
Google帳號
Google云端硬碟
Google Apps腳本-也稱為Google腳本
Google Apps腳本
結束Google Apps腳本代碼編輯器的方法有很多種。
直接從以下網址加載App腳本:https: //script.google.com
首先打開Google表格,然后打開Apps腳本
轉到您的Google云端硬盤,然后打開“應用程序腳本”:https : //drive.google.com/drive/#my-drive
轉到您的Google云端硬盤,然后單擊Apps Script項目文件
Google文檔中的Open Apps腳本
等等
我之所以這樣說是因為,如果您不了解所有可能性,那么可能會有些混亂。Google Apps腳本可以嵌入Google網站,表格,文檔或表單中,也可以作為獨立應用程序使用。
Apps腳本概述
此示例是帶有HTML Service的“獨立”應用程序。
HTML服務-使用HTML,CSS和Javascript創建Web應用
Google Apps腳本的內僅包含兩種類型的文件Project:
腳本
的HTML
腳本文件具有.gs擴展名。該.gs代碼是用JavaScript編寫的服務器端代碼,是Google自己的API的組合。
復制并粘貼以下代碼
保存
創建第一個命名版本
發布它
設置權限
您就可以開始使用它了。
開始于:
在Apps腳本中創建一個新的空白項目
復制并粘貼以下代碼:
使用HTML服務上傳文件:
Code.gs文件(默認創建)
//For this to work, you need a folder in your Google drive named:
// 'For Web Hosting'
// or change the hard coded folder name to the name of the folder
// you want the file written to
function doGet(e) {
return HtmlService.createTemplateFromFile('Form')
.evaluate() // evaluate MUST come before setting the Sandbox mode
.setTitle('Name To Appear in Browser Tab')
.setSandboxMode();//Defaults to IFRAME which is now the only mode available
}
function processForm(theForm) {
var fileBlob = theForm.picToLoad;
Logger.log("fileBlob Name: " + fileBlob.getName())
Logger.log("fileBlob type: " + fileBlob.getContentType())
Logger.log('fileBlob: ' + fileBlob);
var fldrSssn = DriveApp.getFolderById(Your Folder ID);
fldrSssn.createFile(fileBlob);
return true;
}
創建一個html文件:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<h1 id="main-heading">Main Heading</h1>
<br/>
<div id="formDiv">
<form id="myForm">
<input name="picToLoad" type="file" /><br/>
<input type="button" value="Submit" onclick="picUploadJs(this.parentNode)" />
</form>
</div>
<div id="status" style="display: none">
<!-- div will be filled with innerHTML after form submission. -->
Uploading. Please wait...
</div>
</body>
<script>
function picUploadJs(frmData) {
document.getElementById('status').style.display = 'inline';
google.script.run
.withSuccessHandler(updateOutput)
.processForm(frmData)
};
// Javascript function called by "submit" button handler,
// to show results.
function updateOutput() {
var outputDiv = document.getElementById('status');
outputDiv.innerHTML = "The File was UPLOADED!";
}
</script>
</html>
這是一個完整的工作示例。它只有兩個按鈕和一個<div>元素,因此在屏幕上看不到太多。如果.gs腳本成功,則返回true,然后onSuccess運行函數。onSuccess函數(updateOutput)將內部HTML div消息“消息已上傳!” 注入元素。
保存文件,為項目命名
使用菜單:File,Manage Version然后保存第一個版本
Publish,Deploy As Web App 然后更新
第一次運行腳本時,它將要求權限,因為它將文件保存到驅動器中。首次授予權限后,Apps腳本將停止,并且不會完全運行。因此,您需要再次運行它。第一次后,該腳本將不再要求權限。
Apps腳本文件將顯示在您的Google云端硬盤中。在Google云端硬盤中,您可以為有權訪問和使用腳本的人員設置權限。通過簡單地向用戶提供鏈接來運行腳本。就像加載網頁一樣使用鏈接。
在StackOverflow的以下鏈接中可以看到使用HTML服務的另一個示例:
使用HTML服務上傳文件
關于過時的UI服務的注意事項:
UI服務與getUi()Spreadsheet類(或其他類)的Ui 方法之間存在差異。AppsScript UI服務已于2014年12月11日棄用。它將繼續工作一段時間,但是您鼓勵使用HTML服務。
Google文檔-UI服務
即使UI服務被棄用,有一個getUi()電子表格類添加的方法自定義菜單,這是不棄用:
電子表格類-獲取UI方法
我之所以提及這一點,是因為它們都使用術語UI可能會造成混淆。
UI方法返回一個Ui返回類型。
您可以添加HTML的UI服務,但你不能使用<button>,<input>或<script>與UI服務的HTML標簽。
添加回答
舉報