相对URL重定向路径异常：为何跳转结果不符合预期？

首先，你遇到的问题核心是相对URL的解析基准被改变，导致跳转路径不符合预期。

为什么会跳转到/a/b/otherpage？ #

正常逻辑下，如果当前页面URL是https://example.com/a/b/c/d/e/page?query=string，浏览器解析相对路径"otherpage"时，会先去掉路径的最后一段（page），得到当前文件所在的目录路径/a/b/c/d/e/，再拼接成/a/b/c/d/e/otherpage，这和你的预期一致。

但实际跳转路径是/a/b/otherpage，大概率是你的页面中设置了<base>标签，比如：

<base href="/a/b/">

这个标签会强制所有相对URL都以它指定的路径作为解析基准，完全忽略当前页面的实际路径。所以当你执行window.location.href = "otherpage"时，浏览器会基于/a/b/拼接，最终得到/a/b/otherpage。

怎么实现预期跳转？ #

有两种可靠方式：

• 使用绝对路径：直接写完整目标路径，不受基准URL影响：

  window.location.href = "/a/b/c/d/e/otherpage";
  

• 基于当前页面路径构造：如果不想写死绝对路径，可以动态获取当前目录再拼接：

  // 获取当前页面的目录路径（去掉最后一段资源名）
  const currentDir = window.location.pathname.substring(0, window.location.pathname.lastIndexOf('/') + 1);
  window.location.href = currentDir + "otherpage";
  

另外，如果你不需要<base>标签的作用，直接移除它，相对URL就会按照页面实际路径正常解析了。

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