React Native - 是否可以使用 rn-fetch-blob 下载多个资产？答案

【问题标题】：React Native - Is it possible to download multiple assets using rn-fetch-blob?React Native - 是否可以使用 rn-fetch-blob 下载多个资产？
【发布时间】：2020-05-04 00:51:51
【问题描述】：

有没有办法使用 rn-fetch-blob 下载一组对象（.mp4、.jpg 等）？现在这段代码正在抓取一个 .mp4 url，但是如果我有一个 .mp4 数组和一些 .jpg 混合呢？我该怎么做？

说我有数据：

const data = [
  {media: url.jpg}, 
  {media: url.mp4}, 
  {media: url.mp4}, 
  {media: url.jpg}
]

如何设置我的 fetch 以便它循环数据，并且我可以在 CameraRoll 之后做一些事情？

RNFetchBlob.config({
  fileCache: true,
  appendExt: 'mp4',
}).fetch(
    'GET',
    'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',
  )
  .then(res => {
    CameraRoll.saveToCameraRoll(res.path())
      .then(async () => {
        // works
      })
      .catch(err => console.log('err:', err));
  });

提前感谢您的帮助！

编辑：我还没有测试过这个，但是看看我写的，这会是一个问题吗？

for ( let foo of data ) {

  // write out some code to see if the url has .mp4 or .jpg extension?

  RNFetchBlob.config({
    fileCache: true,
    appendExt: 'mp4', // variable of the correct extension
  }).fetch(
      'GET',
      foo.media, // from the data object?
    )
    .then(res => {
      CameraRoll.saveToCameraRoll(res.path())
        .then(async () => {
          // works
        })
        .catch(err => console.log('err:', err));
    });
}

或者有更简单的方法吗？

【问题讨论】：

底层impl为FIFO，请求执行in sequence。所以你的代码很好，除非底层 impl 发生变化，否则我想不出更好的方法。
@SDEZero 你好！对不起，你能解释一下我是 5 岁吗？呵呵对不起。仍然围绕着这一切。谢谢！
也许我误解了你的问题。你是在问你的循环是否可以并行化，还是你在问你的代码是否可以工作（你不关心并行化）？
@SDEZero 你好 - 我在问如果给定一组数据对象，我所拥有的是否是下载多个媒体文件的最佳实践或最干净的方法。

标签： reactjs react-native react-native-android camera-roll rn-fetch-blob

【解决方案1】：

您可以执行以下代码：

const data = [
  {media: url.jpg}, 
  {media: url.mp4}, 
  {media: url.mp4}, 
  {media: url.jpg}
]

data.map((item) => {

    const extention = item.media.split(".").pop(); // <-- get item extention

    RNFetchBlob.config({
        fileCache: true,
        appendExt: extention,  // <-- extention
    }).fetch(
        'GET',
        item.media, // <-- item url
    )
    .then(res => {
      CameraRoll.saveToCameraRoll(res.path())
      .then(async () => {
        // works
      })
      .catch(err => console.log('err:', err));
    });

})

【讨论】：

这对我有用。你认为这是最干净/高效的方式吗？