Google Apps 脚本正在将我的数组更改为字符串。为什么？

Question

我对我的 code.gs 文件进行了相当简单的调用，以获取工作表中的一些数据。我从一个 html 文件调用这个函数来填充一个下拉列表。所以：

代码.gs

function getTheStuffINeed() {

  // Get data from sheet
  var ss =  SpreadsheetApp.openById("ss_id");
  var sheet = ss.getSheetByName("sheetname");
  var myStuff = sheet.getRange(2, 1, sheet.getLastRow()-1, 3).getValues();

  Logger.log(Array.isArray(myStuff));  // true. 
  Logger.log(myStuff); // [[id1, aVal, aSecondVal], [id2, AnotherVal, anotherSecondVal]] 

  return myStuff ; // An array of arrays
}

index.html

<script>
  // get data
  var myStuff= <?= getTheStuffINeed() ?>;  

  console.log(Array.isArray(myStuff)); // false
  console.log(myStuff); // id1, aVal, aSecondVal, id2, AnotherVal, anotherSecondVal, etc
</script>

当我的结果到达 html 页面时，它不再是一个数组数组，而是一个逗号分隔值的字符串。

谁能解释一下这里发生了什么，以及如何解决？谢谢。

Answer 1

这是一个修复
在客户端上你需要写：

var myStuff= JSON.parse(<?= getTheStuffINeed() ?>); 

在服务器上：

  return JSON.stringify(myStuff) ; // An array of arrays

Answer 2

当使用HTML Service: Templated HTML 时，您编写的代码不会直接执行，服务器会评估模板并返回一个HtmlOutput object，脚本可以将其提供给用户。

Printing scriptlets 执行代码并使用 上下文转义 将新内容附加到 HtmlOutput 以避免意外允许 cross site scripting (XSS) bug，因此结果是一个安全的字符串，没有可能导致意外代码执行的标记.

您可以：

• 使用 JSON.stringify() 方法将数组转换为 JSON 字符串，然后使用 Harold 提到的 JSON.parse() method 将字符串解析为 JSON。

• 异步填充选择：

index.html

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
// The code in this function runs when the page is loaded.
$(function() {
  google.script.run.withSuccessHandler(populateStuff)
      .getTheStuffINeed();
});

function populateStuff(stuff) {
  var options = '';
  for (var i = 0; i < stuff.length; i++){
    options += '<option id="'+stuff[i][0]+'" value="'+ stuff[i][1] + '">' + stuff[i][2] + '</option>';
  }
  $('#select').append(options);
}
</script>

• 在模板中创建和填充选择（NOT 在best practices 之后）。

index.html

<select>
  <?
  var myStuff= getTheStuffINeed(); 
    for (var i = 0; i < myStuff.length; i++) { ?>
      <option id="<?= myStuff[i][0] ?>" value="<?= myStuff[i][1] ?>"><?= myStuff[i][2] ?></option>
  <? } ?>
</select>