iframe 的 window.print，引导模式内带有 pdf

Question

大家好，我尝试打印一个引导模式，其中包含一个指向本地 pdf 文件的 iframe。模态本身看起来不错。

问题是我想用自己的按钮打印模式（不是 pdf 对话框中的按钮，这很好用）。

<button onclick="window.print()">print page!<button />

如果我这样做，pdf 就会被切断。这似乎只发生在 pdf 中，而不是 f.i.图像。

Answer 1

问题是 iframe 无法缩放以匹配 pdf 的大小。

浏览器中没有解决此问题的本机方法，但我们可以使用几个 JS 库来解决该问题。

第一步是使用 JS PDF 渲染器，而不是本机浏览器 PDF 渲染。这样我们就可以在 PDF 旁边运行 JS。

接下来我们可以使用JS来调整PDF的大小并调整iframe的大小。这是一个过于复杂的问题，由 iframe-resizer 库解决了。

完成这两项设置后，iframe 将自动缩放到 PDF 的大小，并在打印过程中调整视口大小时保持正确缩放。