Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/368.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 谷歌应用程序脚本文件上传(通过HTML格式)仅在脚本为;“绑定”;(测试独立脚本时,HTTP 403错误)_Javascript_Forms_Google Apps Script_Upload_Http Status Code 403 - Fatal编程技术网

Javascript 谷歌应用程序脚本文件上传(通过HTML格式)仅在脚本为;“绑定”;(测试独立脚本时,HTTP 403错误)

Javascript 谷歌应用程序脚本文件上传(通过HTML格式)仅在脚本为;“绑定”;(测试独立脚本时,HTTP 403错误),javascript,forms,google-apps-script,upload,http-status-code-403,Javascript,Forms,Google Apps Script,Upload,Http Status Code 403,要将本地文件上载到Google Drive,我有一个HTML(参见下面的代码),它以模式显示在用户打开的Google工作表的上方。HTML表单中有,当我单击发送表单对象时,如果此Google Apps脚本“绑定”到特定的表单文件(并使用工具>脚本编辑器…菜单编写),我会成功上传文件 如果我将脚本保存为独立脚本,然后在我选择的Sheets文件上测试它(已安装并启用),那么的onclick操作和调用google.script.run.aServerFunction(…)会导致网络错误:由于HTTP

要将本地文件上载到Google Drive,我有一个HTML
(参见下面的代码),它以模式显示在用户打开的Google工作表的上方。HTML表单中有
,当我单击发送表单对象时,如果此Google Apps脚本“绑定”到特定的表单文件(并使用
工具>脚本编辑器…
菜单编写),我会成功上传文件

如果我将脚本保存为独立脚本,然后在我选择的Sheets文件上测试它(已安装并启用),那么
的onclick操作和调用
google.script.run.aServerFunction(…)
会导致
网络错误:由于HTTP 403导致连接失败
。要澄清这一点,我的意思是创建一个独立脚本并在一个Sheets文件上测试它:。在早期的代码迭代中,我也遇到了某种授权脚本错误。当脚本私下发布供测试人员在工作表上使用时,也会出现相同的错误。不幸的是,我想我需要一个独立的脚本,以后可以作为一个附加组件发布,而不是使用
Tools>scripteditor…
菜单将其绑定到一张工作表上

我的第一篇文章堆栈溢出-请原谅任何行话或排版错误,谢谢

HTML改编自教程:

    <!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
    </script>
    <script>
        function failed(event) {
          $("div.response").text(event);
          //google.script.run.selectStuff();
          //google.script.host.close();
        }
      </script>
  </head>
  <body>
    <form id="myForm">

    <label>Your Name</label>
    <input type="text" name="myName">

    <label>Pick a file</label>
    <input type="file" name="myFile">

    <input type="submit" value="Upload File" 
               onclick="google.script.run.withFailureHandler(failed)
                        .uploadFiles(this.parentNode);
                        return false;">
</form>
<div class="response"></div>
  </body>

</html>

我相信您之所以会出现HTTP403错误,是因为表单DOM元素在工作表加载项中的google.script.run.myfunction(…)中是非法参数。尽管它们在这里被称为法律参数,但我认为附加组件还有一个附加限制,即不能传递任何类型的DOM元素

我提出的解决方案是使用本机javascript中的函数将上传的文件转换为base64编码字符串,并将字符串传递给google脚本,然后将其转换回要上传到google drive的文件。 base64编码字符串的开头如下:

资料:application/pdf ;;base64,JVBERi0xLjMKJcTl8uXrp/Og0MTG

煤气

HTML脚本

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
    </script>

  </head>
  <body>
    <form id="myForm">

    <label>Your Name</label>
    <input type="text" name="myName">

    <label>Pick a file</label>
    <input type="file" id = "filemy" name="myFile">

    <input type="button" value="Upload File" 
               onclick="upload(this.parentNode)">
</form>
<div class="response"></div>
  </body>
  <script>
        function failed(event) {
          $("div.response").text(event);
          //google.script.run.selectStuff();
          //google.script.host.close();
        }

        function upload(frmData){
        var file = document.getElementById("filemy").files[0]
        var reader = new FileReader()
        //reader.onload is triggered when readAsDataURL is has finished encoding
        //This will take a bit of time, so be patient
        reader.onload = function(event) {
        // The file's text will be printed here
        console.log("File being Uploaded")
        //console.log(event.target.result)
        google.script.run.withFailureHandler(failed).withSuccessHandler(failed)
                        .uploadFiles(event.target.result);
        };

        reader.readAsDataURL(file);
        console.log(reader.result)
        }
      </script>

