Apps Script服务端返回值写入前端控件显示undefined问题

google.script.run 是Apps Script前端与服务端通信的异步API，调用后不会同步阻塞等待服务端返回结果，因此直接用变量接收调用返回值永远会得到undefined。另外你的服务端ajoutLigne函数中还存在ui变量未定义的隐藏bug，直接运行会抛出异常。

你需要通过withSuccessHandler()绑定结果回调函数，服务端执行完成后会自动把返回值传入回调，再执行DOM更新操作即可。

1. 修正服务端Code.gs代码 #

补全ajoutLigne中缺失的UI实例定义，其余逻辑可保持不变：

function include(filename){
  return HtmlService.createHtmlOutputFromFile(filename).getContent();
}

function ajoutLigne() {
  const classeur = SpreadsheetApp.getActiveSpreadsheet();
  const feuille = classeur.getActiveSheet();
  // 补全缺失的ui实例定义
  const ui = SpreadsheetApp.getUi();
  const widget = HtmlService.createTemplateFromFile("widget.html").evaluate();
  widget.setWidth(600);
  widget.setHeight(600);
  // 先设置宽高再弹出对话框，避免尺寸配置不生效
  ui.showModalDialog(widget, "Ajout d'une nouvelle ligne");
}

function getLibelle(codeArticle){
  const classeur = SpreadsheetApp.getActiveSpreadsheet();
  const feuille = classeur.getSheetByName("BASE ARTICLE");
  const lastRow = feuille.getLastRow();
  const tDonnees = feuille.getRange("B2:C"+lastRow).getValues();
  const nbDonnees = tDonnees.filter(String).length;
  let result = "";
  for (let i = 0; i < nbDonnees; i ++){
    if(tDonnees[i][0] == codeArticle){
      result =  tDonnees[i][1];
      // 找到匹配项直接跳出循环，减少无效遍历
      break;
    }
  }
  return result;
}

2. 修正前端JavaScript.html代码 #

替换原有同步赋值的写法，用成功回调接收服务端返回结果：

<script>
function rechercheLibelle(){
  const codeArticle = document.getElementById("codeArticle").value.trim();
  // 输入非空校验
  if(!codeArticle) {
    document.getElementById("libelle").textContent = "请输入商品编码";
    return;
  }
  google.script.run
    // 绑定成功回调，服务端返回结果后自动执行
    .withSuccessHandler(function(libelleResult){
      console.log(libelleResult);
      // 将返回结果渲染到页面
      document.getElementById("libelle").textContent = libelleResult || "未找到对应编码的商品";
    })
    // 可选：绑定失败回调，处理服务端报错场景
    .withFailureHandler(function(err){
      console.error("查询出错：", err);
      document.getElementById("libelle").textContent = "查询失败，请重试";
    })
    .getLibelle(codeArticle);
}
</script>

widget.html无需修改，保持原有代码即可正常运行。

如果商品基础数据量较大，建议优化getLibelle函数的查询逻辑，无需全量拉取表格数据后循环遍历，可以直接用Range的createTextFinder方法在工作表中直接匹配编码，执行效率会有明显提升。

内容的提问来源于stack exchange，提问作者devMethodes