Google Apps Script网页应用首页无法加载其他视图问题求助

1. 修复首页HTML语法错误 #

你的首页HTML存在两处语法问题，可能导致页面解析异常，干扰链接跳转逻辑：

• Materialize CSS的link标签末尾多了一个多余的>，修正后：

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">

• 第二个按钮所在div的类名拼写错误，calss改为class：

<div class="input-field col s12">
  <a href="<?=ScriptApp.getService().getUrl()?>?page=removeplayer" class="btn waves-effect waves-light">Enlever un Joueur</a>
</div>

2. 替换链接跳转逻辑（备选方案） #

若修复语法后问题仍存在，可能是Materialize的按钮事件拦截了<a>标签的默认跳转，改用JavaScript手动实现跳转：
将首页的链接按钮修改为：

<a href="javascript:void(0)" onclick="navigateTo('addplayer')" class="btn waves-effect waves-light">Ajouter un Joueur</a>
<a href="javascript:void(0)" onclick="navigateTo('removeplayer')" class="btn waves-effect waves-light">Enlever un Joueur</a>
<a href="javascript:void(0)" onclick="navigateTo('createlineup')" class="btn waves-effect waves-light">Créer une Compo</a>

在页面底部添加跳转函数：

<script>
function navigateTo(page) {
  const baseUrl = '<?=ScriptApp.getService().getUrl()?>';
  window.location.href = `${baseUrl}?page=${page}`;
}
</script>

3. 检查Web App部署配置 #

确认部署设置：

• 执行权限设为「任何人，甚至匿名」（若无需登录验证）
• 修改代码后重新部署，选择更新现有版本，确保使用最新代码

4. 优化doGet函数容错性 #

调整code.gs中的doGet函数，增强错误处理并临时放宽iframe限制（测试用）：

function doGet(e) {
  const pageName = e.parameter?.page?.trim().toLowerCase() || "home";
  Logger.log(pageName);
  try {
    const template = HtmlService.createTemplateFromFile(pageName);
    return template.evaluate()
      .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL); // 仅用于测试，问题解决后建议改回SAMEORIGIN
  } catch (error) {
    Logger.log(`页面不存在: ${pageName}`);
    return homePage();
  }
}

function homePage(){
  const template = HtmlService.createTemplateFromFile("home");
  return template.evaluate();
}

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