The PDF file is NOT Created - Wrong filePath

[Bilal-Abdeen]

Recently, RNHTMLtoPDF.convert() stopped doing anything! No error is provided, and the file is not created. However, I noticed that the filePath, which it uses does NOT actually exist (to the best of my knowledge.) This occurs on Android. I have not, yet, tried it on iOS.

build.grade:

buildToolsVersion = "30.0.2" 
minSdkVersion = 21      
compileSdkVersion = 30  
targetSdkVersion = 30       
ndkVersion = "21.4.7075529" 

googlePlayServicesAuthVersion = "19.2.0" 
kotlinVersion = "1.6.0" 

My code:

if (Platform.OS === "android") {
    directoryPath = "Download"; 
}
else {
    directoryPath = "Documents"; 
}

const _createPDF = async () => {
    try {
        let file = await RNHTMLtoPDF.convert({
            html: htmlContents,
            fileName: "myFileName",
            directory: directoryPath, 
        });
        console.log("PDF - file.filePath:", file.filePath, ); // results in the following path: 
        // /storage/emulated/0/Android/data/<myAppName>/files/Download/myFileName.pdf"
        // it should be: /storage/emulated/0/Download/myFileName.pdf
    } 
    catch (err) {
        console.log("PDF - inside _createPDF - catch - err:", err, ); 
    }
};
try {
    await _createPDF(); 
    console.log("PDF - after calling _createPDF successfully"); // <<<<<<<<< The code reaches this point with no errors
} 
catch (err) {
    console.log("PDF - after calling _createPDF - catch - err:", err, ); 
}

Versions:

"react-native": "0.66.4",
"react-native-html-to-pdf": "^0.12.0",

[Prat1143]

Facing the same problem. Path is showing - /storage/emulated/0/Android/data/com.reactnative/files/Documents/test.pdf But no file is being generated.

[Allstern]

If you guys still have an issue concerning the file path and the pdf not getting created in the appropriate folder. I have found a work around.

Go directly to the source code in your node module react-native-html-pdf -> android -> com -> christopherdro -> htmltopdf -> RNHTMLtoPDFModule.java In the convert() function change this code block

File path = (Environment.MEDIA_MOUNTED.equals(state)) ?
          new File(mReactContext.getExternalFilesDir(null), options.getString(DIRECTORY)) :
          new File(mReactContext.getFilesDir(), options.getString(DIRECTORY));

with

File path = new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_DOCUMENTS), options.getString(DIRECTORY));

And that should change the file path to the appropriate location inside your emulator/device.

[raineriojr98]

@Allstern "react-native-html-pdf -> android ..." not exists. only "index.d.ts, license, package.json and readme". am I looking in the wrong folder?

[Allstern]

@Allstern "react-native-html-pdf -> android ..." not exists. only "index.d.ts, license, package.json and readme". am I looking in the wrong folder?

In your node module folder go to the package folder. Ex: NodeModule -> react-native-html-pdf -> android ...

[raineriojr98]

@Allstern It worked, Thank you!!!

[Antonin-Keuck]

Did you find a solution or another library to convert html to pdf ? (Using react native) The above answer didn't work for me on android device

[ravis-farooq]

If you guys still have an issue concerning the file path and the pdf not getting created in the appropriate folder. I have found a work around.

Go directly to the source code in your node module react-native-html-pdf -> android -> com -> christopherdro -> htmltopdf -> RNHTMLtoPDFModule.java In the convert() function change this code block

File path = (Environment.MEDIA_MOUNTED.equals(state)) ?
          new File(mReactContext.getExternalFilesDir(null), options.getString(DIRECTORY)) :
          new File(mReactContext.getFilesDir(), options.getString(DIRECTORY));

with

File path = new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_DOCUMENTS), options.getString(DIRECTORY));

And that should change the file path to the appropriate location inside your emulator/device.

Thanks alot it worked for me for others i would recommend you to use patch-package https://yarnpkg.com/package/patch-package so that your changes may retain and have a quick fix.

[mansilaad]

I am unable find file on ios -

file path - "/var/mobile/Containers/Data/Application/..some id.../Documents/file.pdf"

Can someone help here....

[mansilaad]

If you guys still have an issue concerning the file path and the pdf not getting created in the appropriate folder. I have found a work around.

Go directly to the source code in your node module react-native-html-pdf -> android -> com -> christopherdro -> htmltopdf -> RNHTMLtoPDFModule.java In the convert() function change this code block

File path = (Environment.MEDIA_MOUNTED.equals(state)) ?
          new File(mReactContext.getExternalFilesDir(null), options.getString(DIRECTORY)) :
          new File(mReactContext.getFilesDir(), options.getString(DIRECTORY));

with

File path = new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_DOCUMENTS), options.getString(DIRECTORY));

And that should change the file path to the appropriate location inside your emulator/device.

Can we customize the location of file ??

[Cyberfolks]

Yes you can. as i did changed with new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_DOWNLOADS), options.getString(DIRECTORY)); for more details you can check https://developer.android.com/reference/android/os/Environment

[BraveEvidence]

This will help https://www.youtube.com/watch?v=4CBUXv8d0I0

[Jaybee4real]

Yes you can. as i did changed with new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_DOWNLOADS), options.getString(DIRECTORY)); for more details you can check https://developer.android.com/reference/android/os/Environment

This crashes the application when a 'directory' key is passed after changing to this, I am on a Samsung device running on android 12

[ghost]

My app crashed when build apk with error: "fd cannot be null"

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[aneebiqbal]

If you guys still have an issue concerning the file path and the pdf not getting created in the appropriate folder. I have found a work around.

Go directly to the source code in your node module react-native-html-pdf -> android -> com -> christopherdro -> htmltopdf -> RNHTMLtoPDFModule.java In the convert() function change this code block

File path = (Environment.MEDIA_MOUNTED.equals(state)) ?
          new File(mReactContext.getExternalFilesDir(null), options.getString(DIRECTORY)) :
          new File(mReactContext.getFilesDir(), options.getString(DIRECTORY));

with

File path = new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_DOCUMENTS), options.getString(DIRECTORY));

And that should change the file path to the appropriate location inside your emulator/device.

it worked thanks.