Front-end for online preview pdf, docx, xls, ppt and other documents

Summary: Preview .pdf files can be opened directly in the browser

to sum up

1, the front end of the pure free way for online preview word, excel, ppt optimal choice of Microsoft Online Preview (non-editable)
2, using the back-end file into the picture, the front end as a picture preview (possible options)
3, Buy Online Preview Service DOC document services such as Baidu, Evermore, I DOC VIEW, etc.  

https://www.idocv.com/examples.html      the I VIEW DOC and other highlights on money

 

1. Preview doxc document: https://view.officeapps.live.com/op/view.aspx?src=http://mczaiyun.top/ht/3.docx       // network is not available, but the

<A href = "http://www.xdocin.com/xdoc?_func=to&_format=html&_cache=1&_xdoc=http://www.xdocin.com/demo/demo.docx" target = " _blank "rel =" nofollow "> consistent XDOC </a> // method, the network is not available, but the
 
With the method provided by Microsoft, but the network is not available, all the methods passed out ~~

2. Preview pdf document:

2.1

A label can be directly re-opened a page preview  

<a href="http://storage.xuetangx.com/public_assets/xuetangx/PDF/PlayerAPI_v1.0.6.pdf" target="_blank">PPT在线预览</a>
Applicable scene:
 The first came in only the file name is displayed, click on the preview time, will re-open a window preview
2.2
PDFObject.js (This method ie browser does not support)
<!DOCTYPE html>
<html>
<head>
    <title>Show PDF</title>
    <meta charset="utf-8" />
    <script type="text/javascript" src='http://jhyt.oss-cn-shanghai.aliyuncs.com/images/1531367199089_PDFObject.js'></script>
    <style type="text/css">
        html,body,#pdf_viewer{
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
</head>
<body>
    <div id="pdf_viewer"></div>
</body>
<script type="text/javascript">
    if(PDFObject.supportsPDFs){
      
        // PDF嵌入到网页
        PDFObject.embed("index.pdf", "#pdf_viewer" );
    }the else { 
        
        the location.href =  " / Canvas " ; 
    } 
    
    // also may be performed by determining whether the code to support PDFObject preview 
    IF (PDFObject.supportsPDFs) { 
       the console.log ( " Yay, the Supports inline PDFs the this Browser. " ); 
    } the else { 
       the console.log ( " Boo, inline PDFs are Not Supported by the this Browser " ); 
    } 
</ Script > 
</ HTML >

 

 
 2.2
 

Code Address: Download the run can be used: https://github.com/zhongqiulan/ppt    // intranet can be used, very good

The key knowledge points: jquery.media.js plug

 3.

2, word, xls, ppt files online preview

Way word, ppt, xls file is relatively simple for online preview can be achieved directly by calling Microsoft's online preview (Preview premise: resources must be publicly accessible)

<iframe src='https://view.officeapps.live.com/op/view.aspx?src=http://storage.xuetangx.com/public_assets/xuetangx/PDF/1.xls' width='100%' height='100%' frameborder='1'>
</iframe>

 

Reference article:

1. https://www.iteye.com/blog/vtrtbb-601267      the Java ppt convert a picture    (see background)

3. Preview Images: jQuery fancybox-picture // network can use, great

4.https://www.kissfree.cn/2778.html   

Front-end for online preview pdf, word, xls, ppt and other documents

Reference blog:

1. https://blog.csdn.net/fyhx2010/article/details/69569310      docx, PPT, XLS, html pdf file transfer Note: This article is for us to look back

I really powerful, not only do the front-end and back-end operation of the heart

Guess you like

Origin www.cnblogs.com/DZzzz/p/11405846.html