Ionic 5 电容器无法打开文件

Question

我正在使用 ionic 5 电容器打开 pdf 文件，我收到的文件是 blob。

  downloadFile(data: Blob, fileName: string) {

    this.blob = new Blob([data], { type: 'application/pdf' });
    const reader = new FileReader;

    reader.onload = () => {
      console.log('3');
      var base64data = reader.result as string;
      // Save the PDF to the device
      try {
        Filesystem.writeFile({
          path: fileName,
          data: base64data,
          directory: FilesystemDirectory.Data,
          // encoding: FilesystemEncoding.UTF8
        }).then(() => {
          console.log('File Written');
          Filesystem.getUri({
            directory: FilesystemDirectory.Data,
            path: fileName
          }).then((getUriResult) => {
            console.log('getUriResult', getUriResult.uri);
            const path = getUriResult.uri;
            this.platform.ready().then(() => {
              this.fileOpener.open(path, 'application/pdf')
                .then(() => console.log('File is opened'))
                .catch(error => console.log('Error openening file', error));
            })
          }, (error) => {
            console.log('getUri', error);
          });
        });
      } catch (error) {
        console.error('Unable to write file', error);
      }
    }
    reader.readAsDataURL(this.blob);

  }

当我在真实设备上运行

时，出现下面提到的错误

Msg: Native: tried calling FileOpener.open, but the FileOpener plugin is not installed.
Msg: Install the FileOpener plugin: 'ionic cordova plugin add cordova-plugin-file-opener2'
Msg: Error openening file plugin_not_installed

我在网上搜索了相同的实现，但由于某种原因它不起作用。

Answer 1

您需要安装 cordova 插件包和本机包：

npm install cordova-plugin-file-opener2

npm install @ionic-native/file-opener

npm install cordova-plugin-file

npm install @ionic-native/file

ionic cap sync

Ionic 5 电容器无法打开文件

Ionic 5 capacitor unable to fileOpener

ionic4

capacitor

ionic5