导致多站点跳转至404的JavaScript函数及报错原因问询

嘿，这个问题问得挺有意思的！最容易触发绝大多数网站跳转到404页面的JavaScript函数，本质上都是那些能修改当前页面URL并触发浏览器请求的方法，其中最典型的就是直接跳转到一个肯定不存在的路径的函数。

典型示例函数 #

比如下面这个简单的函数，几乎能让任何网站跳转到404页面：

function trigger404() {
  // 拼接当前域名 + 一个完全无意义的随机路径
  const invalidUrl = `${window.location.origin}/totally-fake-page-never-exists-9876`;
  window.location.href = invalidUrl;
}

还有一个类似的、不会在浏览器历史记录留下跳转痕迹的版本：

function trigger404Silently() {
  location.replace('/random-invalid-path-1234');
}

为什么这些函数会导致404错误？ #

我来拆解一下背后的逻辑：

• 核心行为：window.location.href（或location.replace()）的作用是修改当前页面的URL，浏览器会立即向这个新URL发送HTTP请求，试图加载对应的资源。
• 路径无效性：函数里拼接的路径是完全随机、无意义的字符串，几乎不可能被任何网站配置为有效路由或静态文件路径——毕竟没有网站会特意设置/totally-fake-page-never-exists-9876这样的有效页面。
• 服务器响应：当服务器收到对这个不存在路径的请求时，会返回HTTP 404 Not Found状态码，浏览器接收到这个响应后，就会展示对应的404错误页面。

额外补充：非故意触发的情况 #

有时候一些业务代码也会意外触发404，比如动态拼接路径时出错（比如把错误的参数、空值拼进URL），但上面的示例是故意构造的、能100%触发多数网站404的函数。

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