Создать и открыть PDF в новой вкладке - PullRequest
Новая
       21

Создать и открыть PDF в новой вкладке

1 голос
/ 12 июня 2019

В моем приложении я получил кнопку, которая создает PDF с использованием html2canvas и jsPDF.Я хочу, чтобы новый загруженный PDF-файл был открыт в новой вкладке.Я не могу понять, как открыть только что загруженный файл.

Это вообще возможно сделать?

Это мой код. 

print() {
        const fileName = String(new Date().valueOf());
        const element: HTMLElement = document.querySelector('.print-area');
        const regionCanvas = element.getBoundingClientRect();
        html2canvas(element, { scale: 3 }).then(async canvas => {
            const pdf = new jsPDF('p', 'mm', 'a4');
            pdf.addImage(canvas.toDataURL('image/png'), 'PNG', 3, 0, 205, (205 / regionCanvas.width) * regionCanvas.height);
            await pdf.save(fileName, { returnPromise: true });

            const a = document.createElement('a');
            a.href = fileName;
            // this points to non existing file
            document.body.appendChild(a);
        });
    }

1 Ответ

1 голос
/ 12 июня 2019

Я нашел способ скачать и открыть файл. Вы должны в основном вызвать две функции: 

pdf.save(fileName);
window.open(pdf.output('bloburl', { filename: fileName }), '_blank');

Итак, код в конце выглядит так: 

print() {
        const fileName = String(new Date().valueOf());
        const element: HTMLElement = document.querySelector('.print-area');
        const regionCanvas = element.getBoundingClientRect();
        html2canvas(element, { scale: 3 }).then(async canvas => {
            const pdf = new jsPDF('p', 'mm', 'a4');
            pdf.addImage(canvas.toDataURL('image/png'), 'PNG', 3, 0, 205, (205 / regionCanvas.width) * regionCanvas.height);
            await pdf.save(fileName, { returnPromise: true });
            window.open(pdf.output('bloburl', { filename: fileName }), '_blank');
        });
    }
...