Capacitor save image in gallery

Capacitor
1

Hello everyone,

I’m working on a Capacitor application with ReactJS and I’m trying to integrate an image management system. Currently, I can take a photo and save it in the “External” or “Documents” directories, but I want to go further.

My goal is to create a specific folder for my application in the “Pictures” or “DCIM” directories to create an album for the images taken with the app, similar to what other mobile applications like Snapchat or WhatsApp offer.

Additionally, I would like to set up a scheduled task to clear this folder every 70 days.

Is this possible? So far, I haven’t been able to save images in any other locations besides “External” (Android > data > com.test.test) or “Documents.”

Thank you in advance for your help!

2

Are you using ImageOptions.saveToGallery when calling getPhoto? Looking at the Android source, it references DKIM and the Pictures paths.

3

Yes, I’m using that parameter, but the issue is as follows: it saves the photos at the root of the gallery instead of placing them in an album (or folder) with the app’s name, like other applications do.

Moreover, even though the images are saved in the gallery, it’s impossible to access them afterward for deletion. However, our client wants the gallery to be cleaned upon each app startup by removing any images from the application that are older than 70 days.

So, the goal is to:

  1. Save the images in a specific folder (or album) with the app’s name, inside the Pictures or DCIM directories.
  2. Have the ability to access this folder to automatically delete images older than 70 days every time the app starts.

Thanks in advance for your help!

5

Yes, I tried it before and I was able to do that. And in your case, it’s possible to create a specific folder in the “Pictures” or “DCIM” directories and manage it within your Capacitor ReactJS app.

You can use Capacitor’s Filesystem API to write images to those directories by specifying the path as Pictures or DCIM. Here’s an example for saving in the “Pictures” directory:

JS Code

const saveImage = async (photo) => {
  const result = await Filesystem.writeFile({
    path: `Pictures/MyApp/${new Date().getTime()}.jpeg`,
    data: photo.base64String,
    directory: FilesystemDirectory.External,
  });
};

For scheduling a task to clear the folder every 70 days, you can use a background task handler or a third-party plugin like cordova-plugin-background-mode to run a periodic cleanup function.

But make sure to check for the necessary permissions for managing files outside the app’s sandbox.

Thanks :slightly_smiling_face: