pdfMake - open()和print()函数不起作用

Rit*_*ena 5 html javascript pdf html5 pdfmake

我正在尝试学习如何使用pdfMake.我正在尝试分别使用openprint生成或打印信息.但是,当我点击触发事件的按钮时,新标签会打开一秒钟并消失.打开的页面在历史记录中显示为blob:http://localhost:9999/93c1600e-3c64-42fe-8b44-fe6eeb995b5e

我无法弄清楚错误.我正在关注pdfMake 的官方文档.

请帮忙.

function print(){
  window.event.preventDefault()
  // this is just a simulation of the open event, replacing it with print produces the same result
  var docDefinition = { content: {text:'This is an sample PDF printed with pdfMake',fontSize:15} };
  pdfMake.createPdf(docDefinition).open();
}
Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE HMTL>
<html>
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,initial-scale=1.0" />
  <script src='https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.27/pdfmake.min.js'></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.27/vfs_fonts.js"></script>
  <script src="js/print.js"></script>
</head>
<body>
  <main>
    <button onclick="print()">Print Card</button>
  </main>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

ste*_*njj 16

请检查浏览器中的任何类型的广告拦截器是否已关闭,然后重试.


Ver*_*rri 6

我找到了在同一窗口中打印的解决方案。

在你的 .html 文件中放入iframe

<iframe id="printPdf" name="printPdf"></iframe>
Run Code Online (Sandbox Code Playgroud)

iframe例如,需要样式来隐藏自己(我不知道为什么,但如果我在 iframe 上定义宽度和高度,打印将无法工作):

#printPdf { position: fixed; top: 0px; left: 0px; display: block;
            padding: 0px;border: 0px;margin: 0px;
            visibility: hidden; opacity: 0; 
}
Run Code Online (Sandbox Code Playgroud)

最后,只需调用:

    if ('safari') {
        pdfMake.createPdf(content).open({}, window.frames['printPdf']);
        setTimeout(function() {
            window.frames['printPdf'].focus();
            window.frames['printPdf'].print();
        }, 2000)
    } else {
        pdfMake.createPdf(content).print({}, window.frames['printPdf']);
    }
Run Code Online (Sandbox Code Playgroud)

在 Chrome v72、Firefox v65、Edge v18、Safari v12 上测试