如何在src = pdf的IFRAME中打印PDF？

Question

我有一个iframe需要直接指向PDF文件而不是包含PDF文件的页面：

<iframe id="ecard-pdf" name="ecard-pdf" style="position: absolute;" src="/profile.pdf">
</iframe>

我希望能够在这个iframe中打印PDF。

我在其他问题中找到了几个解决方案，但它们都不能满足我的需求：

1. 需要在iframe内有一个函数（https://dev59.com/lHRB5IYBdhLWcg3w6LR2#473270）
2. 建议将焦点放在框架上，然后执行打印操作（https://dev59.com/Vmkw5IYBdhLWcg3w1eC7#9616706）
3. 访问iframe的contentWindow并打印它（https://dev59.com/Vmkw5IYBdhLWcg3w1eC7#9617566）
4. 以上方法的变化

然而，如果iframe的src直接指向PDF而不是包装PDF的页面，则FireFox和IE似乎无法做到这一点。

Firefox：

它显示此对话框而不是打印：“防止此页面创建其他对话框”，其中包含“确定”和“取消”按钮，但没有一个可以打印PDF。

IE：

忽略了我使用上述方法打印的尝试。

问题：

如何允许用户在使用任何浏览器时打印iFrame中的PDF？

- Asu

---

你可以与浏览器对抗，或者你可以创建一个HTML包装页面（例如 /printpdf.php?file=/profile.php），然后打印该页面。 - N Rohler

你应该查看这个答案，似乎能够在IE和Firefox上实现你正在尝试的东西。 - Braiam

你需要指定pdf文件的路径为src="file://..."。 - CMS_95

@CS_STEM 没有证据表明这个在本地文件系统上，即使它在那里，这个问题也已经一年了。 - Daedalus

@QuarK 他去年问过这个问题。 - howderek

Answer 1

我曾经为了兼容IE和Chrome而苦苦挣扎过。以下方法对我来说是可行的：

$(function() {
    var ua = window.navigator.userAgent;
    var msie = ua.indexOf('MSIE ');
    var trident = ua.indexOf('Trident/');
    var edge = ua.indexOf('Edge/');
    var url = '/url/to/file.pdf';
    var pdf ='';
    var style = 'position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden;';

    if(msie > 0 || trident > 0 || edge > 0){
        pdf = '<object data="' + url + '" name="print_frame" id="print_frame" style="' + style + '" type="application/pdf">';
    }
    else{
        pdf ='<iframe src="' + url + '" name="print_frame" id="print_frame" style="' + style + '"></iframe>';
    }

    $(document.body).append(pdf);

    setTimeout(function(){
        window.frames["print_frame"].focus();
        window.frames["print_frame"].print();
    },2000);
});

感谢您的支持。

- Svela

Answer 2

如类似问题中的回答所建议的，您可以这样做：

window.frames.pdfFrame.print();

这应该可以解决你的问题。

- bdadam

---

embed 标签怎么样？ - TheRealChx101

Answer 3

选项1：

我还没有测试过，但我在这里找到了另一个答案：https://dev59.com/WVHTa4cB1Zd3GeqPTKGP#4096547

假设您可以使用以下内容：

<style type="text/css" media="print">
   body *{display:none}
   iframe{display:block}
</style>

所以只显示PDF文件吗？

选项2：

创建一个到PDF文件的超链接，上面写着“打印我”

<a href='Path/To/PDF'>Print Me</a>

希望这可以有所帮助...

-安德鲁

- acrawly

Answer 4

这似乎是有效的：

   <style type="text/css" media="print">
   body *{display:none}
   iframe{display:block}
   </style>

那么只显示PDF文件吗？

- Neutrino

Answer 5

const target_iframe = $("#pdfViewerIframe")

target_iframe.attr("src", URL.createObjectURL(new Blob([resp], {
                                type: "application/pdf"
                            })))

target_iframe[0].contentWindow.print()

注意： resp 是从服务器获取的 PDF 文件。

- goshant meher

Answer 6

你可以直接使用窗口打印选项。 使用 onclick 选项

onclick="javascript:window.print();"

- Imran khan

---

不会在 iframe 中打印 PDF 内容 - Wei Xu