Google表格文件上传完整示例

更新：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 tofunction 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">    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标签。

Google表格文件上传完整示例

3回答