前端并发多个请求并失败重发

 const MAX_RETRIES = 3;

// 模拟请求
function makeRequest(url) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      Math.random() < 0.75 ? resolve(`${url} 成功`) : reject(`${url} 失败`); // 随机决定请求是否成功
    }, Math.random() * 2000); // 随机延时执行
  });
}

const requestStateMachine = {
  idle: {
    MAKE_REQUEST: 'pending',
  },
  pending: {
    SUCCESS: 'resolved',
    FAILURE: 'retrying',
  },
  retrying: {
    SUCCESS: 'resolved',
    FAILURE: 'failed',
  },
  resolved: {},
  failed: {},
};

function reducer(state, action) {
  const nextState = requestStateMachine[state.currentState][action.type];

  if (!nextState) {
    return state;
  }

  return {
    currentState: nextState,
    retries: action.type === 'FAILURE' ? state.retries + 1 : 0,
  };
}

async function processRequest(url, dispatch) {
  if (state.retries < MAX_RETRIES) {
    try {
      const response = await makeRequest(url);
      dispatch({ type: 'SUCCESS' }); // 请求成功

      return response;
    } catch (err) {
      dispatch({ type: 'FAILURE' }); // 请求失败
      return processRequest(url, dispatch); // 自动重试
    }
  } else {
    dispatch({ type: 'FAILURE' }); // 过多的失败
    throw new Error('Request failed after maximum retries');
  }
}

const urls = ['urlA', 'urlB', 'urlC'];
const successes = [];
const failures = [];

Promise.allSettled(
  urls.map(async (url) => {
    let state = {
      currentState: 'idle',
      retries: 0,
    };

    const dispatch = (action) => {
      state = reducer(state, action);
    };

    try {
      const response = await processRequest(url, dispatch);
      successes.push(response);
    } catch (err) {
      failures.push(err.message);
    }
  })
).then(() => {
  console.log("成功列表：", successes);
  console.log("失败列表：", failures);
});

MAX_RETRIES常量设置每个请求允许的最大重试次数。

makeRequest函数模拟一个请求，返回一个Promise，在随机延迟后以随机概率解析或拒绝。

requestStateMachine对象定义了请求处理过程的可能状态和转换。

reducer函数接受当前状态和一个动作作为参数，并根据动作和状态机定义返回下一个状态。

processRequest函数是一个异步函数，它接受一个URL和一个dispatch函数作为参数。它通过调用makeRequest来处理请求，并根据请求的成功或失败派发动作。如果请求失败且重试次数小于最大重试次数（MAX_RETRIES），则会递归调用processRequest进行自动重试。

urls数组包含要进行请求的URL列表。

successes数组用于存储成功的响应结果。

failures数组用于存储失败的请求的错误信息。

使用Promise.allSettled和map方法对每个URL进行请求处理，并将结果存储在相应的数组中。

最后，通过then方法在所有请求处理完成后打印成功列表和失败列表。

这段代码的作用是并行地处理多个异步请求，并在请求失败时自动进行重试，直到达到最大重试次数。成功的响应结果存储在successes数组中，失败的请求的错误信息存储在failures数组中。