pdf.js预览pdf文件实现边框下载、打印按钮隐藏、边框隐藏及出现的错误问题
pdf.js
PDF Reader in JavaScript
项目地址:https://gitcode.com/gh_mirrors/pd/pdf.js
免费下载资源
·
下载pdf.js:
下载完成后,在项目的public文件下创建pdfjs文件夹,将解压后的web、build文件复制到pdfjs文件夹内。
添加iframe视图标签,src内按照只有url是动态的,其他可以照搬。
<iframe
:width="800"
style="height: 100%;"
v-else="url"
:src="`/pdfjs/web/viewer.html?file=${encodeURIComponent(url)}`"
></iframe>
从后台获取pdf文件流,将文件流转换成BlobPart类型(注:vue3要加类型),以pdf格式显示到iframe内。
到这里其实已经可以正常使用了,本地运行其实是没有问题的,但是部署到服务器后,出现报错:
Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "application/octet-stream". Strict MIME type checking is enforced for module scripts per HTML spec.
原因是viewer.mjs的原因,解析不出mjs文件脚本,这里直接将viewer.mjs的后缀改成了js文件,然后将viewer.html文件内的<script src="viewer.js" type="module"></script>也改成.js后缀,这样就可以正常运行了。
隐藏打印、下载按钮(其他按钮的代码都挨着,可以一个一个挨着试即可)。
打开viewer.html文件,搜索id="download"或id="print",然后再按钮上加隐藏属性。
隐藏黑色边框,搜索id="toolbarContainer"
为了更自然点,还可以将外边框设置成白色,搜索id="mainContainer"
GitHub 加速计划 / pd / pdf.js
6
0
下载
PDF Reader in JavaScript
最近提交(Master分支:5 个月前 )
ac579396
Implement helper functions for (un)selecting an editor in the integration tests 3 天前
895edafc
This has multiple advantages:
- it improves consistency between the various editor integration tests;
- it makes the code easier to read/understand;
- it reduces code duplication.
3 天前
更多推荐
已为社区贡献2条内容
所有评论(0)