解决Google Apps Script Web App提交后跳转链接失效及自调用问题

一、动态获取当前有效Web App链接（无需手动更新HTML） #

核心思路是通过服务器端函数自动获取当前部署的有效链接，再传递给前端页面，彻底避免硬编码链接导致的失效问题。

1. 在Code.gs中添加获取当前Web App链接的函数：

function getWebAppUrl() {
  const deploymentId = ScriptApp.getDeploymentId();
  if (!deploymentId) {
    // 本地测试时可返回临时预览链接（按需修改）
    return "https://script.google.com/macros/s/[你的临时预览ID]/dev";
  }
  return `https://script.google.com/macros/s/${deploymentId}/exec`;
}

2. 在Signup.html中动态加载链接：
   页面加载时通过google.script.run调用上述函数，自动替换跳转链接：

<!-- 提交成功后显示的区块 -->
<div id="successBlock" style="display:none;">
  提交成功！<a id="backLink" href="">返回报名系统</a>
</div>

<script>
// 页面初始化时获取并设置有效链接
window.onload = () => {
  google.script.run.withSuccessHandler(url => {
    document.getElementById('backLink').href = url;
  }).getWebAppUrl();
};

// 表单提交成功后切换显示区块
function showSuccessState() {
  document.getElementById('signupForm').style.display = 'none';
  document.getElementById('successBlock').style.display = 'block';
}
</script>

每次部署新的Versioned App时，getDeploymentId()会自动抓取当前生效的部署ID，生成有效链接，无需手动修改HTML。

二、更优的提交后跳转方案（无需用户手动点击） #

如果不需要让用户确认跳转，可以直接在提交成功后自动跳转，流程更顺畅：

1. 修改表单提交回调逻辑，在成功后直接跳转回当前Web App：

// 处理表单提交的函数
function submitForm() {
  const formData = new FormData(document.getElementById('signupForm'));
  google.script.run
    .withSuccessHandler(() => {
      // 直接跳转回当前页面的有效链接
      window.location.href = window.location.origin + window.location.pathname;
    })
    .withFailureHandler(error => {
      alert('提交失败：' + error.message);
    })
    .processForm(formData); // 对应Code.gs中处理表单的函数
}

这里直接复用当前页面的URL，不管怎么部署，当前页面的地址就是有效链接，从根源上避免了链接失效问题。

2. 进阶：跳转到指定功能页面（如报名信息查看页）
   如果需要跳转至Web App内的其他功能页，可以通过URL参数区分页面逻辑：

// Code.gs中处理表单的函数，返回用户标识
function processForm(formData) {
  // 执行报名逻辑...
  return { studentId: formData.get('studentId') };
}

// 前端回调中跳转至查看页
google.script.run
  .withSuccessHandler(data => {
    window.location.href = `${window.location.origin + window.location.pathname}?page=view&id=${data.studentId}`;
  })
  .processForm(formData);

随后在Code.gs的doGet(e)函数中，根据e.parameter.page和e.parameter.id渲染对应的页面内容即可。

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