Capacitor: feat: share file

Created on 31 Mar 2020  路  6Comments  路  Source: ionic-team/capacitor

Feature Request

Describe the Feature Request

The share sheet in iOS and Android allows to share or download files with other apps. The current share plugin in Capacitor seems to only allow sharing text.

I'd like to share a file that is either generated on the fly (think: export a data set as CSV or JSON) or from the app's filesystem.

Platform Support Requested

  • [X] Android
  • [X] iOS
  • [X] Electron
  • [ ] Web

Describe Preferred Solution

await Share.share({
    title: 'Download stats',
    text: JSON.stringify(myStats),
    url: 'stats.json',
    dialogTitle: 'Download Stats'
});

Describe Alternatives

Alternative might be to create a file first in the local filesystem via the Filesystem plugin and then reference this file with the Share plugin.

Most helpful comment

@jcesarmobile Thanks! Could you tell me what the proper url looks like? Do I have to retrieve it via the Filesystem plugin? The docs are incomplete for this aspect.

All 6 comments

Sharing files has always worked on iOS if using the url, but has to be a proper url, not just a file name.
On Android was recently fixed https://github.com/ionic-team/capacitor/pull/2338

@jcesarmobile Thanks! Could you tell me what the proper url looks like? Do I have to retrieve it via the Filesystem plugin? The docs are incomplete for this aspect.

I would also like to know how to share a file! @jcesarmobile maybe an example is available somewhere ?

Thanks.

@eweap Figured it out:

// generate a ZIP via JSZip
const archive = await zip.generateAsync({ type: 'base64', compression: 'DEFLATE' });

try {
    const result = await Filesystem.writeFile({
        path: `Your-Filename.zip`,
        data: archive,
        directory: FilesystemDirectory.Documents
    });
    console.log('Wrote file', result);
    let shareRet = await Share.share({
        title: 'My File',
        url: result.uri,
        dialogTitle: 'Save file'
    });
} catch (e) {
    console.error('Unable to write file', e);
}

@cmaas thanks ! I will try it tomorrow !

@eweap One thing though: On Android 10, writing a file is a bit different and requires a special permission with the current FileSystem plugin. Not sure if this is already marked as an issue in Capacitor. However, this is the fix:

<manifest ... >
  <!-- This attribute is "false" by default on apps targeting
    Android 10 or higher. -->
  <application android:requestLegacyExternalStorage="true" ... >
   ...
 </application>
</manifest>

https://stackoverflow.com/questions/60569224/cant-write-to-android-external-storage-even-with-permissions-set

Was this page helpful?
0 / 5 - 0 ratings