javascript - 由于脚本已停止工作，Google 应用程序是否有任何更新？

Question

任何人都可以帮助解决已停止工作的脚本吗:

这是一个(去年)创建的 html/css 表单，用于获取 Google 电子表格上的响应以及文件夹中上传的文件。直到今年年初，它都运行良好，但现在就不行了。我的意思是像往常一样，我运行一个函数+部署应用程序，我得到链接并出现表单，但提交后我什么也没有得到，空白页面和电子表格不包含任何内容。非常感谢您的指导。

这是我的代码:

表单.html

<script>
  // Javascript function called by "submit" button handler,
  // to show results.
  function updateOutput(resultHtml) {
    toggle_visibility('inProgress');
    var outputDiv = document.getElementById('output');
    outputDiv.innerHTML = resultHtml;
  }

  // From blog.movalog.com/a/javascript-toggle-visibility/
  function toggle_visibility(id) {
    var e = document.getElementById(id);
    if(e.style.display == 'block')
      e.style.display = 'none';
    else
      e.style.display = 'block';
  }
</script>


<link href='http://fonts.googleapis.com/css?family=Bitter' rel='stylesheet' type='text/css'>
<style type="text/css">

img {
      display: block;
      margin-left: auto;
      margin-right: auto;
      width:500px;
      height:170px;
     ;
}

form {
    width:450px;
    padding:30px;
    margin: auto;
    background: #FFF;
    border-radius: 10px;
    -webkit-border-radius:10px;
    -moz-border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.13);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.13);
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.13);
}

