404 not found错误表示服务器无法找到所请求的资源。对于浏览器来说，这意味着该 url 无法识别。
404 请求会让用户感到沮丧，并可能导致网站性能不佳。此外，搜索引擎会抓取不存在的页面并将其编入索引，因此，网站的排名会受到负面影响。总而言之，我们可以通过一些方法来避免搜索无法访问的请求。
1。定期检查链接
这看起来似乎微不足道，但 404 错误的最常见原因是页面已被移动或删除以及 url 键入不正确。因此，您可以使用 google search console 和 screaming frog seo spider 等免费工具来验证损坏的链接和soft 404s（不存在的资源，但仍返回成功状态200).
2。验证网址
在发出请求之前，请验证 url 是否正确。虽然这不能保证所请求的资源不存在，但它可以防止明显的错误。为了验证 url，有 javascript 的 url 接口。在这里您可以验证请求文件的 url 结构、协议、域或扩展名。
您还可以在使用 head 方法发出 get 请求之前检查资源是否存在。
async function fileExists(url) {
try {
const response = await fetch(url, { method: 'HEAD' });
return response.ok;
} catch (error) {
console.error('Error verifying the existence of the file:', error);
return false;
}
}
fileExists('https://example.com/file.jpg').then(exists => {
if (exists) {
console.log('File exists.');
} else {
console.log('File not found.');
}
});
3。评估网站的限制
不要忘记检查 html、css、javascript 文件和其他资源是否具有用户正确的读取和执行权限。另请检查 web 服务器设置中是否存在可能阻止访问某些文件或目录的不当访问限制。
allowoverride 和 require all grant 等设置如果配置不正确，可能会导致问题。
4。清除缓存
缓存存储网站资源的副本，以便当您再次访问同一网站时，浏览器可以更快地加载这些资源。但是，如果网站资源返回 404 错误，则该响应也可以存储在缓存中。因此，即使该资源在服务器上得到纠正，用户仍然可能收到 404 错误。为了解决这个问题，我们可以从http header的配置上下功夫。
您可以设置 cache-control: no-store 来防止存储响应，或者设置 cache-control: no-cache 来强制浏览器在使用缓存版本之前与服务器进行检查。您还可以使用响应过期的时间配置 expires 标头。
5。如果资源缺失，请优雅处理
不要让用户遇到 404 错误，而是设置重定向到出现错误的替代页面并建议其他服务。此外，如果服务已移动或重命名，请设置 301（永久）或 302（临时）重定向到新 url。
结论
404 错误会对用户体验以及应用程序和 seo 的可信度产生负面影响。作为开发人员，通过优雅地处理 404 错误，您可以展现出对质量和可用性的承诺，从而增强客户对您的工作和正在开发的产品的信心。