Google Sheets App Script Web应用部署问题：提交后页面空白

核心问题分析 #

页面空白的直接原因是数值计算异常引发的JavaScript错误，结合代码细节，主要问题如下：

• 单位严重不匹配：代码中tankSize定义为200加仑（≈757098毫升），但表单提示用户输入毫升数。正常输入毫升时计算结果会偏离预期；若误输入加仑数值，会导致volume远大于tankSize，计算出负数结果，后续toFixed(2)操作触发异常。
• 未处理无效输入：当用户输入非数字内容或空值时，parseFloat会返回NaN，传入计算函数后得到的结果也是NaN，执行toFixed(2)时直接报错，导致页面无法渲染。
• HTML转义冗余（次要）：代码中使用&&、"等转义字符，虽不影响功能，但降低了代码可读性。

修复后的完整代码 #

var high_max_temp = 22; // 摄氏度
var mid_max_temp = 28; // 摄氏度
var tankSize = 200; // 加仑（需和表单输入单位统一）
var maxFiesta = 30; // 升
var midStrengthMultiplier = 0.75; // 75%浓度
var lowStrengthMultiplier = 0.3; // 30%浓度

function doGet(e) {
  var result = '';
  var tempInput = e.parameter.temperature;
  var volInput = e.parameter.volume;
  
  // 仅处理有效数字输入
  if (tempInput && volInput && !isNaN(parseFloat(tempInput)) && !isNaN(parseFloat(volInput))) {
    var temperature = parseFloat(tempInput);
    var volume = parseFloat(volInput);
    
    // 毫升转加仑（1加仑≈3785.41毫升），若表单改输加仑可删除此转换
    volume = volume / 3785.41;
    
    Logger.log('Temperature: ' + temperature + ', Volume: ' + volume);
    var fiestaValue = fiestaDilutionCalculator(volume, temperature);
    Logger.log('Fiesta Value: ' + fiestaValue);
    
    // 避免负数结果
    fiestaValue = Math.max(fiestaValue, 0);
    result = '<h1>计算结果</h1><p>需添加Fiesta剂量: ' + fiestaValue.toFixed(2) + ' 升</p>';
  } else {
    // 简化HTML字符串，添加输入提示
    result = '<h1>除草剂混配计算器</h1>' +
             '<form method="GET">' +
             '  气温(°C): <input type="text" name="temperature" placeholder="请输入数字"><br>' +
             '  罐内当前容积(mL): <input type="text" name="volume" placeholder="请输入数字"><br>' +
             '  <input type="submit" value="计算">' +
             '</form>';
  }
  return HtmlService.createHtmlOutput(result);
}

function fiestaDilutionCalculator(volume,temp) {
  var strength = 1;
  if (temp <= high_max_temp){
    strength = 1;
  } else if(temp > high_max_temp && temp <= mid_max_temp){
    strength = midStrengthMultiplier;
  } else if(temp > mid_max_temp){
    strength = lowStrengthMultiplier;
  }
  
  // 限制容积不超过罐体总容量，避免负数
  volume = Math.min(volume, tankSize);
  var fiestaValue = ((tankSize - volume)/tankSize)*(maxFiesta*strength);
  
  Logger.log(fiestaValue);
  return fiestaValue;
}

关键修复点说明 #

1. 单位统一：添加毫升转加仑的转换逻辑，或直接修改表单提示为「罐内当前容积(加仑)」移除转换代码，确保计算单位一致。
2. 输入校验：新增!isNaN判断，仅处理有效数字输入，避免无效值引发计算错误。
3. 异常值拦截：用Math.max和Math.min限制结果范围，避免负数或超出合理范围的数值。
4. 可读性优化：简化HTML字符串写法，添加输入框提示文字，提升用户体验。

部署配置检查 #

除代码修复外，确认以下部署配置：

• 部署类型选择「Web应用」
• 执行权限设为「任何人，甚至匿名」（若员工无需登录即可使用）
• 选择「新版本」部署，确保修改后的代码生效

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