</html>

你的名字
挑选一个文件
函数失败(事件){
$(“div.response”)。文本(事件);
//google.script.run.selectStuff();
//google.script.host.close();
}
函数上传(frmData){
var file=document.getElementById(“filemy”).files[0]
var reader=new FileReader()
//readAsDataURL完成编码后,将触发reader.onload
//这需要一点时间,所以要有耐心
reader.onload=函数(事件){
//文件的文本将在此处打印
log(“正在上载的文件”)
//console.log(event.target.result)
google.script.run.withFailureHandler(失败)。withSuccessHandler(失败)
.uploadFiles(event.target.result);
};
reader.readAsDataURL(文件);
console.log(reader.result)
}
最后的提示:我没有对代码进行过广泛的测试,我已经将其用于pdf文件和最大大小为2.6MB的image/png文件。因此,请在继续使用其他类型的文件之前尝试这两种文件类型! 此外,上传文件确实需要一段时间,所以请耐心等待(约5-10秒)。特别是因为没有进度条来显示上传进度,感觉好像什么都没有发生


希望有帮助

不能从未绑定到电子表格的脚本中使用
getActiveSheet()
。您有:
var sheet1=SpreadsheetApp.getActiveSheet()您需要按ID获取电子表格文件。除非URL是唯一可用的工具,否则按URL获取电子表格文件毫无意义。您能否解释一下如何执行此操作:“如果我将脚本保存为独立脚本,然后在我选择的工作表文件上测试它(已安装并启用)。”您是否正在尝试创建工作表加载项?如果你正在创建一个独立的脚本,你是在使用doGet()来为HTML页面服务吗?@SandyGood非常感谢这一点。但是没有修复“NetworkError:由于HTTP 403导致的连接失败”——HTML的onclick中的失败处理程序仍然会触发。我已将上面的代码更改为删除
getActiveSheet()
@JackBrown我正在尝试创建一个工作表加载项。这里说,我可以通过编写一个独立的脚本来实现这一点,该脚本稍后将在特定的工作表上进行测试,并可以作为附加组件发布:()。我正在使用()中的说明来“验证在独立脚本中编写的加载项在应用于工作表时是否能够正常工作”。我也私下出版了。没有使用doGet()-我使用
SpreadsheetApp.getUi().showModalDialog(htmlOutputObj,“上传学生名册”)。由于您将脚本用作工作表加载项,因此可以使用“getactive()”获取电子表格。并且您运行的测试加载项已安装并启用,因此授权不应该是一个问题。我在这里不知所措:/。我会给它一个镜头,看看我是否可以重现错误,并希望其他人能够给你一个比我更好的建议。我明天会尝试这个-但你得到了一个pdf和png图像工作,这是超过我的管理,所以应该工作!非常感谢!!
function uploadFiles(formObject) {
  // extract contentType from the encoded string 
  var contentType = formObject.split(",")[0].split(";")[0].split(":")[1]
  // New Blob(data,contentType,name)
  // Use base64decode to get file data
  var blob = Utilities.newBlob(Utilities.base64Decode(formObject.split(",")[1]), contentType, "trial")
  var driveFile = DriveApp.getFolderById("your Folder ID here").createFile(blob);
  //return contentType, can be anything you like
  return blob.getContentType()
}
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
    </script>

  </head>
  <body>
    <form id="myForm">

    <label>Your Name</label>
    <input type="text" name="myName">

    <label>Pick a file</label>
    <input type="file" id = "filemy" name="myFile">

    <input type="button" value="Upload File" 
               onclick="upload(this.parentNode)">
</form>
<div class="response"></div>
  </body>
  <script>
        function failed(event) {
          $("div.response").text(event);
          //google.script.run.selectStuff();
          //google.script.host.close();
        }

        function upload(frmData){
        var file = document.getElementById("filemy").files[0]
        var reader = new FileReader()
        //reader.onload is triggered when readAsDataURL is has finished encoding
        //This will take a bit of time, so be patient
        reader.onload = function(event) {
        // The file's text will be printed here
        console.log("File being Uploaded")
        //console.log(event.target.result)
        google.script.run.withFailureHandler(failed).withSuccessHandler(failed)
                        .uploadFiles(event.target.result);
        };

        reader.readAsDataURL(file);
        console.log(reader.result)
        }
      </script>

</html>