Question

我有一张Google表格，我正在使用我的团队正在处理的项目的数据库。我想要做的是使用这些数据在Google网站上构建不同的屏幕。例如，我已经能够添加一个显示所有活动项目的下拉列表。选择项目后，将返回并显示HTML表。

现在我要添加的是客户HTML的甘特图，其数据来自同一Google表格。我从我能够展示的团队中做了很多推断，并使用the gviz documentation作为图表信息的资源。我的大多数代码都运行良好，但是我将图表数据从表格侧发送到客户端HTML时遇到了问题。

在我的图表构建代码中，我有一个Logger.log语句，表明chartData是Array并且它包含我期望的数据：

function buildChart(project) {
  var detailsSheet = ss.getSheetByName("Details");
  var details = detailsSheet.getRange(2, 1, detailsSheet.getLastRow(), detailsSheet.getLastColumn()).getValues();

  // get the list of teams working on the selected project
  var teams = getTeamsFromProjects(project, details);  // Works, not shown.

  // get the list of teams, without the category
  var sendTeams = new Array();
  for (l in teams) {
    var lRow = teams[l];
    sendTeams.push(lRow[0]);
  }

  // get the projects that the teams are working on
  var projectList = getProjectsFromTeams(sendTeams, details);  // Works, not shown.

  var chartData = getChartDataFromProjects(projectList, details); // Works, not shown.
  Logger.log(chartData);  // this shows that my data is there, in an array

  return chartData;
}

在webapp的HTML中，我有一个console.log("HTML: " + HTML)正确显示返回的HTML（来自.gs函数，displayTeams()，它看起来是正确的。同样在HTML中我有一个{{1应该显示返回的数组。但是，控制台说console.log("chart data: " + chartData)为NULL。

我的问题是，为什么chartData被返回（或者至少写入webapp的控制台日志）为NULL，当我从Apps脚本chartData语句中看到 - 就在返回之前 - 数据是否正确数组？

我的一些相关HTML文件：

Logger.log()

Answer 1

您可能正在发送不兼容的数据类型：根据client-server communication文档，Date的请求将失败。

我google.script.run通信的首选方法是1）通过Date以毫秒为单位发送所有Date().getTime()，因为这也可以避免时区问题和依赖于浏览器的日期字符串解析差异。然后，在客户端中，您可以通过调用Date将输入数据重新映射回new Date(milliseconds_value)对象，即

function successHandler(rectangularArrayData) {
  // Array indices of column values that need to be converted back to Date objects.
  const dateIndices = [0, 3, 8 /**, etc... */];
  // In general, pass your received data into a transformation function. This particular
  // example assumes you only need to remap milliseconds to Date objects.
  const chartData = rectangularArrayData.map(function (row) {
    return row.map(function (col, index) {
      // If this column index should be a date, make it a Date from the milliseconds input.
      // Otherwise, do nothing to it.
      return (dateIndices.indexOf(index) === -1) ? col : new Date(col);
    });
  });
  ...
}

和2）在发送之前将其序列化为JSON字符串。有时你只是发送过于复杂的对象，并在JSON.stringify之前通过（return）将其转换为字符串，这有助于确保它不会在线路上被破坏。在客户端中，您的成功处理程序只需要通过JSON.parse()重新实现它。

您还有其他一些事情（例如不明智和不可移植for...in iteration of Arrays，using new Array() instead of []，或执行多次比较以检查特定变量的多个文本值之一而不是使用可以改进的Array#indexOf方法），但它们超出了您的问题的范围，而不是您的问题的来源。

导出到Apps Script webapp的图表数据为空

1 个答案: