如何在 React Redux-Saga 中为 yield 调用设置超时答案

【问题标题】：How to set timeout for yield call in React Redux-Saga如何在 React Redux-Saga 中为 yield 调用设置超时
【发布时间】：2019-03-08 10:26:27
【问题描述】：

在我的 rest API 后端中，我进行繁重的处理，通常需要 1.5 分钟才能产生结果，那时我的前端 react 应用程序中出现此错误。

Error: timeout of 60000ms exceeded

因此，对等连接丢失。

如何在 redux-saga 中设置请求超时

【问题讨论】：

发生这种情况的原因有很多，而且您还没有详细说明您的应用程序是如何设置的。您是否检查过您的网络服务器/代理的超时限制？ react 进行的前端 ajax 调用是否有超时限制？

标签： reactjs react-redux redux-saga

【解决方案1】：

我被race 用于此类事情。可能对你有用。

  const {posts, timeout} = yield race({
    posts: call(fetchApi, '/posts'),
    timeout: delay(60 * 1000)
  });
  if (timeout) throw new Error('timeout of 60000ms exceeded')

【讨论】：

【解决方案2】：

import { eventChannel, END } from 'redux-saga'

function countdown(secs) {
  return eventChannel(emitter => {
      const iv = setInterval(() => {
        secs -= 1
        if (secs > 0) {
          emitter(secs)
        } else {
          // this causes the channel to close
          emitter(END)
        }
      }, 1000);
      // The subscriber must return an unsubscribe function
      return () => {
        clearInterval(iv)
      }
    }
  )
}

希望这会有所帮助。

【讨论】：

【解决方案3】：

export function* create(action) {
  try {
    const { payload } = action;
    const response = yield call(api.addPost, payload);
    if (response.status === 200) {
      console.log('pass 200 check');
      yield put(appActions.setResourceResponse(response.data));
      console.log(response.data);
      payload.push('/add-news');
    }
  } catch (error) {
    console.log(error);
    yield put(
      a.setResponse({
        message: error.response.data,
        status: error.response.status,
      }),
    );
  }
}

【讨论】：

从 django rest API 调用 API 时发生超时