谷歌应用脚本正在改变我的数组成字符串.为什么

Google Apps Script is changing my Array into a string. Why?

本文关键字:数组 字符串 为什么 我的 改变 应用 脚本 谷歌      更新时间:2023-09-26

对我的代码有一个相当简单的调用。保存在工作表中的某些数据的Gs文件。我从html文件调用这个函数来填充下拉列表。所以:

Code.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页面时,它不再是数组的数组,而是一个逗号分隔值的单个字符串。

有人能解释一下这里发生了什么,以及如何修复?谢谢你。

这是一个修复
在客户端,你需要写:

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

在服务器上:

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

当使用HTML Service: Templated HTML时,您编写的代码不会直接执行,服务器计算模板并返回一个HtmlOutput对象,脚本可以为用户提供该对象。

打印脚本允许执行代码并使用上下文转义将新内容附加到HtmlOutput,以避免意外地允许跨站点脚本(XSS)错误,因此结果是一个安全的字符串,没有可能导致意外代码执行的标记。

您可以:

  • 使用JSON.stringify()方法将数组转换为JSON字符串,然后使用Harold提到的JSON.parse()方法将字符串解析为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>
  • 在模板中创建并填充select (NOT遵循最佳实践)。

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>