Google Apps Script问题：Web应用无法展示表格数据

1. 检查Google Apps Script Web App部署配置 #

• 确认部署时执行权限设置：如果前端是公开访问，必须设为「任何人，甚至匿名」；若设为仅限自己或组织内用户，匿名请求会被拦截，前端收到null。
• 务必使用最新部署URL：修改代码后需重新部署并创建新版本，旧URL对应已停用的部署，会导致请求失败。

2. 前端调用逻辑校验（针对Google Apps Script场景） #

• 必须使用google.script.run的回调机制，避免直接用fetch处理跨域/身份问题：

  // 前端正确调用示例
  google.script.run
    .withSuccessHandler(displayData)
    .withFailureHandler(logError)
    .getDietRecords(); // 替换为你的后端函数名
  
  function displayData(data) {
    console.log('接收的数据:', data);
    // 在这里实现数据渲染逻辑
  }
  
  function logError(error) {
    console.error('请求失败:', error.message);
  }
  

• 检查前端代码是否有语法错误：打开浏览器控制台（F12）的「Errors」标签，排查未捕获的脚本错误。

3. 后端函数返回值处理 #

• 确保返回可序列化的纯数据结构：Google Apps Script的Range、Sheet等对象无法直接序列化，必须转换为数组/普通对象。比如从表格取数据时用getValues()：

  // 后端正确返回示例
  function getDietRecords() {
    const ss = SpreadsheetApp.openById('你的表格ID');
    const sheet = ss.getSheetByName('饮食记录');
    const rawData = sheet.getDataRange().getValues();
    console.log('后端返回数据:', rawData); // 日志正常说明数据获取没问题
    // 可选：转换为更易处理的对象数组
    const formattedData = rawData.slice(1).map(row => ({
      date: row[0],
      meal: row[1],
      calories: row[2]
    }));
    return formattedData; // 必须返回纯数组/对象，不能返回GAS内置对象
  }
  

• 排查函数内的异常处理：如果try-catch块吞了错误，导致函数返回undefined，前端会收到null。确保所有异常都被捕获并抛出，或者在catch块里返回明确的错误标记。

4. 网络请求排查 #

• 打开浏览器「Network」标签，查看请求详情：
  • 状态码401/403：权限问题，回到部署配置检查。
  • 状态码200但响应体为空：后端返回了不可序列化数据或undefined。
  • 请求未发起：前端调用逻辑有问题，比如函数名拼写错误。

5. 缓存与版本问题 #

• 用浏览器隐私模式测试，避免缓存旧的响应内容。
• 每次修改后端代码后，必须重新部署并选择「新版本」，确保前端请求的是最新代码。

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