Google Apps Script搜索页面故障：后端返回结果但前端displayResults函数无法接收

嘿，我来帮你排查这个问题！你遇到的情况是后端能输出数组但前端displayResults拿不到数据，大概率是这几个关键环节出了问题，咱们一步步拆解：

1. 先确认后端search函数是否正确实现（最可能的原因！） #

你只贴了getAllContacts的后端代码，但前端调用的是google.script.run.search(query)——如果这个search函数没写、写错了名字，或者返回逻辑有问题，前端肯定收不到数据。

你需要确保后端存在一个正确返回过滤后数组的search函数，比如参考getAllContacts的结构，加上搜索过滤逻辑：

function search(query) {
  const sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('Bệnh nhân');
  if (!sheet) {
    console.error('找不到指定的工作表！');
    return []; // 避免返回undefined
  }
  
  const data = sheet.getDataRange().getValues();
  const contacts = [];
  
  // 跳过表头行，过滤包含搜索关键词的记录（这里匹配姓名列，即data[i][7]）
  for (let i = 1; i < data.length; i++) {
    const contactName = data[i][7] || '';
    // 不区分大小写的模糊匹配
    if (contactName.toLowerCase().includes(query.toLowerCase())) {
      contacts.push({
        id_benh_nhan: data[i][0] || 'N/A',
        id_gia_dinh: data[i][1] || 'N/A',
        id_che_do_chinh_sach: data[i][2] || 'N/A',
        id_lop_hoc: data[i][3] || 'N/A',
        id_cac_ho_tro_cua_lang: data[i][4] || 'N/A',
        id_benh_an: data[i][5] || 'N/A',
        id_danh_gia: data[i][6] || 'N/A',
        name: contactName || 'N/A',
        ngay_sinh: data[i][8] || 'N/A', // 注意列索引要和你的表格对应
        gioi_tinh: data[i][9] || 'N/A',
        dia_chi_gia_dinh: data[i][10] || 'N/A',
        so_dinh_danh_ca_nhan: data[i][11] || 'N/A',
        doi_tuong_the_he_thu: data[i][12] || 'N/A',
        ho_khau: data[i][13] || 'N/A',
        ngay_tiep_nhan: data[i][14] || 'N/A',
        ngay_hoa_nhap: data[i][15] || 'N/A'
      });
    }
  }
  
  console.log('搜索返回结果:', contacts); // 后端日志确认返回值
  return contacts; // 必须返回数组，不能返回undefined或其他不可序列化对象
}

2. 给前端添加错误处理，排查通信问题 #

目前你的代码只加了成功回调，但没处理失败情况——如果后端函数报错、权限不足或者序列化失败，前端根本不知道问题出在哪。修改handleSearch和loadAllContacts，加上错误回调：

function handleSearch(event) {
  const query = event.target.value;
  google.script.run
    .withSuccessHandler(displayResults)
    .withFailureHandler(error => {
      console.error('搜索请求失败:', error); // 控制台看具体错误信息
      document.getElementById('search-results').innerHTML = '<p>搜索出错，请检查控制台日志</p>';
    })
    .search(query);
}

function loadAllContacts() {
  google.script.run
    .withSuccessHandler(displayResults)
    .withFailureHandler(error => {
      console.error('加载所有联系人失败:', error);
      document.getElementById('search-results').innerHTML = '<p>加载数据出错，请刷新页面重试</p>';
    })
    .getAllContacts();
}

打开浏览器控制台（F12），就能看到具体的错误提示——比如函数不存在、权限不够、数据序列化失败等。

3. 检查数据序列化是否合规 #

Google Apps Script的google.script.run只能传递可序列化的基本数据类型：字符串、数字、布尔值、日期、普通数组/对象。如果后端返回了SpreadsheetApp的Range、Sheet等对象，或者自定义的类实例，通信会直接失败，前端收不到任何数据。

确保你的search和getAllContacts函数只返回普通对象数组，不要包含任何Google服务的对象。

4. 验证前端与后端的函数名拼写一致 #

注意大小写！Google Apps Script的函数名是大小写敏感的，比如前端写.search(query)，后端函数必须是function search() {}，不能写成Search()或者SEARCH()。

快速测试步骤 #

1. 先确认页面加载时loadAllContacts是否能正常显示所有联系人——如果能，说明前端和后端的通信基本没问题，问题就出在search函数上；
2. 如果loadAllContacts也没数据，先检查后端getAllContacts的工作表名称是否正确（'Bệnh nhân'是否和实际表格名完全一致，包括特殊字符）；
3. 查看后端脚本的执行日志（Google Apps Script编辑器→查看→日志），确认search函数被调用时确实返回了非空数组。

备注：内容来源于stack exchange，提问作者Hoang Bach Vu