在Google Apps脚本中异步保存复选框

时间:2019-03-15 01:14:04

标签: javascript asynchronous google-apps-script

我是异步调用的新手,我认为这是问题所在。但是,我不太确定如何解决它,因为Google Apps脚本不支持promise,而且我也不知道如何使用它们。我听说如果在GAS中使用HTML Service,则可以实现诺言,这就是我正在使用的。但是,我对如何实现这一点不知所措。这是我到目前为止所拥有的。 主要问题是我需要将数据显示在下面服务器端的第二个Logger.log中(code.gs)。数据到达第一个logger.log(code.gs)中的函数,但是在第二个logger.log(code.gs)中显示用户缓存时,该对象为空(不为null)。可以使用任何键/数据,并且可以复制问题,因此它与异步调用有关,但是如何在GUI_JS代码中修复它?

服务器端(code.gs):

// global variable to save into the cache
var userCache = CacheService.getUserCache();

// SAVE OPERATION - saves the checkboxes into the user cache
function processSavedValues(checkboxesObj){
  Logger.log(checkboxesObj); // this line shows in Logger
  userCache.putAll(checkboxesObj, 20);
  var getCache = userCache.getAll(['key1','key2']);
  Logger.log(getCache); // this line doesn't show in Logger
}

// Loads the HTML Service of Apps Script
function doGet(request) {
  return HtmlService.createTemplateFromFile('index').evaluate();
}
function include(filename) {
  return HtmlService.createHtmlOutputFromFile(filename).getContent();
}

客户端(index.html):

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>

  <form>
    <fieldset class="columnList">
      <div>
        <input type="checkbox" id="key1" name="fieldset[]" value="value1">
        <label class="checkmark" for="key1">test1</label>
      </div>
      <div>
        <input type="checkbox" id="key2" name="fieldset[]" value="value2">
        <label class="checkmark" for="key2">test2</label>
      </div> 
    </fieldset>
  </form>

  <button onclick="saveAllCheckboxValues()">test</button>

  <?!= include('GUI_JS'); ?> 
  </body>
</html>

使用HTML服务(GUI_JS.html)的客户端:

<script>

// Saves all checkbox values into the cache
function saveAllCheckboxValues(){

  // Select all checkboxes in the document
  var allCheckboxes = document.querySelectorAll("input[type=checkbox]");

  // Create a Key/Value pairs with the IDs and values of each checkbox
  var checkboxesObj = {};
  for (var i = 0; i < allCheckboxes.length; i++) {
     checkboxesObj[allCheckboxes[i].id] = allCheckboxes[i].checked;
  }

  // sends the checkbox values server-side into the cache
  google.script.run.withSuccessHandler(checkboxSaved).processSavedValues(checkboxesObj);

  // displays successfully saved
  function checkboxSaved(){
    alert("Great Success!");
  }

}

</script>

Logger.log的结果

[19-03-14 18:28:38:913 PDT] {key1=true, key2=true}
[19-03-14 18:28:38:959 PDT] {}

1 个答案:

答案 0 :(得分:1)

我认为,您遇到问题的原因是对象中用于放入CacheService的布尔值。在CacheService中,字符串值用于放置。那么如何修改呢?请认为这只是几个答案之一。在我的修改中,processSavedValues()的功能已修改。

修改后的脚本:

function processSavedValues(checkboxesObj){
  Logger.log(checkboxesObj);
  userCache.put("sampleKey", JSON.stringify(checkboxesObj), 20); // Modified
  var getCache = userCache.get("sampleKey"); // Modified
  getCache = JSON.parse(getCache); // Added
  Logger.log(getCache);
}

参考文献:

如果这不起作用,而这不是您想要的结果,我表示歉意。