在 Angular 中从 Azure 下载元素期间的 ZoneAwarePromise 数组

Question

我正在通过终结点从 Azure Blob 存储下载文件。现在我正在等待并在我的代码的以下部分中一个一个地下载。

for (let idx = 0; idx < blobArray.length ; idx++)
{
  downloadedFiles.push(await this.azureBlowService.downloadFile(containerName, blobArray[idx])) 
}
return downloadedFile

服务中的下载方法

async downloadFile(containerName, fileName){
  let parameters = new HttpParams()
    .set("containerName", containerName)
    .set("fileName", fileName);

  let url = environment.baseUrl + "/api/v1/azure_blob/download_file";
  this.asyncResult = await this.http.get(url, {params: parameters, responseType: 'blob'}).toPromise()
  this.asyncResult.name = fileName;
  return this.asyncResult
}

当我在 this.azureBlowService.donwloadFile... 之前删除 await 时，我将得到像这样的 ZoneAwarePromises 数组 [ZoneAwarePromise, ZoneAwarePromise, ZoneAwarePromise] 我的假设是我会删除此 await 对所有 blow 元素执行承诺以允许它们并行下载过程使其更快并等待完成所有承诺而不是一个接一个地完成。现在下载时间真的很长，尤其是当我有超过 100 个元素时。可能吗？有人知道该怎么做吗？提前致谢

Answer 1

我看不出将 promise 转换为 observables 有什么好处。如果它是可观察的，我实际上会更容易并行触发所有请求。

使用 map 运算符将 name 属性附加到响应
使用forkJoin函数并行组合和触发请求

尝试以下方法

downloadFile(containerName, fileName): Observable<any> {
  let parameters = new HttpParams()
    .set("containerName", containerName)
    .set("fileName", fileName);

  let url = environment.baseUrl + "/api/v1/azure_blob/download_file";
  return this.http.get(url, {params: parameters, responseType: 'blob'}).pipe(
    map((res: any) => ({ ...res, name: fileName }))   // <-- append `fileName` to `name` property
  );
}

forkJoin(
  blobArray.map(blob => this.downloadFile(containerName, blob))
).subscribe({
  next: response => {
    // output: array of response from invidual requests
    // statements that depend on `response`
  },
  error: error => {
    // handle error
  }
});

在 Angular 中从 Azure 下载元素期间的 ZoneAwarePromise 数组

Array of ZoneAwarePromise during downloading elements from Azure in Angular

promise

angular-promise

azure-blob-storage

angular