第一次写博客,因为浏览器自带的预览pdf功能无法隐藏下载按钮,所以使用pdf.js来代替。
使用pdf.js步骤
1.在官网下载pdf.js并解压(地址:PDF.js )
选择稳定版下载,下载之后在项目的资源目录下创建一个文件夹,压缩文件解压到项目的资源目录下
2.如何预览pdf
使用pdf.js预览pdf是很简单的,链接web目录下的viewer.html页面,将pdf文件地址当作fileId的属性。因为我需要访问服务器上的pdf文件,所以此处使用的是已经编码后的网络路径,带有特殊字符(比如'='),所以需要使用encodeURIComponent函数对其进行编码,pdf.js会自动对其进行解码,不需要我们后台解码。代码如下:
3.隐藏下载功能
最简单的办法就是隐藏下载按钮,找到viewer.html里的打印,下载按钮,给其加上display:none属性。这个办法有一个隐患就是打开f12把属性去掉,按钮就又能被看到。
解决这个问题就是找到pdf/web/viewer.js,注释掉其中两行。(不同版本所在行数可能不同,根据行数找不到时请根据内容搜索)
解决了下载按钮之后,我发现鼠标焦点在iframe里时 使用ctrl+s也能下载文件。解决这个问题同样也是找到pdf/web/viewer.js,注释下载代码就ok了。(不同版本所在行数可能不同,根据行数找不到时请根据内容搜索)
这样用户就无法下载pdf文件了,我们的目的就达到了。