How to save file on new android

Capacitor
1

Hi all,

I want to save a image locally, maybe in Documents or Gallery. But How can I do that?

Here is my code:

  const canvas = await html2canvas(
    document.querySelector("#beautifulImage") as any
  )

 const res = await Filesystem.writeFile({
    path: `myImage.png`,
    data: canvas.toDataURL(),
    directory: Directory.Documents,
  })

However, it comes error and say: directory is not created!!!

Finally, I found this works: addandroid:requestLegacyExternalStorage="true" in the application tag in the AndroidManifest.xml, however, the document said, it won’t work on android 11 or newer???

How can I do it correctly?

2

I’m having the same issue. After Android 9 the file security policies have changed. I have not been able to save photos to the gallery as Ionic PWA so far. Would love to hear how others do it. We’ve tried the demo/documentation that Ionic as examples but they do not work. Tested on Android 11 phones so far

3

We are updating the filesystem plugin to work with Android 12+, but in the meantime adding android:requestLegacyExternalStorage="true" to your AndroidManfest.xml should work for most devices.

2 Likes
4

Hi Thomas, What about for the web? I don’t intend to push this to Android or iOS stores at all and only use web.

5

PWA does have support for writing files to a sandboxed environment; only available by your PWA.

There is a proposal to support a non-sandboxed API for filesystem access but it’s only semi-supported on newer Android devices and not on iOS. File System Access API | Can I use... Support tables for HTML5, CSS3, etc

So, short answer, no. Until there is a unified web API to write to the phones filesystem; you’ll need to use a native target to save to the filesystem

1 Like
6

Thanks! That support does not look bad to be honest, I guess you would have to go through vanilla JS to achieve this