完成 promise 數組中的每個 promise 后返回數據 - 打字稿/Javascript

Question

我正在將文件上傳到 Azure，我當前的實現是將響應返回給我的父 function。

這是我的代碼：

export const uploadMultipleFilesToAzure = (
  uploadData: UploadMultipleToAzure[],
  handleProgress: (
    loadedBytes: number,
    fileData: UploadMultipleToAzure['fileData']
  ) => void
) => {
  const PIPELINE = newPipeline(new AnonymousCredential(), {
    retryOptions: { maxTries: 4 }, // Retry options
    keepAliveOptions: {
      // Keep alive is enabled by default, disable keep alive by setting false
      enable: false,
    },
  });

  let blockBlobClient: BlockBlobClient;
  const promises: Promise<BlobUploadCommonResponse>[] = [];
  forEach(uploadData, (uploadItem) => {
    blockBlobClient = new BlockBlobClient(uploadItem.BlobURL, PIPELINE);
    promises.push(
      blockBlobClient.uploadData(uploadItem.fileData as Blob, {
        blockSize:
          (uploadItem.fileData as Blob).size > 1024 * 1024 * 32
            ? 1024 * 1024 * 4
            : 1024 * 512,
        maxSingleShotSize: 1024 * 512,
        concurrency: 20, // 20 concurrency,
        onProgress: (ev: TransferProgressEvent) =>
          handleProgress(
            ev.loadedBytes / (uploadItem.fileData as Blob).size,
            uploadItem.fileData
          ),
      })
    );
  });
  return Promise.all(promises);
};

這是我的父 function，它位於異步 function 內：

const data = await uploadMultipleFilesToAzure(result, handleProgress);

數據的價值只有在所有的承諾都得到解決后才可用，但是我需要在一個 promise 完成時獲取數據。

目標是每次解析 promise 時使用文件名調用端點。

請指教。

任何幫助表示贊賞。

Answer 1

使用 promise 競賽，您將獲得第一個 promise 解決或拒絕：
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/race

但如果你需要所有的承諾，我認為這只是一個循環：

  });
  return promises.map(pro => pro.then(callback1));
};

您可以綁定外部上下文，聲明接收 promise 數據的 function，然后使用額外的 FILE_DATA 調用您的回調：看：

});
  return promises.map(pro => pro.then((dataPromise) => callback1(dataPromise, FILE_DATA)));
};

在看到用戶要點之后。

我認為你沒有處理pro承諾！
改變這個：

  return promises.map((pro) => {
    const file = (uploadData.find(
      (uploadItem) => pro[(uploadItem.fileData as FileWithPath).name]
    ) as UploadMultipleToAzure).fileData;
    return pro[(file as FileWithPath).name].then((dataPromise) =>
      callback(dataPromise, file)
    );
  });

對此：

  return promises.map((promise) => promise.then((pro) => {
    const file = (uploadData.find(
      (uploadItem) => pro[(uploadItem.fileData as FileWithPath).name]
    ) as UploadMultipleToAzure).fileData;
    return pro[(file as FileWithPath).name].then((dataPromise) =>
      callback(dataPromise, file)
    );
  }));