0

I want to download a file in React Native and save it in a Directory selected by the User (e.g. Downloads).

Right now I'm using https://www.npmjs.com/package/react-native-document-picker to let the user pick a directory and https://www.npmjs.com/package/react-native-fs/v/1.2.0 to download the file.

Unfortunately, react-native-document-picker only gives me a dynamic URI to the directory, which does not exist when react-native-fs tries to access it. I think it's hidden behind something like a File-Provider.

I searched a lot but found no solution on how to get the real static path to a directory. Might be that I am missing something obvious, but I can not figure it out right now.

the code (simplified)

DocumentPicker.pickDirectory().then(pick => {

  // this looks something like:
  // file:///private/var/mobile/Containers/Shared/AppGroup/8443...EC/File%20Provider%20Storage/Downloads/
  const pickedDirectory = pick.uri;

  // resolves to false:
  RNFS.exists(pickedDirectory)

  // does not work
  RNFS.downloadFile({
    fromUrl: downloadUrl,
    toFile: pickedDirectory + filename,
  }).promise.then(r => { console.log(r)
});
DeepValue
  • 54
  • 4
  • What else you're getting in `pickedDirectory ` ? There is something more I believe. – Kailash Dec 01 '21 at 18:22
  • pickedDirectory ist just an object with an uri {uri: string} nothing more – DeepValue Dec 01 '21 at 23:00
  • object looks like this on simulator but i tested on device also ```{"uri": "file:///Users/username/Library/Developer/CoreSimulator/Devices/4397173C-E2B4-4E1A-9FAE-980CAD057627/data/Containers/Shared/AppGroup/CA2871AF-D874-4960-AECE-8BE0B9B0861D/File%20Provider%20Storage/Downloads/"}``` – DeepValue Dec 01 '21 at 23:04

1 Answers1

-1

Either we can opt for the solution give on the below link (using react-native-fs).

React native Unable to use local tmp file path for Image.source iOS

or try

Add copyTo:"documentDirectory" in the pick document options. Then in pickedDirectory.fileCopyUri you'll get the document path.

What happens is when we pick any Item from gallery or iOS file system, it picks and place it a temporary directory for some time, then it get auto removed from that directory. Try the above given solution, I believe It will work.

Kailash
  • 777
  • 4
  • 19
  • pickDirectory does not accept this option unfortunately. the only options it accepts is about how the picker-view is presented – DeepValue Dec 01 '21 at 23:01
  • have you tried `pick()` ? I think that can also fulfil your purpuse. I'll try in my local and will share more specific answer. – Kailash Dec 02 '21 at 07:00
  • i tried pick. the problem is, that i want to pick a directory (into which the file gets downloaded) not a file. i tried pik({type: "public.folder"}) but that does not compile. thank you for your help! – DeepValue Dec 02 '21 at 11:55
  • Then try `react-native-fs` you'll get it sorted for sure. – Kailash Dec 02 '21 at 12:56
  • https://stackoverflow.com/questions/50755784/react-native-unable-to-use-local-tmp-file-path-for-image-source-ios Here is the solution for you @DeepValue – Kailash Dec 03 '21 at 06:11