MediaStore to use common downloads directory of android

[anshul0410]

Hi, thanks for maintaining this project. i have more of a query than a bug to report.
i'm using version 0.13.8 of this library and implementing scope storage related updates in my RN app.
Is there a way to download files directly to common download path for android, currently file download is happening in app specific internal storage, which might not be very intuitive for users in general.
Is there a plan to implement MediaStore API to make use of download path, or is there any other solution to do so?
Any help or suggestion is much appreciated.
Thanks.

[RonRadtke]

Hi @anshul0410,
at the moment there is no possibility.
But I am currently working on integrating it in the lib. It's the next feature for the lib and it is already in work :)
But I don't know when it will be done yet

[RonRadtke]

Just wanting to give you a short update.
I have the very basics working now (creating and writing data to media files), but there is still a lot of work to do.
Especially to be able to use fileCache and such things.

[afilp]

@RonRadtke Is there any workaround until the solution is fully implemented? Our app needs invoices to be downloaded in a "common", non-app specific folder, like "Downloads" or "Documents" and we are not sure how we can implement this without your upcoming solution. Thanks!

[RonRadtke]

@afilp in general it is working.
The basics are done. So saving a file to downloads works.

But I had / have plenty of private issues eating up my time the last moths. So I didn't get to do the work on all the nice-to-have and testing like I would want to in order to make a release for it.

What doesn't work yet:

• opening the file after saving it
• storing the file without using fileCache
• all the functionality around storing files like renaming / moving / copy /delete / ....

If you change to the feature/media_collections branch you could save a file by using the following code snippet.
It's just copied from my testing app, so you might have to adjust variable names etc :)

    ReactNativeBlobUtil
            .config({
                fileCache: true
            })
            .fetch('GET', targeturi, {'Accept': 'application/octet-stream'}, JSON.stringify(dat))
            .then(async (res) => {
                let pathnew = await ReactNativeBlobUtil.MediaCollection.createMediafile({name: filename, parentFolder: '', mimeType: get_mimetype_for_file(filename)}, 'Download');
                await ReactNativeBlobUtil.MediaCollection.writeToMediafile(pathnew, res.path());
});

[damian-balas]

@RonRadtke Thanks for your work!

If I only want to download a PDF to the global downloads dir, it is safe to use the branch version? :)
When do you expect the functionality to go live?

[RonRadtke]

@damian-balas
I tested the code in my companies app, works fine for saving a PDF to the download folder. But I'm not yet using it in production since I don't have the need for it yet.
In general all errors should be caught and lead to a promise rejection as usual.
So I think it should be save to use for that. But I would ofc recommend testing that it works as you expect.

I don't know yet. It depends a bit on how much of the additional things I program.
I would say I skip the part about moving / renaming / ... for a first release. Any objections?

[damian-balas]

@RonRadtke Well it would be fine for me if you release a version where we can only download files to that dir. :)

[damian-balas]

@RonRadtke Would you also provide a snippet for iOS? I can't make it work... It gives me success status, but there are no files in the File.app. I need to have it physically on the users phone so he can access it anytime.

[RonRadtke]

@damian-balas iOS does not use the android mediaStore.
For iOS you need

let destPath = ReactNativeBlobUtil.fs.dirs.DocumentDir + '/' + filename;
ReactNativeBlobUtil
            .config({
                fileCache: true
            })
            .fetch('GET', targeturi, {'Accept': 'application/octet-stream'}, JSON.stringify(dat))
            .then(async (res) => {
                await ReactNativeBlobUtil.fs.appendFile(destPath, res.path(), 'uri');
})

So for now you will have to put in a switch based on Platform.OS==='android'.
Downloaddir on iOS doesn't work since there is no download folder like on android.

[afilp]

@RonRadtke Thanks a lot Ron! For me, just being able to download a PDF to the common Downloads or Documents folder would be sufficient.

Do we need to have conditionals before the call or the following code will work? (for both iOS and Android?)

