Postman与fetch请求Giphy API返回结果不一致，如何获取搜索数据？

核心原因 #

fetch 函数返回的 Response 对象是对 HTTP 响应的基础封装，仅包含响应状态、响应头等元信息，不包含直接可用的业务数据，你需要调用对应方法完成响应体的解析才能拿到最终结果。

修正后的代码示例 #

const getGifs = async () => {
  try {
    const url = 'https://api.giphy.com/v1/gifs/search?api_key=mykey&q=ps5&limit=5';
    const resp = await fetch(url);
    // 校验HTTP请求是否成功，过滤4xx、5xx类错误
    if (!resp.ok) {
      throw new Error(`请求异常，状态码：${resp.status}`);
    }
    // 解析响应体为JSON格式，得到和Postman中一致的搜索结果
    const searchResult = await resp.json();
    console.log(searchResult);
    return searchResult;
  } catch (error) {
    console.error('接口调用失败：', error);
  }
}

关键说明 #

• 你之前的代码混用了async/await和then链式调用，统一用async/await逻辑更清晰
• 针对不同的响应格式可以用不同的解析方法：JSON接口用.json()，纯文本内容用.text()，二进制文件用.blob()，所有解析方法都是异步的，需要加await等待执行完成
• 增加错误捕获逻辑可以覆盖网络异常、密钥错误、参数错误等异常场景，方便排查问题

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