javascript - 如何获取 XMLHttpRequest Promise 进度

Question

我正在使用 JS Promise 来重构我们的 JS API。然而我遇到了一个问题，阻止我进一步前进。

基本上，我们的 API 之一是发出异步 GET 请求并下载大文件。

所以API的用法是这样的:

var callback = {
  success: function(data){...},
  failure: function(data){...}
}    

Test(token).download(url).then(callback.success, callback.failure);

Test 函数向 URL 发出 XHR 请求，并调用 onload 和 onerror 事件处理程序中的回调函数。

问题是在下载过程中，UI需要刷新，即进度条，这是在onprogress中处理的。

callback.success 只会在 Promise 解决时调用一次。那么我应该如何实现 UI 刷新回调，该回调应该在 Test 函数内部 XHR 组件的 onprogress 事件处理程序中调用？

Answer 1

Promise 根本就不是多个进度通知的良好架构匹配。 Promise 是一种单向状态机，旨在传达完成或错误 - 这实际上就是它们的设计目的。它们没有任何内置机制来执行多个进度通知。

相反，对于进度通知，您应该使用其他一些架构机制，例如每次调用的常规回调或触发多个进度事件的 eventEmitter。

在您目前展示的方案中，它可能如下所示:

var callback = {
  success: function(data){...},
  failure: function(data){...},
  progress: function(data){...}
}    

Test(token).download(url, callback.progress).then(callback.success, callback.failure);

然后，在您的 download() 函数中，您可以根据需要多次调用进度回调。

---

就我个人而言，我认为如果您只是返回 Promise 并让他们自己提供解析和拒绝处理程序，而不是隐藏 Promise 并让您的调用者接受 2013 年回调架构，这对您的调用者会更有用。返回 Promise 允许他们使用所有 Promise 功能，例如链接、与其他 Promise 的聚合、自己代码中的错误传播等...

因此，与其传递具有多个回调的回调对象，不如传递进度回调，然后返回一个 promise 。然后，调用者可以在返回的 Promise 上附加自己的解析和拒绝处理程序。现在是 2016 年，Promise 在 ES6 中实现了标准化。没有必要向调用者隐藏它们，并且有充分的理由返回 Promise，以便调用者也可以利用 Promise 的好处。