首页 > 解决方案 > 使用 jsPDF 生成的 PDF 文件不显示在 Microsoft Edge 上

问题描述

我目前正在做一个项目,我必须使用 jsPDF 生成关于单击按钮的报告。该代码在 Google Chrome 和 Mozilla Firefox 中运行良好,但不适用于 Microsoft Edge。PDF 文档在后台的 iframe 中加载,但页面是白色和空白的。谁能建议在 Microsoft Edge 中正确显示 PDF 的解决方案?

注意:我不能分享代码,因为它会侵犯版权。对不起。no such interface supported此外,当我单击按钮时,调试器会显示错误。

提前致谢。

这是我为演示该问题而创建的示例代码:

import { Component, OnInit } from '@angular/core';
import * as data from '../dummy.json';
import * as jsPDF from 'jspdf';
import 'jspdf-autotable';

@Component({
  selector: 'app-create-pdf',
  templateUrl: './create-pdf.component.html',
  styleUrls: ['./create-pdf.component.css']
})
export class CreatePDFComponent implements OnInit {

  constructor() { }

  ngOnInit() {
    debugger;
    var columns = [
      {title: "ID", dataKey: "id"},
      {title: "Name", dataKey: "name"}, 
      {title: "Country", dataKey: "country"}, 
  ];

  var rows = [
      {"id": 1, "name": "Shaw", "country": "Tanzania"},
      {"id": 2, "name": "Nelson", "country": "Kazakhstan"},
      {"id": 3, "name": "Garcia", "country": "Madagascar"},
  ];

  var doc = new jsPDF('p', 'pt');
  doc.autoTable(columns, rows, {
      styles: {fillColor: [100, 255, 255]},
      columnStyles: {
        id: {fillColor: 255}
      },
      margin: {top: 60},
      beforePageContent: function(data) {
        doc.text("Header", 40, 30);
      }
  });
      let blob = doc.output("dataurlnewwindow");
      var newWindow = window.open(URL.createObjectURL(blob));
      newWindow.document.write('<title>My PDF File Title</title>');    
    }   
  }

标签: angularmicrosoft-edgejspdf

解决方案


推荐阅读