React Native download file using RNFetchBlob's Download Manager on Android 10

user_10426052 0
Viewed 7535

I need to download file to user's Download directory in React Native app using rn-fetch-blob, but seems like it is not compatible with Android 10, because I am getting error:

enter image description here

First I ask for permissions:

try {
            const granted = await PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE);
            if (granted === PermissionsAndroid.RESULTS.GRANTED) {
                await actualDownloadPDF();
            } else {
                ToastAndroid.show('Nepovolili jste ukládání souborů do zařízení.', ToastAndroid.LONG);
            }
        } catch (err) {
            console.warn(err);
        }

then I try to download file:

const res = await RNFetchBlob.config({
                addAndroidDownloads: {
                    useDownloadManager: true,
                    notification: true,
                    mime: 'application/pdf',
                    title: filename,
                    path: dirs.DownloadDir,
                },
            }).fetch('GET', url, {
                Authorization: 'Bearer ' + Api.Bearer,
            });

It seems like Android 10 requires from developer to open Intent where user select write permission to folder ( https://developer.android.com/training/data-storage/shared/documents-files#grant-access-directory), but I am not sure how to do it, because it seems like RNFetchBlob does not have this feature, yet.

Any ideas how to make this work? It was working fine on Android 9.

rn-fetch-blob android-10.0 react-native android
4 Answers
const fileName = 'document.pdf'; 
const destPath = RNFetchBlob.fs.dirs.DownloadDir + '/' + fileName;

const config = {
  fileCache : true, 
  path: destPath, 
  addAndroidDownloads: { 
    title: destPath, 
    description: `Download ${destPath}`,
    useDownloadManager: false, 
    notification: false,
  }
}; 

const res = await RNFetchBlob.config(config)...

I'm using this code and it works on Android 10.

user_16911530

I think that your if clause is wrong. My working example look like this:

import { PermissionsAndroid } from "react-native";

export const CheckFilePermissions = async (platform) => {
  if(platform === 'android') {
    try {
      const granted = await PermissionsAndroid.requestMultiple([
        PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
        PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
      ]);
      if (granted['android.permission.READ_EXTERNAL_STORAGE'] && granted['android.permission.WRITE_EXTERNAL_STORAGE']) {
        // user granted permissions
        return true;
      } else {
        // user didn't grant permission... handle with toastr, popup, something...
        return false;
      }
    } catch (err) {
      // unexpected error
      return false;
    }
  } else {
    // platform is iOS
    return true;
  }
};

You can use it like:

if(await CheckFilePermissions(Platform.OS)) {
....
your code 
....
user_108165580

Add android:requestLegacyExternalStorage="true" to in your AndroidManifest.xml

<application
  ...
  android:requestLegacyExternalStorage="true"
>
user_102793620

You should give complete path to the 'path' field. Change

path: dirs.DownloadDir

to

path: dirs.DownloadDir`/download.pdf`
user_90899190
Related