为何所有4xx及以上HTTP状态码会触发XMLHttpRequest的onerror？

问题原因 #

在Musescore 4基于Qt的QML环境中，XMLHttpRequest的实现会将部分4xx（客户端错误）、5xx（服务端错误）状态码归类为“网络错误”，触发onerror事件，而非仅通过onreadystatechange处理。但即使触发onerror，多数情况下仍能从XHR对象中获取到具体的状态码和状态文本。

解决方案 #

将错误处理逻辑统一，在onerror中也尝试读取状态信息，避免只显示通用错误提示。同时把重复的错误处理代码抽成独立函数，提升代码复用性。

修改后的代码示例：

function postDto(dto) {
    const xhr = new XMLHttpRequest();
    xhr.open("POST", api_url + "/scores/json");
    xhr.setRequestHeader("Content-Type", "application/json");

    // 统一处理错误信息的函数
    function handleError() {
        // 优先获取具体状态码，否则显示通用错误
        if (xhr.status) {
            postresponse = "Error: " + xhr.status + " - " + xhr.statusText;
        } else {
            postresponse = "An error occurred.";
        }
    }

    xhr.onreadystatechange = () => {
        if (xhr.readyState === XMLHttpRequest.DONE) {
            if (xhr.status === 200) {
                postresponse = "Commit successful! View score " + "<a href='" + app_url + "/score/" + scoreName + "'>here</a>";
            } else {
                handleError();
            }
        }
    };

    xhr.onerror = handleError;

    xhr.send(JSON.stringify(dto));
}

补充说明 #

• 该方案利用了Qt QML中XHR对象在onerror触发时仍可能保留状态信息的特性，确保能捕获具体的错误状态码。
• 若遇到极少数无法获取状态码的情况，会 fallback 到通用错误提示，保证用户能得到反馈。

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