CODEWITHSUNDEEP
react-nativereact-native-fetch-blob
Jacki
Jacki

Reputation: 672

RNFetchBlob download file for ios and change its filename

I use library react-native-blob-util for downloading file and saving it in the memory of the phone. It works fine on both, android and ios. However I also wish to give the file particular filename and here I have problem as for android it still works good but for ios I have file "ReactNativeBlobUtilTmp_****". How to change it to have normal filename?

export const downloadFile = async (url: string, fileName: string, description: string) => {
  const { config, android, ios, fs } = RNFetchBlob
  const mimeType = 'application/pdf'
  const downloadDir = Platform.OS === 'ios' ? fs.dirs.DocumentDir : fs.dirs.DownloadDir
  const date = new Date()
  const options = {
    fileCache: true,
    addAndroidDownloads: {
      //Related to the Android only
      useDownloadManager: true,
      mediaScannable: true,
      notification: true,
      path: `${downloadDir}/${fileName}_${Math.floor(date.getTime() + date.getSeconds() / 2)}.pdf`,
      description,
      mimeType
    },
    ios: {
      //Related to the IOS only
      path: `${downloadDir}/${fileName}_${Math.floor(date.getTime() + date.getSeconds() / 2)}`,
      description,
      mimeType
    },
    appendExt: 'pdf'
  }

  await config(options)
    .fetch('GET', url)
    .then((res) => {
      // to open file after download
      if (Platform.OS === 'ios') {
        ios.openDocument(res.data)
      } else {
        android.actionViewIntent(res.path(), mimeType)
      }
    })
}

enter image description here

EDIT: I found out that it might be because on ios I need to save file somewhere and this weird name is taken from some tmp place it is stored. Nonetheless it also doesn't work, I modified if ios condition to code below, where path is variable with the path I used above. If I set encoding as base64 it doesn't want to save at all, with utf8 it does save (or at least doesn't throw error) however file is empty:

fs.writeFile(path, res.data, 'utf8')
.then(() => ios.openDocument(path))

Upvotes: 0

Views: 2696

Answers (1)

Jules FOURNIER
Jules FOURNIER

Reputation: 1

I had the same problem. As of right now on react-native-blob-util version 0.19.11:

There is no such thing as the ios field you use here, the config object must match the ReactNativeBlobUtilConfig type pattern.

To give your file the right name on iOS and be done with the "ReactNativeBlobUtilTmp_****", you simply need to also add the path field outside of addAndroidDownloads

also, don't forget to add the file extension if it isn't already there.

example:

const downloadPath =
    Platform.OS === 'ios'
        ? `${ReactNativeBlobUtil.fs.dirs.DocumentDir}/${documentTitle}`
        : `${ReactNativeBlobUtil.fs.dirs.DownloadDir}/${documentTitle}`;

return ReactNativeBlobUtil.config({
    fileCache: true,
    addAndroidDownloads: {
        title: 'title',
        description: 'description',
        mime: 'application/pdf',
        useDownloadManager: true,
        mediaScannable: true,
        notification: true,
        path: `${downloadPath}.pdf`,
    },
    path: `${downloadPath}.pdf`,
})

Upvotes: 0

Related Questions