深入理解 fetch API：为何 HEAD 与 GET 请求可能返回不同响应码

// 默认使用GET方法
fetch(url);

// 明确指定使用GET方法
fetch(url, { method: "GET" });

async function checkUrlBehavior(url) {
    console.log(`--- 检查URL: ${url} ---`);

    try {
        // 1. 使用HEAD方法检查URL是否存在和获取元数据
        console.log("发起 HEAD 请求...");
        const headResponse = await fetch(url, { method: "HEAD" });
        console.log(`HEAD 请求响应状态: ${headResponse.status}`);

        if (headResponse.status === 200) {
            console.log("HEAD 请求成功：URL存在。");
            // 打印一些响应头信息
            console.log("Content-Type (HEAD):", headResponse.headers.get("Content-Type"));
            console.log("Content-Length (HEAD):", headResponse.headers.get("Content-Length"));
        } else {
            console.log(`HEAD 请求失败：URL可能不存在或处理异常。状态码: ${headResponse.status}`);
        }

        // 2. 使用GET方法（默认）检查URL并尝试获取内容
        console.log("\n发起 GET 请求 (默认方法)...");
        const getResponse = await fetch(url); // 默认 method: "GET"
        console.log(`GET 请求响应状态: ${getResponse.status}`);

        if (getResponse.status === 200) {
            console.log("GET 请求成功：URL存在且内容可访问。");
            // 尝试读取部分内容
            const contentType = getResponse.headers.get("Content-Type");
            if (contentType && contentType.includes("application/json")) {
                const data = await getResponse.json();
                console.log("GET 请求内容 (JSON):", data);
            } else {
                const textData = await getResponse.text();
                console.log("GET 请求内容片段:", textData.substring(0, 200) + "..."); // 打印部分内容
            }
        } else {
            console.log(`GET 请求失败：URL可能不存在或内容不可访问。状态码: ${getResponse.status}`);
            // 如果GET返回错误，可能需要检查响应体以获取更多错误信息
            try {
                const errorText = await getResponse.text();
                console.log("GET 请求错误详情:", errorText);
            } catch (e) {
                console.log("无法解析 GET 请求错误详情。");
            }
        }

    } catch (error) {
        console.error(`请求 ${url} 时发生网络错误或CORS问题:`, error);
    }
    console.log(`--- 检查结束 ---`);
}

// 示例用法：
// 假设 'https://jsonplaceholder.typicode.com/posts/1' 是一个有效的GET资源
// 而 'https://example.com/non-existent-resource' 是一个不存在的资源
// 你可能需要替换成你实际测试的URL，特别是可能出现HEAD 200但GET 404的URL
checkUrlBehavior("https://jsonplaceholder.typicode.com/posts/1"); // 正常GET和HEAD都应该200
// checkUrlBehavior("https://example.com/some-resource-only-head-works"); // 假设的场景
// checkUrlBehavior("https://example.com/non-existent-resource"); // GET和HEAD都应该404