spring boot2.X word在线预览 pdf.js_zenghu_10的博客-程序员信息网_springboot 在线预览pdf

技术标签: pdf.js的使用教程  pdf.js禁止下载打印  springboot2.X word文档在线预览  java后台  

最近公司项目需求需要在线预览word文档,并且不能在在线下载和编辑。在此记录我是如何做的。

针对word的在线预览网上大多给的解决方案就是先把word文件转成pdf,然后通过pdf.js在线预览pdf。

下面是详情详细的操作步骤;

1.springboot继承jodconverter把非pdf文件转成pdf

详细请查看我另一篇文章:spring boot2.X word转pdf_zenghu_10的博客-程序员信息网_springboot word转pdf

2.下载pdf.js所需文件并集成到spring boot

pdf.js下载地址:Getting Started

下载之后是这么个目录,把当前目录的文件以及文件夹copy到spring boot的statifc中,确保能通过域名加地址直接访问.

我是在static中创建了一个pdfjs文件夹,把所有文件都放到此文件夹中。

这是copy之后的情况。

3.使用pdf.js进行文件预览

pdf.js文件预览的关键是web中的viewer.html文件,只需要访问该文件,并把你要预览的pdf文件路径当做参数传递过去就可以实现预览啦。

例如:我的pdf文件路径为项目的static下面的/upload/works/course/1561101210883411_doc_to_pdf.pdf并且该文件可以直接通过http://localhost/upload/works/course/1561101210883411_doc_to_pdf.pdf路径进行访问。

预览是访问的地址就是http://localhost/pdfjs/web/viewer.html?file=/upload/works/course/1561101210883411_doc_to_pdf.pdf

效果图:

注意:如在预览中遇到“file origin does not match viewer”错误请把web文件夹下面的viewer.js文件中的此行注释掉

4.禁止下载和打印文件

由于pdf.js自带下载和打印功能,需要禁止下载和打印。

在处理该问题时我在网上也找了解决办法,好多都说把web文件夹下面的viewer.html中的Print和Download 2个button按钮隐藏掉就可以了,这种方式我试了,不好使,不知道是因为我版本比较新的问题还是怎么回事,目前我的pdf.js的版本为"pdfjs-2.0.943-dist"。

最终我的解决方案:在web文件夹中的viewer.js中把打印和下载的点击触发的click事件行为进行修改,触发click水事件时来提示禁止打印和下载,以此来完成禁止打印,下载。

至此结束!

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/zenghu_10/article/details/93231808

智能推荐

计算机平板传输软件,如何在iPad和电脑之间无线传输文件_paid Pay的博客-程序员信息网

iPad 与电脑之间互传一些数据,如照片、视频,文件等,那么ipad如何传文件到电脑呢?今天学习啦小编与大家分享下ipad传文件到电脑的具体操作步骤,有需要的朋友不妨了解下。ipad传文件到电脑的方法首先得下载itunes,可以在官网下载,也可以在第三方软件下载平台下载。ipad传文件到电脑的方法图12下载后双击安装,安装过程截图如下:ipad传文件到电脑的方法图2ipad传文件到电脑的方法图3i...

java导出excel文件demo_张先森_001的博客-程序员信息网

package com.youanmi.bis.helper;import java.io.InputStream;import java.io.OutputStream;import java.lang.reflect.Field;import java.text.SimpleDateFormat;import java.util.ArrayList;import j

PHP链接数据库报错 php_network_getaddresses: getaddrinfo failed: Name or service not known_不会飞的大象的博客-程序员信息网

1,项目是用的阿里云数据库,链接是一长串的字符串,类似下面这样的rr-sdf23djgkjhw2345.mysql.rds.aliyuncs.com2,如果报上面的错误,先ping 一下这个地址,如果能ping 通,会得到一个ip地址3,用ip地址替换掉字符串,搞定4,原因:1),这个字符串会被PHP解析成ip地址(redis 的字符串地址也会被解析成ip地址)...

【atx】一,atx的安装过程_恋lian不忘2018的博客-程序员信息网

    今晚师傅让我学这个atx的安装,这个atx是网易开发的一款移动ui自动化测试框架,是开源的,比appium简单,可以实现无线连接,同时操控80台手机(需要一台不错的路由器,最好是企业级的,什么魅族小米路由会有点卡),同时支持ios系统,所以是一个很强大的测试框架。环境:window10工具:pycharm2017.31,安装atx。pip install atx2,安装uiautomato...

深入理解L1、L2范数_取个名字最难了的博客-程序员信息网_图像的l2范数

关于作者作者小硕一枚,研究方向为机器学习与自然语言处理,欢迎大家关注我的个人博客https://wangjie-users.github.io/,相互交流,一起学习成长。前言说起L1、L2范数,大家会立马想到这是机器学习中常用的正则化方法,一般添加在损失函数后面,可以看作是损失函数的惩罚项。那添加L1和L2正则化后到底有什么具体作用呢?为什么会产生这样的作用?本篇博文将和大家一起去探讨L1范...

TensorFlow2.0学习笔记-----前向传播实战_北航_Curry的博客-程序员信息网

本文只有训练过程,用最基础的方式即张量运算的方式来实现,并不用既定的层方式来实现网络。任务:代码:import tensorflow as tfimport numpy as npimport osos.environ['TF_CPP_MIN_LOG_LEVEL'] = '2'# '0'代表所有信息都打印出来 '2'代表只打印error。可以方便我们查看打印的信息(x, y), _ = tf.keras.datasets.mnist.load_data()# 只加载训练数据

随便推点

Failed to execute iptables-restore: exit status 1_GeekXuShuo的博客-程序员信息网

kube-proxy 报错:Failed to execute iptables-restore: exit status 1现象:k8s的某node节点 无法使用nodeport方式访问service服务(ip+nodeport),其他node节点正常原因kube-proxy组件没成功调iptables添加相关规则原因操作更换iptables的版本号降低到iptables-1.4.21...

sqlite3 无法插入数据_shrimpma的博客-程序员信息网

查看表结构 .schema flowCREATE TABLE [flow] ([id] INTEGER  PRIMARY KEY NOT NULL,[timestamp] INTEGER NULL,[ip] VARCHAR(16) NULL,[user] VARCHAR(32) NULL,[group] VARCHAR(32) NULL,[up] UNSIGNED BIG INT NULL

浅谈正则表达式_冰山_的博客-程序员信息网

正则表达式,就是使用定义好的特定字符组成一个“规则字符串”,来描述、匹配一系列符合其规则的字符串。也就是说,通过正则表达式,我们可以按照一定的匹配规则从字符串中提取出我们想要的数据。一、匹配规则1.普通字符因为普通字符的匹配规则是一个具体的字符串,所以其匹配的灵活性非常有限。import retarget='Life is short,I learn python.'result=re.findall('python',target)print(result)# 得到的结果是['p

libvirt_python_weixin_38166726的博客-程序员信息网

一、Connections连接函数接口libvirt.open(name);                   //可读写方式连接上QEMU 参数说明: name:连接名称libvirt.openAuth(uri, auth, flags);          //认证方式连接上QEMU      参数说明: uri:连接到Hypervisor的入口地址libvi...

Android获取音视频原始流数据方法详解_Mr_小艾的博客-程序员信息网

视频数据流的获取Android设备视频数据的获取,是调用Camera,所以需要在AndroidManifest中添加以下的权限:<uses-permission android:name="android.permission.CAMERA" /><uses-feature android:name="android.hardware.camera" /><uses-feature androi

推荐文章

热门文章

相关标签