Search code examples
androidangularionic-frameworkcapacitorionic5

Why is capacitor saving everything to IndexedDB instead on sdcard on Android?

I am using Angular 9 together with ionic5 and I am trying to save a file on my Android 9 device. Unfortunately, every time I try to write file by using Capacitor, the file is saved to the IndexedDB and not on disc/sdcard. Is there some way to tell ionic that I want to save to sdcard and/or fix my code?

Code for saving files

const fileName = decodeURIComponent(attachment.Name);

const savedFile = await Filesystem.writeFile({
    path: fileName,  // filename.png
    data: attachment.Content,  // base64 encoded png file
    directory: FilesystemDirectory.ExternalStorage,
});
console.log(savedFile.uri);

Permissions

The app should have permissions to write to the SD card, as this is defined inside AndroidManifest.xml:

<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

Expected result

According to the documentation, this should save the file to the root of the sdcard.

Actual result

When executing this, the returned URI is /EXTERNAL_STORAGE/filename.png, but the file is not present on the sdcard, because it was saved inside IndexedDB, as seen on the screenshot from Chrome Inspector attached to the application running on my Android:

Screenshot of content of the IndexedDB

Solution

  • After I wrote this question, stackoverflow was able to find a similar one, that was not resolved, but anwsered my question.

    The solution is to make sure, that you use Plugins and not import:

    Correct

    const { Filesystem } = Plugins;

    Incorrect

    import { Filesystem } from '@capacitor/core';