Fetch请求异常时无法获取response.message的问题求助

fetch的特性是只有网络级别的错误（比如断网、域名无法解析）才会触发catch，像4xx、5xx这类HTTP状态码的错误，fetch依然会进入then回调，只是response.ok会变成false。你控制台看到的错误信息，是服务器放在响应体里返回的，而response.message本身并不是fetch Response对象的标准属性，所以会返回undefined。

要拿到服务器返回的错误信息，你需要先解析错误响应的内容，步骤如下：

• 当!response.ok时，调用response.text()或response.json()（根据服务器返回的错误格式选择）来读取响应体；
• 解析后就能拿到控制台里显示的错误信息了。

修改后的代码示例：

await fetch(url)
  .then(async (response) => {
    if (!response.ok) {
      // 根据服务器返回格式选择text或json，比如JSON错误用response.json()
      const errorInfo = await response.text();
      console.log(errorInfo); // 现在就能打印出你要的错误信息了
      $("#errorMessage").text(`Error ${response.status}: ${errorInfo}`);
      $(".reload").show();
      // 可选：抛出错误让上层逻辑处理
      throw new Error(`Request failed: ${errorInfo}`);
    }
    return response.json();
  })
  .catch((networkError) => {
    // 处理网络层面的错误（比如断网）
    console.error(networkError.message);
    $("#errorMessage").text(`Network Error: ${networkError.message}`);
    $(".reload").show();
  });

注意：如果服务器返回的错误是JSON结构（比如{"message": "参数错误"}），就把response.text()换成response.json()，然后通过errorInfo.message获取具体内容。

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