在HTML中嵌入PDF的推荐方法？

这是快速,简单的,不需要任何第三方脚本:

';
?>

如果您需要快速解决方案,希望避免跨浏览器PDF查看问题,以及PDF只是一两页,这是一个不错的选择.当然,您需要在Web服务器上安装ImageMagick(这反过来需要Ghostscript),这是在共享托管环境中可能无法使用的选项.还有一个PHP插件(称为imagick)就像这样工作,但它有自己的特殊要求.

查看此代码 - 将PDF嵌入HTML中

FDView将PDF2SWF(它本身基于xpdf)与SWF查看器结合在一起,因此您可以在服务器上即时转换和嵌入PDF文档.

xpdf不是一个完美的PDF转换器.如果您需要更好的结果,那么Ghostview可以将PDF文档转换为其他格式,您可以更轻松地为其构建Flash查看器.

但对于简单的PDF文档,FDView应该可以很好地工作.

我们的问题是,出于法律原因,我们不允许在硬盘上临时存储PDF.此外,在浏览器中将PDF显示为"预览"时,不应重新加载整个页面.

首先我们尝试了PDF.jS. 它适用于Firefox和Chrome浏览器中的Base64.但是,我们的PDF格式慢得令人无法接受.IE/Edge根本不起作用.

因此,我们在HTML对象标记中使用Base64字符串进行了尝试.这再次对IE/Edge不起作用(可能与PDF.js相同).在Chrome/Firefox/Safari中再次没问题.这就是我们选择混合解决方案的原因.IE/Edge我们使用IFrame和所有其他浏览器使用object-tag.

IFrame解决方案当然也适用于Chrome和co.我们之前没有将此解决方案用于Chrome的原因是,尽管PDF正确显示,但只要您在预览中点击"下载",Chrome就会向服务器发出新请求.由于PDF显示在IFrame中,因此不再设置所需的隐藏字段pdfHelperTransferData(用于发送PDF生成所需的表单数据).对于此功能/错误,Chrome会在下载PDF时发送两个请求(并取消其中一个请求).

现在问题儿童IE9和IE10仍然存在.对于这些,我们放弃了预览解决方案,只需通过单击预览按钮向用户下载(而不是预览)来发送文档.我们已经尝试了很多,但即使我们找到了解决方案,这个小部分用户的额外努力也不值得付出努力.您可以在此处找到我们的下载解决方案:使用IFrame下载PDF而无需刷新.

我们的Javascript

var transferData = getFormAsJson()
if (isMicrosoftBrowser()) {
        // Case IE / Edge (because doesn't recoginzie Pdf-Base64 use Iframe)
        var form = document.getElementById('pdf-helper-form');
        $("#pdfHelperTransferData").val(transferData);
        form.target = "iframe-pdf-shower";
        form.action = "serverSideFunctonWhichWritesPdfinResponse";
        form.submit();
 } else {
        // Case non IE use Object tag instead of iframe
        $.ajax({
            url: "serverSideFunctonWhichRetrivesPdfAsBase64",
            type: "post",
            data: { downloadHelperTransferData: transferData },
            success: function (result) {
                $("#object-pdf-shower").attr("data", result);
            }
        })
 }

我们的HTML

要检查IE/Edge的浏览器类型,请参阅此处:如何使用JavaScript检测Internet Explorer(IE)和Microsoft Edge？我希望这些发现可以节省别人的时间.

创建一个容器来保存PDF

告诉PDFObject要嵌入哪些PDF,以及嵌入它的位置

您可以选择使用CSS指定视觉样式,包括尺寸,边框,边距等.

来源:https://pdfobject.com/

Scribd不再要求您在其服务器上托管您的文档.如果您使用这些帐户创建帐户,则会获得发布商ID.只需几行JavaScript代码即可加载存储在您自己的服务器上的PDF文件.

有关详细信息,请参阅开发者工具.

牛尾巴2010

这个屌丝很懒，什么也没留下！

关注作者

Tags | 热门标签

• actionscrip
• bash
• c#
• c++
• c语言
• erlang
• flutter
• go
• golang
• java
• javascript
• lua
• node.js
• perl
• php
• python
• scala
• typescript

RankList | 热门文章

• 1Node.js:如何远程调试？
• 2android中的每个活动都有自己的上下文吗？在单个应用程序中具有多个活动的方案是什么
• 3在R中替换第一次出现的":"而不是第二次
• 4在Windows 10应用程序中获取WiFi适配器列表失败
• 5带有"not character"的正则表达式与预期不匹配
• 6Android Studio如何启动垃圾收集器以及它如何工作？
• 7Go - ReverseProxy到Apache代理错误:x509:由未知权限签名的证书
• 8如何在CEKEditor中添加自定义html标签？
• 9在namedtuple中输入提示
• 10按MongoDB中的子字符串对值进行分组
• 11当我动态更改html时,ng-click in ng-bind-html不会触发
• 12重定向后如何在链接上设置活动类？
• 13meteor mongo驱动程序可以处理$ each和$ position运算符吗？
• 14在c ++中将char转换为string
• 15使用SHA ID修改旧提交的评论消息
• 16AMD Loader禁用,在主题中启用
• 17FileOutputStream将编码设置为utf-8
• 18如何动态地将类添加到焦点输入字段的父div？
• 19Webpack UglifyJS删除死代码,但不要最小化代码
• 20WCF - CMS中具有Web控件的客户端安全性

DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有