如果找不到原始重定向的文件，如何回退到辅助 window.location url 重定向

Question

我正在使用 Swiper JS 创建一系列本地托管的拇指画廊作为 html 文件。我有一个索引页面，充当导航到任何特定拇指库的全局位置。我还想添加以下功能：如果您已经位于其中一个拇指画廊 (One.html) 中，则当您到达末尾时，请使用 Swiper JS 中的 OnreachEnd 参数并按顺序跳转到下一个 html。当reachEnd被激活时，我使用javascript来获取活动html文件的文件路径，然后解析文件路径以获取文件名，增加文件名末尾的字符，将字符串连接在一起并使用window.location(newpath) 操作重定向到新的 url。

我可以工作，但我似乎无法弄清楚的问题是如何处理我位于第一个或最后一个 html 文件的情况。当 onreachEnd 参数被触发时，如果找不到新增加的文件路径，我想重定向回 Index.html。

我试图使用这样的函数作为找不到文件时的后备，但该函数没有捕获错误并继续尝试打开失败的网址而不是重定向。

example.com 和fallback.com 被我自己的串联路径替换，我还使用我知道存在的文件名直接进行了测试。在这两种情况下，它都会取消后备重定向。

找不到原始 URL 时如何强制重定向。

function redirectToUrl(originalUrl, fallbackUrl) {
  try {
    // Attempt to redirect to the original URL
    window.location.href = originalUrl;
  } catch (error) {
    // If an error occurs (e.g., URL not found), redirect to the fallback URL
    window.location.href = fallbackUrl;
  }
}

// Example usage:
redirectToUrl("https://example.com", "https://fallback.com");

Answer 1

作为一种变体，您可以向

originalUrl

发出 HEAD 请求并检查响应状态是否正常。像这样：

async function redirectToUrl(originalUrl, fallbackUrl) {
  try {
    const response = await fetch(originalUrl, { method: 'HEAD' });

    if (response.ok) {
      window.location.href = originalUrl;
    } else {
      window.location.href = fallbackUrl;
    }
  } catch (error) {
    window.location.href = fallbackUrl;
  }
}