Save file inside Documents/Downloads react-native

Question

Is it possible to save files with react-native inside Documents or Downloads? I am trying to save a pdf file with react-native-fs:

let file = await RNHTMLtoPDF.convert(options)
const destinationPath = RNFS.DocumentDirectoryPath + "/" + fileName + ".pdf"
RNFS.copyFile(file.filePath, destinationPath)

but it is saved in the root directory (/data/user/0/com.prodhealth.mobile.Dev/files/TestTest_2022-02-22_2022-02-22.pdf) which is not accessible for normal users.

Is there a way to save it directly in Documents/Downloads of internal storage of the phone? I need that user can easily access this file.

score 2 · Answer 1 · answered Feb 23 '22 at 09:38

2

you can use react-native-fetch-blob

cp(src:string, dest:string):Promise

dirs This constant is a hash map containing commonly used folders:

DocumentDir
MainBundleDir (Can be used to access files embedded on iOS apps only)
DownloadDir (Android Only)

Example

RNFetchBlob.fs.cp(SRC_PATH, DEST_PATH)
.then(() => { ... })
.catch(() => { ... })

answered Feb 23 '22 at 09:38

hong developer

13,291
4
38
68

1

It is still writing to root dir when i use DocumentDir: "/data/user/0/com.packagename.mobile.Dev/files" – user2994290 Feb 23 '22 at 19:18
1

@user2994290 You can use the download path for Android and the bundle path for iOS. – hong developer Feb 24 '22 at 05:54
for the android download path working, but for the iOS bundle path does not work, I still can not see the file on the device. Any advice? – user2994290 Mar 04 '22 at 04:31

hari r · Answer 2 · 2022-11-23T15:03:38.417

Yes, You can. It's working for me.

        let file = await RNHTMLtoPDF.convert(options);
        const destinationPath = RNFS.DownloadDirectoryPath;
        const FileName = 'filename.pdf';

        const destinationFile = destinationPath + "/" + FileName;
        
        RNFS.copyFile(file.filePath, destinationFile)
            .then(result => {
                
                // Delete a file on the project path using RNFS.unlink
                return RNFS.unlink(file.filePath)
                    .then(() => {
                        console.log('FILE DELETED');
                    })
                    // `unlink` will throw an error, if the item to unlink does not exist
                    .catch((err) => {
                        console.log(err.message);
                    });
            })
            .catch(err => {
                console.log('err', err);
            });

Save file inside Documents/Downloads react-native

2 Answers2