问题
I'm currently working on a project, where I have to generate a report on a button click using jsPDF. The code works perfectly fine in Google Chrome and Mozilla Firefox but doesn't work on Microsoft Edge. The PDF document loads in an iframe in the background but the page is white and blank. Can anyone suggest a solution for displaying the PDF correctly in Microsoft Edge?
Note: I cannot share the code because it causes copyright infringement. I'm sorry. Also, the debugger shows no such interface supported
error when I click the button.
Thanks in advance.
Here's a sample code I've created to demonstrate the issue:
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>');
}
}
来源:https://stackoverflow.com/questions/58969549/pdf-file-generated-using-jspdf-doesnt-show-on-microsoft-edge