为何Fetch将404响应视为无错误响应？代码场景解析

这是Fetch API的设计特性：只有当请求在网络层面失败时（比如无法建立连接、DNS解析失败、请求被中断），Fetch返回的Promise才会reject并触发catch块。而像404、500这类HTTP状态码，属于服务器正常返回的响应——请求已经成功发送，服务器也返回了对应的状态和内容，所以Fetch会认为Promise已resolve，进入then流程。

看你的代码，当前逻辑直接将响应转为JSON，但没有检查HTTP状态是否正常。要让404这类HTTP错误触发catch，需要手动在第一个then里验证响应状态：

async getCallsByZoneId() {
    this.loading_calls = true;
    await fetch(urlStore.getCallsByZoneId, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json;charset=utf-8'
            },
            body: JSON.stringify({
                '_csrf-frontend': this._csrf,
                clinic_id: this.clinic_id,
                zone_id: this.selected_zone_id
            })
        })
        .then(r => {
            // 检查响应是否成功（状态码200-299）
            if (!r.ok) {
                throw new Error(`服务器返回错误：${r.status}`);
            }
            return r.json();
        })
        .then((r) => {
            this.callsNotSorted = r.not_sorted;
            this.callsSorted = r.sorted;
        })
        .catch(error => {
            this.setError('Ошибка на сервере', error);
        })
        .finally(() => {
            this.loading_calls = false;
        });
}

这里的r.ok是Fetch提供的便捷属性，等价于r.status >= 200 && r.status < 300。当状态码不在这个范围时，手动抛出错误，就能让后续的catch块捕获到HTTP层面的错误。

内容的提问来源于stack exchange，提问作者Вячеслав Предеин