javascript - 在不重新加载侧边栏的情况下更新 Google Apps 脚本侧边栏中的内容

Question

我正在使用以下 Google Apps 脚本代码在 custom sidebar 中显示内容脚本运行时我的电子表格:

function test() {

  var sidebarContent = '1<br>';

  updateSidebar(sidebarContent);

  sidebarContent += '2<br>';

  updateSidebar(sidebarContent);

  sidebarContent += '3';

  updateSidebar(sidebarContent);

}

function updateSidebar(content) {

  var html = HtmlService.createHtmlOutput(content)
      .setSandboxMode(HtmlService.SandboxMode.IFRAME)
      .setTitle('Sidebar')
      .setWidth(250);

  SpreadsheetApp.getUi().showSidebar(html);

}

它可以工作，但是每次 updateSidebar() 函数运行时，边栏都会在加载新内容时闪烁。

我如何对此进行编程以更有效地更新侧边栏的内容，从而消除闪烁？

我假设 SpreadsheetApp.getUi().showSidebar(html); 实际上应该只在开始时运行一次，随后对内容的更新应该由 Javascript 在一个 .js 文件。

但我不知道如何从在用户浏览器中运行客户端的 Javascript 代码中获取 sidebarContent 变量。

此外，我知道这一定是可能的，因为我刚刚看到 this post on the Google Apps Developer Blog今天介绍一个使用自定义侧边栏的应用程序，文章末尾的 .gif 显示了一个实时更新的精美动画侧边栏。

Answer 1

我相信这种情况的解决方案是从客户端实际处理服务器端脚本流。这是我现在能想到的唯一方法，无需重新生成 HTML 即可将数据从服务器传递到客户端。
我的意思是您希望从客户端调用服务器端函数，并让它们将响应作为成功处理程序返回给客户端。这意味着需要记录的每个操作都需要成为它自己的功能。我会用一个简单的例子来说明我的意思。假设您的服务器端 GAS 代码如下所示:

function actionOne(){
...insert code here...
return true;
}
function actionTwo(){
...insert code here... 
return true;
}

依此类推，需要执行的操作数不胜数。

现在，对于您的 .html 文件，在底部您将看到如下所示的 javascript:

<script>
callActionOne();
function callActionOne(){
  google.script.run.withSuccessHandler(callActionTwo).actionOne();
}
function callActionTwo(){
...update html as necessary to indicate that the first action has completed...
google.script.run.withSuccessHandler(actionsComplete).actionTwo();
}
function actionsComplete(){
..update html to indicate script is complete...
}
</script>

它比理想情况要复杂一些，您可能需要使用 CacheService 在操作之间存储一些数据，但它应该可以帮助您解决问题。如果您有任何问题或这不符合您的需求，请告诉我。