前言
pdf.js 是一个很好的在线预览PDF的js框架。本人测试支持ie11、chrome、360.
下载
pdf.js 下载地址 解压之后直接放到前端项目中。
使用
这个是我的目录结构
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="bootstrap2/js/jquery.js"></script>
<script type="text/javascript">
$(function(){
$("#displayPdfIframe").attr("src",'pdf/web/viewer.html?file=' + encodeURIComponent('http://172.16.12.32:8889/TestPdf/pdf2/20190926104341.pdf'));
});
</script>
</head>
<body>
<div class="ctrlDiv">
<div class="eleContainer elePaddingBtm">
<iframe id="displayPdfIframe" width="100%" height="100%"></iframe>
</div>
</div>
</body>
</html>
参数处理
我这边是采用nginx代理文件的形式
也可以采用接口形式(返回流的形式)
只是要注意接口如果要有参数的话要用encodeURIComponent处理一下。不然的话参数会消失
$("#displayPdfIframe").attr("src",'pdf/web/viewer.html?file=' + encodeURIComponent('http://172.16.12.32:8889/TestPdf/pdf2/20190926104341.pdf'));
跨域处理
如果出现跨域问题，除了自身问题还有可能是web/viewer.js 文件里的问题。把下图中的注释即可。
还有什么问题可以一起讨论一下
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/15308.html
