简体   繁体   English

Google Apps 脚本 HTML 表单不会为海外用户提交

[英]Google Apps Script HTML form won't submit for overseas user

I have a small sidebar form that submits user data.我有一个提交用户数据的小边栏表单。 It is all functional for anyone in the USA but if someone from overseas tries to submit the form, it fails.它对美国的任何人都有效,但如果来自海外的人试图提交表格,它就会失败。 I even logged into the same user account as the one overseas and the form submits for me.我什至登录了与海外用户相同的用户帐户,并为我提交了表格。 I have never encountered an issue like this with GAS.我从来没有遇到过这样的 GAS 问题。 The account the user is logged into owns the spreadsheet that the script is housed in and he has tried both local and US IP addresses to submit the data (not sure if this even matters.) What do I need to change/include in my scripts to allow all users to be able to submit the form?用户登录的帐户拥有脚本所在的电子表格,并且他尝试了本地和美国 IP 地址来提交数据(不确定这是否重要。)我需要在脚本中更改/包含什么让所有用户都能够提交表单? Would creating a Webapp and trigger be a fix?创建 Webapp 和触发器会解决问题吗?

Code.gs代码.gs

//OPEN THE FORM IN SIDEBAR 
function showFormInSidebar() {      
  
  var form = HtmlService.createTemplateFromFile('Index').evaluate().setTitle('New Client');
  SpreadsheetApp.getUi().showSidebar(form);
  
}

//PROCESS FORM DATA
function processForm(formObject){ 
  
  var notes = [formObject.client,
               formObject.website,
               formObject.email,
               formObject.plan];
  
  var mTabs = [formObject.client,
               formObject.plan,
               formObject.timeAllowed,
               '',
               '',
               '00:00:00.000'];
  
  pushToSheets(notes,mTabs);
  
}

//INCLUDE HTML PARTS, EG. JAVASCRIPT, CSS, OTHER HTML FILES
function include(filename) {
  
  return HtmlService.createHtmlOutputFromFile(filename).getContent();
  
}


//THIS FUNCTION IS USED TO PUSH DATA TO EACH RESPECTIVE SHEET FROM THE SIDEBAR FORM SUBMISSION
function pushToSheets(notes,mTabs) {
  
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var noteTab = ss.getSheetByName('NOTES');
  var sheetArr = ['JAN','FEB','MAR','APR','MAY','JUN','JUL','AUG','SEPT','OCT','NOV','DEC'];
  //  var sheetArr = ['JAN','FEB'];
  var nLast = noteTab.getLastRow();
  noteTab.insertRowBefore(nLast+1);
  noteTab.getRange(nLast+1, 1,1,4).setValues([notes]);
  noteTab.getRange(2,1,nLast+1,17).sort([{column: 4, ascending: true}, {column: 1, ascending: true}])
  
  for(var x = 0; x < sheetArr.length; x++) {
    
    var sheet = ss.getSheetByName(sheetArr[x]);
    var sLength = sheet.getLastRow();
    sheet.insertRowBefore(sLength-1);
    sheet.getRange(sLength-1, 1,1,6).setValues([mTabs]);
    sheet.getRange(2, 1,sLength,11).sort([{column: 2, ascending: true}, {column: 1, ascending: true}])
    
  }
  
}

Index.html索引.html

<!doctype html>
<html lang="en">

  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
    <?!= include('JavaScript'); ?> <!-- See JavaScript.html file -->
    <title>Contact Details</title>
  </head>
  
  <body class="bg-secondary text-light">
    <div class="container">
      <?!= include('Form'); ?> <!-- See Form.html file -->
    </div>
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
   <script>
  $('#timeAllowed').keypress(function() {
   
  var regex = new RegExp("^[0-9]");
  var key = String.fromCharCode(event.charCode ? event.which : event.charCode);
  if (!regex.test(key)) {
      event.preventDefault();
      return false;
   }
   
    if(this.value.length == 2){
        this.value = this.value+':';
     }
     
    if(this.value.length == 5){
        this.value = this.value+':00';
     }
     
     if(this.value.length > 7) {
            
        return false;
     
     }
});
    </script>
 </body>
</html>

Form.html表格.html

 <form id="myForm" onsubmit="handleFormSubmit(this)" autocomplete="off">
  <div class="form-group">
    <label for="client">Client</label>
    <input class="form-control form-control-sm" type="text" class="form-control" id="clint" name="client" placeholder="Client Name">
  </div>
  <div class="form-group">
    <label for="gender">Plan</label>
    <select class="form-control form-control-sm" id="plan" name="plan" required>
      <option value="" selected disabled>Choose...</option>
      <option value="00 hosting">00 hosting</option>
      <option value="01 slim">01 slim</option>
      <option value="02 basic">02 basic</option>
      <option value="10 special">10 special</option>
      <option value="99 coming up">99 coming up</option>
      
      
    </select>
  </div>
    <div class="form-group">
    <label for="last_name">Time Allowed</label>
    <input class="form-control form-control-sm" type="text" class="form-control" pattern="[0-9][0-9]:[0-9][0-9]:[0-9][0-9]" title ="00:00:00" id="timeAllowed" name="timeAllowed" placeholder="00:00:00">
  </div>
  <div class="form-group">
    <label for="email">Email</label>
    <input class="form-control form-control-sm" type="email" class="form-control" id="email" name="email">
  </div>
  <div class="form-group">
    <label for="website">Website</label>
    <input class="form-control form-control-sm" type="text" class="form-control" id="website" name="website">
  </div>
  
  <button type="submit" class="btn btn-primary">Submit</button>
</form>

JavaScript.html JavaScript.html

<script>
  // Prevent forms from submitting.
  function preventFormSubmit() {
    var forms = document.querySelectorAll('form');
    for (var i = 0; i < forms.length; i++) {
      forms[i].addEventListener('submit', function(event) {
      event.preventDefault();
      });
    }
    
  }
  window.addEventListener('load', preventFormSubmit);    
      
      
  function handleFormSubmit(formObject) {
    google.script.run.processForm(formObject);
    document.getElementById("myForm").reset();
  }
</script>

Looks like I just needed to add this as a Webapp and that fixed the issue.看起来我只需要将其添加为 Webapp 即可解决问题。 Thank you for the suggestions!感谢你的建议!

//OPEN THE FORM IN SIDEBAR 
function showFormInSidebar() {      
  var form = HtmlService.createTemplateFromFile('test').evaluate().setTitle('New Client');
  SpreadsheetApp.getUi().showSidebar(form);
}


function doGet() {
  var form = HtmlService.createTemplateFromFile('Index').evaluate().setTitle('New Client');
  form.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
  return form;
}

test.html测试.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
  <center>
    <embed type="text/html" src="redacted"  width="290" height="800">
  </center>
  </body>
</html>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM