I am working on a react-native project in which I need to download some image files from the server and save them inside the App. These must be saved in the internal private storage of the App such that the app user must not be able to find these files (in non-rooted phone). I have searched on google and found the below options:

1. Use AsyncStorage and save the image files in the Base64 string format. (I want to avoid this because this will add overhead [increase file size little bit] + unnecessary task of converting to/from base64)
2. Use rn-fetch-blob library to directly fetch from/to the server in blob format but I unable to find the internal storage saving options. This options helps me to store files on Documents or Download etc but I need to store files in the internal memory.
3. I can use URI as a source for all the images but I want to avoid dependency on the server as much as I can.

Please suggest a simple way to download image[ or other format] file in the react native app which must be inside App's private data folder without any conversion into string or any other medium.

I am working on a react-native project in which I need to download some image files from the server and save them inside the App. These must be saved in the internal private storage of the App such that the app user must not be able to find these files (in non-rooted phone). I have searched on google and found the below options:

1. Use AsyncStorage and save the image files in the Base64 string format. (I want to avoid this because this will add overhead [increase file size little bit] + unnecessary task of converting to/from base64)
2. Use rn-fetch-blob library to directly fetch from/to the server in blob format but I unable to find the internal storage saving options. This options helps me to store files on Documents or Download etc but I need to store files in the internal memory.
3. I can use URI as a source for all the images but I want to avoid dependency on the server as much as I can.

Please suggest a simple way to download image[ or other format] file in the react native app which must be inside App's private data folder without any conversion into string or any other medium.

• javascript
• android
• ios
• react-native

1 Answer 1

You can use Document Directory as path to save your files. It keeps the files inside the storage of application which you want and when you want to retrieve the files, then you already knows the base path and you just need to supply the filename to access the file.

const dirs = RNFetchBlob.fs.dirs; 
RNFetchBlob
  .config({
    path : dirs.DocumentDir + `${folder_name}/${filename}`
}).fetch('GET', `${fileURL}`).progress((received=0, total=0) => {
  //Handle progress of download here.. May be update UI...
}).then((resp) => {
   //You can get the path of the file saved using resp.path()
.catch((err) => {
  //Handle error here...                
});