如何处理服务器返回的空JSON响应？附前端调用Node.js后端代码

咱们先搞清楚问题根源：当服务器返回空响应（比如状态码204 No Content，或者只是空字符串）时，调用response.json()会抛出SyntaxError——因为空内容根本不是合法的JSON格式，这会直接触发你的catch(handleError)逻辑，但很多时候空响应其实是业务上的合法情况（比如没找到匹配的地理编码结果），所以咱们需要在processResponse里提前处理这种场景。

下面给你两种可行的修改方案，你可以根据业务需求选：

方案1：先读取文本内容，再判断解析 #

这种方式更可控，能明确区分空响应和无效JSON的情况：

const processResponse = function (response) { 
  if (response.ok) { 
    console.log(response); 
    // 先读取响应文本，而不是直接解析JSON
    return response.text().then(text => {
      // 去除首尾空白后判断是否为空
      const trimmedText = text.trim();
      if (!trimmedText) {
        // 空响应时返回你需要的默认值，比如空对象或空数组
        return {}; // 业务上如果期待数组就返回 []
      }
      // 非空内容尝试解析成JSON
      try {
        return JSON.parse(trimmedText);
      } catch (parseErr) {
        // 解析失败时抛出自定义错误，让handleError处理
        throw new Error(`Invalid JSON response: ${parseErr.message}`);
      }
    });
  } 
  throw response; 
}

方案2：捕获JSON解析错误 #

如果只需要处理空响应导致的解析失败，可以直接在response.json()的catch分支里处理：

const processResponse = function (response) { 
  if (response.ok) { 
    console.log(response); 
    return response.json()
      .catch(parseErr => {
        // 判断是不是空响应导致的语法错误
        if (parseErr instanceof SyntaxError && parseErr.message.includes('Unexpected end of JSON input')) {
          // 返回默认值，避免进入全局catch
          return {};
        }
        // 其他解析错误重新抛出，交给handleError处理
        throw parseErr;
      });
  } 
  throw response; 
}

补充：完善handleError的容错逻辑 #

因为上面的修改可能会抛出普通的Error对象（不是response实例），所以要给handleError加个判断，避免调用不存在的json()方法：

const handleError = function (error) { 
  if (error.json) { 
    error.json().then(errData => {
      console.error('服务器返回错误:', errData);
      // 这里可以加业务错误处理逻辑，比如提示用户
    }).catch(parseErr => {
      console.error('解析错误响应失败:', parseErr);
    });
  } else {
    // 处理普通Error对象
    console.error('请求错误:', error.message);
  }
}

这样不管是服务器返回的错误响应，还是前端解析时的错误，都能被妥善处理啦～

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