使用 Ionic 文件选择器上传 PDF 后文件数据为空，PDF 已损坏

Question

我正在使用来自 @ionic-native/chooser/ngx 的插件 Chooser : https://ionicframework.com/docs/native/chooser 我的目标是从我 phone 上的下载中获取 PDF 文件，并将其发送到 base64 中的服务器。但是我的服务器收到损坏的 PDF。

我是这样使用它的：

  openFiles() {
this.chooser
  .getFile('application/pdf')
  .then((file) => {
    console.log('L-119 --> File  : ' + JSON.stringify(file));}

但是当我在我的控制台中读取文件时，我得到了这个：

我的数据是空的！ 所以我对此无能为力，或者我遗漏了什么？

例如，对于一张照片，我正在使用相机插件，如下所示：

  this.camera.getPicture(options).then(
  (imageData) => {
    console.log('file ' + JSON.stringify(imageData));

我得到的结果是：

我的服务器得到一个正确的文件并且可以打开它。您知道我如何使用 Ionic chooser 插件中的这些信息来正确发送我的 PDF 吗？

我想用 Ionic 的方式来做。

编辑 1：

使用 Ionic 的 Base64 插件

        const filePath = file.uri;
    this.base64.encodeFile(filePath).then(
      (base64File: string) => {
        console.log('my base 64 file is ' + base64File);
      },
      (err) => {
        console.log(err);
      }
    );

结果：

我来自 Base64 插件的 base64 文件仍然是空的。

编辑 2：

对于Base64，我们需要给出文件的路径，而不是URI。为了获得路径，我使用了 Ionic File Path 这样的：

      this.filePath
      .resolveNativePath(file.uri)
      .then((resultat) => console.log('file path ' + resultat))
      .catch((err) => console.log(err));

我收到这个：file:///storage/emulated/0/Download/dummy.pdf' 然后使用@Najam Us Saqib 的回答，我在该路径中使用 Ionic Base64，我得到了这个：

问题已解决！

Answer 1

使用 base64 插件 Base64 将您的文件转换为 base64 并将其发送到服务器。将您的 FilePath 传递给该插件，它会将您的文件转换为 base64。 P.S: 我建议你上传文件，因为它不使用 base64。它将提高您的应用程序性能。

import { Base64 } from '@ionic-native/base64/ngx';

constructor(private base64: Base64) { }

...

let filePath: string = 'file:///...';
this.base64.encodeFile(filePath).then((base64File: string) => {
  console.log(base64File);
}, (err) => {
  console.log(err);
});

使用 Ionic 文件选择器上传 PDF 后文件数据为空，PDF 已损坏

File data is empty after uploading a PDF with Ionic File Chooser, PDF corrupted

pdf

base64

file

ionic-framework

angular