用 fetch 发送 head 请求检测资源是否存在，需设置 method: 'head' 和 redirect: 'manual'，通过 status 判断 200/301/302/404 等状态，并注意跨域 cors 限制及服务端对 head 方法的支持。
用 fetch 发送 HEAD 请求检测资源是否存在，关键是设置 method: 'HEAD'，并配合 redirect: 'manual' 和检查响应状态码（如 200、301、302 等）来判断资源是否可访问。
设置 method 为 'HEAD' 并禁用自动重定向
默认情况下，fetch 遇到 3xx 响应会自动跟随重定向，导致你收不到原始的 301/302 状态码，也看不到响应头信息。要准确检测目标 URL 是否存在或是否被重定向，需显式关闭自动跳转：
-
method: 'HEAD'—— 告诉服务器只返回响应头，不传响应体，更轻量 -
redirect: 'manual'—— 阻止自动跳转，使响应保留原始状态码和Location头
检查响应状态码和 headers
HEAD 请求成功后，服务端通常返回 200（存在）、301/302（重定向）、404（不存在）等状态码。你可以据此判断资源状态：
Alibabacloud Sdk Client Initialization For Java
下载
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
-
response.ok === true表示状态码在 200–299 范围内（常见于 200、204） -
response.status === 301 || response.status === 302表示资源存在但已重定向，可读取response.headers.get('Location')获取跳转地址 -
response.status === 404或网络错误（如 CORS 拒绝、跨域无权限）则说明不可访问
注意跨域限制和 CORS 预检
如果请求跨域，且目标服务未正确配置 CORS 响应头（如 Access-Control-Allow-Origin），即使服务器返回了 200，浏览器也会抛出 TypeError（“CORS policy blocked”）。此时你无法读取 status 或 headers。
- 确保服务端允许 HEAD 方法，并返回必要的 CORS 头
- 某些 CDN 或静态托管（如 GitHub Pages、Vercel）对 HEAD 请求支持有限，可能直接返回 405 或静默拒绝
- 若无法控制服务端，可改用服务端代理中转，或退而使用
img.src/link.href的加载事件做简单存在性试探（仅适用于图片/CSS 等资源）
一个简洁可用的检测函数示例
（含基础错误处理与超时控制）
async function checkResourceExists(url, timeout = 5000) {
const controller = new AbortController();
const id = setTimeout(() => controller.abort(), timeout);
try {
const res = await fetch(url, {
method: 'HEAD',
redirect: 'manual',
signal: controller.signal
});
clearTimeout(id);
return {
exists: res.ok || [301, 302, 307, 308].includes(res.status),
status: res.status,
redirected: res.redirected,
location: res.redirected ? res.headers.get('Location') : null
};
} catch (err) {
clearTimeout(id);
return { exists: false, error: err.message };
}
}
// 使用示例
checkResourceExists('https://example.com/logo.png')
.then(console.log);
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
