在 HTML 页面中显示 Google 表格数据答案

【问题标题】：Display Google Sheet Data in HTML Page在 HTML 页面中显示 Google 表格数据
【发布时间】：2017-10-30 06:59:41
【问题描述】：

我有一个 Google 表格，其中包含单元格 A1 和 A2 中的值。在此工作表中还创建了一个 index.html 文件。我想在 html 文件中显示来自 Google 表格的信息。这是我所拥有的：

代码.gs：

function myFunction() {
  var html = HtmlService.createHtmlOutputFromFile('index').setSandboxMode(HtmlService.SandboxMode.IFRAME);
  SpreadsheetApp.getUi().showModalDialog(html, 'Display Sheet Data');
}

index.html:

<!DOCTYPE html>
<html>

<head>
  <script type="text/javascript">
    function setPageValues () {

      var ss = SpreadsheetApp.getActiveSpreadsheet();
      var myFirstValue  = ss.getRange(1, 1).getValue();
      var mySecondValue = ss.getRange(2, 1).getValue();
      document.getElementById("first").innerHTML = myFirstValue;
      document.getElementById("second").innerHTML = mySecondValue;

      }
  </script>
</head>

<body onload="setPageValues()">
  <br>data from cell A:1 = <span id="first"></span>
  <br>data from cell A:2 = <span id="second"></span>
</body>

</html>

当我从 Google Sheet 脚本编辑器运行 myFunction 时，包含 index.html 页面的窗口正确显示。工作表值没有。

我觉得问一些看起来应该如此基本但......“每个人都是菜鸟”的东西很愚蠢！提前致谢！

【问题讨论】：

标签： google-apps-script google-sheets

【解决方案1】：

下面的修改脚本怎么样？要使用 Google Apps 脚本检索和发送数据，您可以使用 google.script.run。

代码.gs：

function myFunction() {
  var html = HtmlService.createHtmlOutputFromFile('index').setSandboxMode(HtmlService.SandboxMode.IFRAME);
  SpreadsheetApp.getUi().showModalDialog(html, 'Display Sheet Data');
}

function getValuesFromSS(range) {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  return ss.getRange(range).getValues();
}

index.html：

<!DOCTYPE html>
<html>

<head>
  <script type="text/javascript">
    function setPageValues () {
      google.script.run.withSuccessHandler(disp).getValuesFromSS("A1:A2");
    }

    function disp(values){
      document.getElementById("first").innerHTML = values[0][0];
      document.getElementById("second").innerHTML = values[1][0];
    }
  </script>
</head>

<body onload="setPageValues()">
  <br>data from cell A:1 = <span id="first"></span>
  <br>data from cell A:2 = <span id="second"></span>
</body>

</html>

如果我误解了你的问题，我很抱歉。

【讨论】：