Share files with capacitor share plugin

user_2772623 0
Viewed 1921

I need to share a pdf file. I am using CapacitorJS for native functionality.

let shareRet = await Share.share({
  title: 'See cool stuff',
  text: 'Really awesome thing you need to see right meow',
  url: 'http://ionicframework.com/',
  dialogTitle: 'Share with buddies'
});

this is from the example. But I have my data as a base64 string. Is there a way to share this as an attachment?

Thanks!

capacitor
2 Answers

This code works for me on iOS and Android:

import { Directory, Filesystem } from '@capacitor/filesystem';
import { Share } from '@capacitor/share';

function share(fileName: string, base64Data: string) {
  return Filesystem.writeFile({
    path: fileName,
    data: base64Data,
    directory: Directory.Cache
  })
    .then(() => {
      return Filesystem.getUri({
        directory: Directory.Cache,
        path: fileName
      });
    })
    .then((uriResult) => {
      return Share.share({
        title: fileName,
        text: fileName,
        url: uriResult.uri,
      });
    });
}
user_50644530

This code will share images, try to edit it using jspdf for create and share pdf

import domtoimage from 'dom-to-image';
import { Share } from '@capacitor/share';
import { Filesystem, Directory, Encoding } from '@capacitor/filesystem';
import { Capacitor } from '@capacitor/core';
import { Camera, CameraResultType } from '@capacitor/camera';


  async shareImage() {
    let receiptName = 'Receipt N:' + this.invoice?.invoiceNumber + '.png';
    const div = this.screenshotElement.nativeElement;
    const divHeight = div.clientHeight;
    const divWidth = div.clientWidth;
    const options = { background: '#ffffff', width: divWidth, height: divHeight };

    await Filesystem.requestPermissions();

    let base64Data = await domtoimage.toPng(div, options);

    // browser download 
    this.downloadImgElement.nativeElement.src = base64Data;
    this.downloadLinkElement.nativeElement.href = base64Data;
    this.downloadLinkElement.nativeElement.download = receiptName;
    this.downloadLinkElement.nativeElement.click();



    // device shareing
    await Filesystem.writeFile({
      path: receiptName,
      data: base64Data,
      directory: Directory.Cache
    });


    let fileResult = await Filesystem.getUri({
      directory: Directory.Cache,
      path: receiptName
    });

    let imageLink = Capacitor.convertFileSrc(fileResult.uri);

    Share.share({
      title: receiptName,
      text: receiptName,
      url: fileResult.uri,
    })
      .then(() => console.log('Successful share'))
      .catch((error) => console.log('Error sharing ::: ', error));

  }
user_14483790
Related