I used to have this code in the main config, so I thought the iOS would be OK because of the path there:
appendExt: 'pdf', fileCache: true, path: destPath,

  let dirs = ReactNativeBlobUtil.fs.dirs;
  const dirToSave = Platform.OS === 'ios' ? dirs.DocumentDir : dirs.DownloadDir;
  console.log('dirToSave', dirToSave);
  const destPath = dirToSave + '/Invoice_' + paymentId + '.pdf';

  // const date = new Date();
  const { data } = await new Promise((resolve, reject) => {
    try {
      ReactNativeBlobUtil.config({
        appendExt: 'pdf',
        fileCache: true,
        path: destPath,
        addAndroidDownloads: {
          path: destPath,
          useDownloadManager: true,
          title: 'Invoice ' + paymentId,
          description: 'Invoice PDF',
          mime: 'application/pdf',
          mediaScannable: true,
          notification: true,
        },
      })
        .fetch('GET', `${window.our.BASE_URL}/payment?paymentId=${paymentId}`, {
          Authorization: `Bearer ${token}`,
          Accept: 'application/pdf',
          'Content-Type': 'application/pdf',
        })
        .progress((received, total) => {
          console.log('progress', received / total);
        })
        .then(async res => {
          console.log('The file saved to ', res.path());
          Alert.alert(t('invoiceDownloaded'));
          if (Platform.OS === 'ios') {
            await ReactNativeBlobUtil.fs.appendFile(
              destPath,
              res.path(),
              'uri',
            );
            ReactNativeBlobUtil.ios.openDocument(res.path());
          } else {
            const android = ReactNativeBlobUtil.android;
            android.actionViewIntent(
              res.path(),
              'application/pdf',
              'Choose app to preview',
            );
          }
          resolve(res);
        })
        // Something went wrong:
        .catch((errorMessage, statusCode) => {
          console.log(errorMessage);
          reject(errorMessage);
        });
    } catch (err) {
      console.log(err);
      reject(err);
    }
  });

Also, I idid not see the progress working, maybe because of the PDF?

[damian-balas]

@damian-balas iOS does not use the android mediaStore. For iOS you need

let destPath = ReactNativeBlobUtil.fs.dirs.DocumentDir + '/' + filename;
ReactNativeBlobUtil
            .config({
                fileCache: true
            })
            .fetch('GET', targeturi, {'Accept': 'application/octet-stream'}, JSON.stringify(dat))
            .then(async (res) => {
                await ReactNativeBlobUtil.fs.appendFile(destPath, res.path(), 'uri');
})

So for now you will have to put in a switch based on Platform.OS==='android'. Downloaddir on iOS doesn't work since there is no download folder like on android.

Thanks for your feedback. I'm aware of this, but my issue is that I can't see the downloaded file in the native File app. It's empty.

this is my code:

export const downloadPdf = async ({ url, filename }) => {
  let response;
  const newFilename = `${filename}-${Date.now()}`;
  if (!url || typeof url !== 'string') {
    throw new Error('Link do pliku PDF jest niepoprawny!');
  }

  try {
    if (Platform.OS === 'ios') {
      response = await downloadForIOS({ filename, url });
    } else {
      response = await downloadForAndroid({ filename, url });
    }

    showSuccessToast({
      text: `${newFilename}.pdf został pobrany pomyślnie!`, // TODO: translate this!
    });
  } catch (error) {
    showErrorToast({
      error: {
        message: `Nie udało się pobrać ${newFilename}.pdf. Spróbuj jeszcze raz.`, // TODO: translate this!
      },
    });
    Logger.error(error);
  } finally {
    if (response?.flush) {
      // response.flush();
    }
  }
};

const downloadForAndroid = async ({ filename, url }) => {
  const result = await request(PERMISSIONS.ANDROID.WRITE_EXTERNAL_STORAGE);

  if (result !== RESULTS.GRANTED) {
    throw new Error(result);
  }

  const response = await ReactNativeBlobUtil.config({
    fileCache: true,
  }).fetch('GET', url);

  const newPath =
    await ReactNativeBlobUtil.MediaCollection.createMediafile(
      {
        name: `${filename}.pdf`,
        parentFolder: '',
        mimeType: 'application/pdf',
      },
      'Download',
    );

  await ReactNativeBlobUtil.MediaCollection.writeToMediafile(
    newPath,
    response.path(),
  );

  return response;
};

const downloadForIOS = async ({ filename, url }) => {
  const path = ReactNativeBlobUtil.fs.dirs.DocumentDir + '/' + filename;
  const response = await ReactNativeBlobUtil.config({
    fileCache: true,
  }).fetch('GET', url);

  await ReactNativeBlobUtil.fs.appendFile(path, response.path(), 'uri');
  return response;
};

[RonRadtke]

The lib currently doesn't support the option to save it to files app.
But you can set
UIFileSharingEnabled
and
LSSupportsOpeningDocumentsInPlace
To yes in yours app plist file. (Just take the link below and search for the first entry, there it is explained that itit should work... can't get a working link tonit on the phone sorry,)
Or see https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/iPhoneOSKeys.html#//apple_ref/doc/uid/TP40009252-SW37