h2 {
    width:450px;
    padding:30px;
    margin: auto;
    margin-top: 5px;
    margin-bottom: 10px;
    text-align: center;
    border-radius: 10px;
    background: #FF8500;
    color: #fff;
    box-shadow: 1px 1px 4px #DADADA;
    -moz-box-shadow: 1px 1px 4px #DADADA;
    -webkit-box-shadow: 1px 1px 4px #DADADA;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}

h1 {
    background: #2A88AD;
    padding: 20px 30px 15px 30px;
    margin: -30px -30px 30px -30px;
    border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    color: #fff;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
    font: normal 30px 'Bitter', serif;
    -moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    -webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    border: 1px solid #257C9E;
}

h1 > span {
    display: block;
    margin-top: 2px;
    font: 13px Arial, Helvetica, sans-serif;
}

label {
    display: block;
    font: 13px Arial, Helvetica, sans-serif;
    color: #888;
    margin-bottom: 15px;
}

input[type="text"],
input[type="email"],
input[type="file"],
textarea,
select {
    display: block;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    padding: 8px;
    outline: none;
    border: 1px solid #B0CFE0;
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
}

section{
    font: normal 20px 'Bitter', serif;
    color: #2A88AD;
    margin-bottom: 5px;
}

section span {
    background: #2A88AD;
    padding: 5px 10px 5px 10px;
    position: absolute;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border: 4px solid #fff;
    font-size: 14px;
    margin-left: -45px;
    color: #fff;
    margin-top: -3px;
}

input[type="button"], 
input[type="submit"]{
    background: #2A88AD;
    padding: 8px 20px 8px 20px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    color: #fff;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
    font: normal 30px 'Bitter', serif;
    -moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    -webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    border: 1px solid #257C9E;
    font-size: 15px;
}
input[type="button"]:hover, 
input[type="submit"]:hover{
    background: #2A6881;
    -moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
    -webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
    box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
}


</style>

<div id="formDiv">
<!-- Form div will be hidden after form submission -->
<img src="http://www.greenman-advertising.com/wp-content/uploads/2013/08/header_problemSolving_03.jpg">
<form id="myForm" runat="server">
<h1>Job application<span>Apply now and get the opportunity to join us!</span></h1>
<section> <span>1</span>Personal details</section>
    Full name: <input type="text" name="name" placeholder="First name & Last name"/><br/>
    Date of birth: <input type="text" name="birth" placeholder="dd/mm/yyyy"/><br/>
    Nationality:  <select name="nationality">
    <option>Test1</option>
    <option>Test2</option>
    <option>Test3</option>
     </select><br/>
     Marital status:  <select name="marital">
    <option>...</option>
    <option>Married</option>
    <option>Single</option>
         </select><br/>
    Please state the age of your children who will be registered in our school: <input type="text" name="children" placeholder="Example: 5;9;12 or 0"/><br/>

    <section> <span>2</span>Experiences and qualifications</section>
    Years of experience:  <select name="years">
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
    <option>8</option>
    <option>9</option>
    <option>10</option>
    <option>10+</option>
    </select><br/>
    Highest qualification obtained: <input type="text" name="qualification" placeholder="Example: Degree, Master, .."/><br/>
    Educational qualification obtained: <input type="text" name="educational" placeholder="Example: QTS,PGCE,CELTA, .."/><br/>
    English language level:  <select name="profiency">
    <option>...</option>
    <option>Fluent English proficient</option>
    <option>Advanced</option>
     <option>Intermediate</option>
    <option>Early intermediate</option>
    <option>Beginner</option>
    </select><br/>
    <section> <span>3</span>Position applied for</section>
    Subject:  <select name="subject">
    <optgroup label="Teaching">
    <option>...</option>
    <option>Arts</option>
    <option>Biology</option>
    <option>Chemistry</option>
    <option>Computer Science</option>
    <option>English</option>
    <option>Math</option>
    <option>Physics</option>
    <option>Science</option>
    <option>Social Studies</option>
    </optgroup>
    <optgroup label="Other">
    <option>...</option>
    <option>Principal</option>
    <option>Deputy principal</option>
    <option>Educational spervisor</option>
    </optgroup>
    </select><br/>
    Grade level ( or Section):  <select name="grade">
    <option>...</option>
    <option>Higher grades</option>
    <option>Lower grades</option>
    <option>IGCSE</option>
    <option>AS</option>
    <option>A2</option>
    <option>SAT</option>
    </select><br/>
<section> <span>4</span>Contact details</section>
    Email: <input type="email" name="email" placeholder="example@domain.com"/><br/>
    Phone number: <input type="text" name="phone" placeholder="[+]code country/phone number"/><br/>
    Skype: <input type="text" name="skype" placeholder="username"/><br/>
<section> <span>5</span>Attachments</section>
    CV (pdf/doc/docx only): <input type="file" name="myFile"/><br/>
    Qualification (scan): <input type="file" name="myFile2"/><br/>
    Other qualification (scan): <input type="file" name="myFile3"/><br/>
    Passport (scan): <input type="file" name="myFile4"/><br/>
    <input type="submit" value="Apply"
      onclick="toggle_visibility('formDiv'); toggle_visibility('inProgress');
        google.script.run
          .withSuccessHandler(updateOutput)
          .processForm(this.parentNode)" /><br/>
</form>
</div>

<div id="inProgress" style="display: none;">
<!-- Progress starts hidden, but will be shown after form submission. -->
Uploading. Please wait...
</div>

<div id="output">
  <!-- Blank div will be filled with "Thanks.html" after form submission. -->
</div>

代码.gs

var submissionSSKey = '1urIXPV2NdsqTJ5zXJb1_t_EdsY7Kuh3VcSBJ4cnPIEg';
var folderId = "0B0lYW3YSUvX2ZDc0WnhJdFhkQk0";

function doGet(e) {
  var template = HtmlService.createTemplateFromFile('Form.html');
  template.action = ScriptApp.getService().getUrl();
  return template.evaluate();
}


function processForm(theForm) {
  var fileBlob = theForm.myFile;
  var fileBlob2 = theForm.myFile2;
  var fileBlob3 = theForm.myFile3;
  var fileBlob4 = theForm.myFile4;
  
  var folder = DriveApp.getFolderById(folderId);
  var doc = folder.createFile(fileBlob);
  var doc2 = folder.createFile(fileBlob2);
  var doc3 = folder.createFile(fileBlob3);
  var doc4 = folder.createFile(fileBlob4);


  // Fill in response template
  var template = HtmlService.createTemplateFromFile('Thanks.html');
  var name = template.name = theForm.name;
  var birth = template.birth = theForm.birth;
  var nationality = template.nationality = theForm.nationality;
  var marital = template.marital = theForm.marital;
  var children = template.children = theForm.children;
  var years = template.years = theForm.years;
  var profiency = template.profiency = theForm.profiency;
  var qualification = template.qualification = theForm.qualification;
  var educational = template.educational = theForm.educational;
  var subject = template.subject = theForm.subject;
  
  var grade = template.grade = theForm.grade;
  var email = template.email = theForm.email;
  var phone = template.phone = theForm.phone;
  var skype = template.skype = theForm.skype;

  var fileUrl = template.fileUrl = doc.getUrl();
  var fileUrl2 = template.fileUrl = doc2.getUrl();
  var fileUrl3 = template.fileUrl = doc3.getUrl();
  var fileUrl4 = template.fileUrl = doc4.getUrl();

  // Record submission in spreadsheet
  var sheet = SpreadsheetApp.openById(submissionSSKey).getSheets()[0];
  var lastRow = sheet.getLastRow();
  var targetRange = sheet.getRange(lastRow+1, 1, 1, 18).setValues([[name,birth,nationality,marital,children,profiency,years,qualification,educational,subject,grade,email,phone,skype,fileUrl,fileUrl2,fileUrl3,fileUrl4]]);

  // Return HTML text for display in page.
  return template.evaluate().getContent();
}

谢谢.html

<div>
    <h2>Thank you <?= name ?>, <br>your application has been received.</h2>
</div>

Answer 1

是的，最近发生了一些变化。默认沙盒模式现在是 IFRAME 。您的doGet()函数没有指定沙箱模式，因此现在默认为 IFRAME 。这改变了您表单的行为。您有一个 <input>标签是 submit 的按钮类型。这会导致表单在提交时发出 GET 或 POST 请求。这会导致屏幕变为空白，并且可能会干扰 google.script.run.myfunction()调用服务器。将输入按钮类型从 submit 更改为至button .

目前:

<input type="submit" value="Apply"

更改为:

<input type="button" value="Apply"

我修改了名为 toggle_visibility 的函数的代码

if(e.style.display !== 'none')//Modified this line

曾经:

if(e.style.display === 'block')

样式可以有许多不同的设置。如果是inline例如，这会破坏代码。但如果是!== "none" ，那么如果它不是none ，那么它显然正在显示。

以下是共享 Apps 脚本文件的链接:

Link to Shared Apps Script File