Redux Saga在Fetch Promise解析后为何不再继续执行？

嘿，我看你碰到了Redux Saga里yield call(request...)之后代码完全没跑起来的问题——这种情况我之前也踩过坑，大概率是**request函数返回的Promise被rejected了**，但你可能没在catch块里加日志，所以没察觉到异常分支的执行。

咱们一步步来排查和解决：

1. 先补全catch块的日志，确认是否进入异常分支 #

你贴的代码里只写了try块，没展示catch部分。如果request的Promise抛出错误，代码会直接跳去catch块，而你看不到后续代码执行的话，很可能是这里默默吞掉了错误。先给catch块加个日志：

export function* loadData() { 
  console.log("Saga: Loading Data..."); 
  try { 
    const response = yield call(request, requestURL, { 
      method: 'GET', 
      credentials: 'include', 
      headers: { 
        'Content-Type': 'application/json', 
      } 
    }); 
    // 此行之后的代码从未执行过 :( 
    if (response.success) { 
      console.log("SUCCESS!!!!"); 
      // ...你的其他业务逻辑
    }
  } catch (error) {
    // 新增这行，看看是不是错误触发了这里
    console.error("Saga请求失败：", error);
    // 这里可以加错误处理逻辑，比如dispatch失败的action
  }
}

运行后如果看到这个错误日志，那问题根源就找到了——接下来咱们看request函数的问题。

2. 检查request函数的Promise处理逻辑 #

你提到request会返回Promise并执行response.json()，这里很容易踩两个坑：

坑1：原生fetch不会对非2xx状态码reject #

如果你用的是原生fetch API，哪怕接口返回404、500这类错误状态码，Promise依然会resolve，只有断网这类网络错误才会reject。但如果这时候你直接调用response.json()，而接口返回的是错误页面的HTML（而非合法JSON），response.json()会抛出异常，让整个Promise变成rejected。

比如你的request函数可能是这样的：

function request(url, options) {
  return fetch(url, options).then(response => {
    // 没检查状态，直接转JSON，容易出错
    return response.json();
  });
}

解决方法：在request里先校验HTTP状态 #

修改request函数，先判断response.ok（状态码200-299），再处理JSON解析，同时把错误抛出去让Saga捕获：

function request(url, options) {
  return fetch(url, options)
    .then(response => {
      if (!response.ok) {
        // 把非2xx状态转为reject，让Saga的catch能捕获
        throw new Error(`请求失败：${response.status} ${response.statusText}`);
      }
      return response.json();
    })
    .catch(error => {
      // 这里可以统一打日志，但一定要重新抛出错误！
      console.error("Request内部错误：", error);
      throw error; // 不抛出的话，Saga会认为Promise已resolve，继续执行后续代码（但其实数据不对）
    });
}

3. 确认Saga是否被正确注册（可选） #

不过你已经看到了Saga: Loading Data...的日志，说明loadData已经被触发了，这一步可能性不大。但如果前面两步都没解决问题，可以检查一下Saga的注册逻辑，比如有没有用takeLatest/takeEvery正确监听对应的action，或者Saga中间件有没有正确配置到store里。

总结 #

最常见的原因就是request函数的Promise因为HTTP状态错误或JSON解析错误而rejected，导致代码进入catch块但你没察觉。先补全catch日志定位问题，再修复request的错误处理逻辑，应该就能解决啦。

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