Question

我构建了一个Ionic 3应用程序，我想显示base64编码文件的预览。

我首先尝试使用此插件： https://www.npmjs.com/package/ng2-pdf-viewer

它起初工作但今天我的PDF不再出现了。也许是因为家属过时了。无论如何，这个插件并没有给我一个满意的预览。

现在我找到了这个：https://ionicframework.com/docs/native/base64/

但问题是我不能在这个插件中使用Base64。

我真的不知道如何解决这个问题。有人有解决方案吗？

Answer 1

您必须将Base64字符串转换为Uint8Array。来自Download File from Bytes in JavaScript。

将基本64转换函数添加到您的调用组件

base64ToArrayBuffer(base64) {
    const binary_string = window.atob(base64);
    const len = binary_string.length;
    const bytes = new Uint8Array(len);
    for (let i = 0; i < len; i++) {
        bytes[i] = binary_string.charCodeAt(i);
    }
    return bytes.buffer;
}

内容初始化后：

public ngAfterContentInit(): void {
  this.viewer.pdfSrc =  this.base64ToArrayBuffer(this.model.pdfBytes);
}

其中this.model.pdfBytes包含base64编码的字符串。

Answer 2

我不知道我的解决方案是否符合您的要求，但我使用了它并且它有效。

 Pdf(){
this.rest.getPdfVacation(this.mail).then(data=>{
  if(data.json()){
    let pdf = window.open(); 
    pdf.document.write("<iframe width='100%' height='100%' src='data:application/pdf;base64, " + data.json().RESPUESTA + "'></iframe>"); 
  }
}) }

你可以看到我在一个新选项卡中打开pdf，但是你可以避免这种情况，我的base64字符串在data.json（）。RESPUESTA中，所以在那个地方你可以放置你的base64数据。

喝彩！

在Ionic 3应用程序中打开Base64编码的PDF文件

2 个答案: