web-dev-qa-db-ja.com

jspdfを使用して生成されたPDFを新しいウィンドウで開く方法

jspdfを使用してPDFファイルを生成しています。すべてがうまく機能しています。しかし、生成されたPDFを新しいタブまたは新しいウィンドウで開く方法。

私は使っている

doc.output('datauri');

同じタブでPDFを開いています。

40
Satendra Jindal
  1. Jspdf.jsを検索:

    if(type == 'datauri') {
        document.location.href ='data:application/pdf;base64,' + Base64.encode(buffer);
    }
    
  2. 追加 :

    if(type == 'datauriNew') {   
        window.open('data:application/pdf;base64,' + Base64.encode(buffer));
    }
    
  3. このオプションを 'datauriNew' Saludosと呼びます;)
9
Juan Capello

ソースに基づいて、output()に 'dataurlnewwindow'パラメーターを使用できます。

doc.output('dataurlnewwindow');

Githubのソース: https://github.com/MrRio/jsPDF/blob/master/jspdf.js#L914

考えられるすべてのケース:

doc.output('save', 'filename.pdf'); //Try to save PDF as a file (not works on ie before 10, and some mobile devices)
doc.output('datauristring');        //returns the data uri string
doc.output('datauri');              //opens the data uri in current window
doc.output('dataurlnewwindow');     //opens the data uri in new window
95
kardave

PDF=を直接読み込むにはこれを使用する必要があります。doc.output('dataurlnewwindow');を使用すると、見苦しいiframeが生成されます。Mac/ Chrome。

  var string = doc.output('datauristring');
  var x = window.open();
  x.document.open();
  x.document.location=string;
16

または... Blobを使用してこれを実現できます。

好む:

pdf.addHTML($('#content'), y, x, options, function () {
    var blob = pdf.output("blob");
    window.open(URL.createObjectURL(blob));
});

このコードを使用すると、ブラウザー内でBlobオブジェクトを作成し、新しいタブに表示できます。

9
ilter

私のために働いているこのソリューション

window.open(doc.output('bloburl'))
7
sol404

これは私がそれを処理する方法です。

window.open(doc.output('bloburl'), '_blank');
5
Alocus

javaScriptを使用すると、次のコードを使用して、生成されたPDFを新しいウィンドウに送信できます。

var string = doc.output('datauristring');

var iframe = "<iframe width='100%' height='100%' src='" + string + "'></iframe>"

var x = window.open();
x.document.open();
x.document.write(iframe);
x.document.close();
5
rod

これは私のために働く!!!

ウィンドウの機能を指定すると、新しいウィンドウで開きます

と同じように :

window.open(url,"_blank","top=100,left=200,width=1000,height=500");
2
Aswathy

このコードは、必要なタイトルで生成されたpdfを新しいタブで開くのに役立ちます

 let pdf = new jsPDF();
 pdf.setProperties({
          title: "Report"
      });
      pdf.output('dataurlnewwindow');
2
Neetz

ステップ1
addblockをオフにする

ステップ2
追加

window.open(doc.output('bloburl'), '_blank');

または試す

doc.output('dataurlnewwindow')
1
user3423593

ステップI:ファイルとプラグインを含める

../jspdf.plugin.addimage.js

ステップII:build PDF content var doc = new jsPDF();

doc.setFontSize(12);
doc.text(35, 25, "Welcome to JsPDF");
doc.addImage(imgData, 'JPEG', 15, 40, 386, 386);

ステップIII:新しいウィンドウに画像を表示する

doc.output('dataurlnewwindow');

Stepv IV:データを保存する

var output = doc.output();
return btoa( output);
1
Milind Morey

Javascriptコード:最終行に追加

$("#pdf_preview").attr("src", pdf.output('datauristring'));

HTMLコード:本文に挿入

<head>
</head>
<body>
<H1>Testing</h1>
<iframe id="pdf_preview" type="application/pdf" src="" width="800" height="400"></iframe>
</body>
</html>

iframe内の同じウィンドウ内で、他のコンテンツとともにプレビューします。

0
jiban

Javascriptコード

// IE doesn't allow using a blob object directly as link href
// instead it is necessary to use msSaveOrOpenBlob
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
  window.navigator.msSaveOrOpenBlob(doc.output("blob"), "Name.pdf");
} else {

  // For other browsers:
  // Create a link pointing to the ObjectURL containing the blob.
  doc.autoPrint();
  window.open(
    doc.output("bloburl"),
    "_blank",
    "height=650,width=500,scrollbars=yes,location=yes"
  );

  // For Firefox it is necessary to delay revoking the ObjectURL
  setTimeout(() => {    
    window.URL.revokeObjectURL(doc.output("bloburl"));
  }, 100);
}
0