承诺：跳过所有完成和拒绝反应，但执行 .finally

Question

我有一个名为request的函数：

function request (endpoint) {
  return axios.request(endpoint).then(api.onSuccess).catch(api.onError)
}

api.onSuccess:

  onSuccess (response) {
    let breakChain = false
    ... some logic goes here ...
    return breakChain ? (new Promise(() => {})) : response
  }

api.onError:

  onError (error) {
    let breakChain = false
    ... some logic goes here ...
    if (breakChain) {
      return new Promise(() => {})
    } else {
      throw error
    }
  }

api 包含许多函数，这些函数代表基于提供的端点数据的不同 API 调用并返回 request(endpoint)。

目前我有代码，如您所见，它返回带有空执行程序的 Promise，该执行程序始终处于挂起状态，以阻止后续 .then(...) 和 .catch(...) 处理程序链的执行，因为它们只是无限地等待该 Promise解决。这样做是为了处理某些具有通用响应处理的 API 响应（例如代码 >= 500 的响应）。 问题是现在我需要调用.finally()（就像在 Vue 食谱中 - https://vuejs.org/v2/cookbook/using-axios-to-consume-apis.html#Dealing-with-Errors）来恢复某些组件的状态，不管是否有错误，但是这种挂起 Promise 的方法是一个障碍。

问题是：是否可以跳过此类处理程序之一中的所有后续.then(...) 和.catch(...) 调用以直接转到.finally()？

更新。我没有提到重要的一点 - api.onSuccess 和 api.onError 是 basic 处理程序。在另一个应用程序组件中，附加处理程序附加到request 函数中呈现的基本链的末尾。一些 API 调用的通常链具有以下结果形式：

return axios.request(endpoint).then(api.onSuccess).catch(api.onError).then((response) => {...}).catch(() => {...}).finally(() => {...})

（有时没有.finally() 或.catch(...) 块）

Answer 1

是否可以在此类处理程序之一中跳过所有后续 .then(...) 和 .catch(...) 调用以直接转到 .finally()？

No.

目前我只是通过无限等待来停止链条 - 但是这种待处理的 Promise 方法是一个障碍。

确实，不要那样做。您可以通过using rejections (exceptions) for flow control 跳过then 处理程序，但更合适的方法是通过嵌套要跳过的链部分inside an if statement 来处理此问题。

这样做是为了处理某些具有通用响应处理的 API 响应（例如代码 >= 500 的响应）

为此，您应该使用类似的东西

return axios.request(endpoint).then(response => {
    …
}).catch(error => {
    if (api.handleCommonError(error)) return; // returns false if it couldn't handle the error
    …
}).finally(() => {
    …
});

是的，您不能在 api.request 函数中隐藏这种错误处理。

Answer 2

您可以使用async 和await。所有现代浏览器都支持它们，并且您的捆绑器可以使它们与旧浏览器兼容。

例如：

async function request (endpoint) {
  try {
    const response = await axios.request(endpoint);
    return api.onSuccess(response);
  } catch (err) {
    api.onError(err);
  } finally {
    // Always executed, even if no error was thrown
  }
}

你也可以更传统地这样做：

function request (endpoint) {
  return axios.request(endpoint).then(api.onSuccess, api.onError).then(() => {
    // Code is always executed after error / success
  }
}