doc文件预览

需要安装https://github.com/myeeboy/xoffice的项目;
需要安装jdk,tomcat等
按照要求完成后,PC可以直接预览文档,转为pdf;
但是手机端不行,需要另外配置pdfjs
添加下载的demo,
在页面调用:
(tomcat需要配置跨域)
下载这俩放在lib,

image.png

在web.xml中添加

<!--  提供跨域支持 -->
    <filter>    
        <filter-name>CORS</filter-name>    
        <filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>    
        <init-param>    
            <param-name>cors.allowOrigin</param-name>   
            <param-value>*</param-value>   
        </init-param>    
        <init-param>    
            <param-name>cors.supportedMethods</param-name>   
            <param-value>GET, POST, HEAD, PUT, DELETE</param-value>   
        </init-param>    
        <init-param>    
            <param-name>cors.supportedHeaders</param-name>   
            <param-value>Accept, Origin, X-Requested-With, Content-Type, Last-Modified</param-value>   
        </init-param>    
        <init-param>    
            <param-name>cors.exposedHeaders</param-name>   
            <param-value>Set-Cookie</param-value>   
        </init-param>    
        <init-param>    
            <param-name>cors.supportsCredentials</param-name>   
            <param-value>true</param-value>   
        </init-param>    
    </filter>    
    <filter-mapping>    
        <filter-name>CORS</filter-name>    
        <url-pattern>/*</url-pattern>    
   </filter-mapping> 

vue页面需要用url放在iframe展示pdf:

<iframe
   :src="url"
   frameborder="0"
   width="100%"
   height="100vh" ></iframe>
this.word为文件地址:下载地址
let url = `http://210.5.144.126:8080/xoffice/xoffice?_xformat=doc&_file=${this.word}`;
   url = encodeURIComponent(url)
  url = '/web/viewer.html?file=' + url;
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容