美文网首页
vue实现word,excel,pdf,mp3,mp4,ppt,

vue实现word,excel,pdf,mp3,mp4,ppt,

作者: iaiayao | 来源:发表于2023-05-28 14:22 被阅读0次

    一、XDOC文档预览云服务(预览pdf、word、xls、ppt) (收费收费收费~!!!!不建议)
    XDOC文档预览云服务
    注意:文档地址要用utf-8编码,并且外网可访问。
    优点:

    只需要传入文档URL,基于内容自动识别文档格式
    高效、快速、实时预览,重复请求0毫秒响应
    使用HTML5方式展现内容,同时适配PC端和移动端
    支持PDF,OFD,DOC/X,XLS/X,PPT/X,JPG,MP4等多种文档格式
    调用方法

    https://view.xdocin.com/view?src=文档地址
    JS调用:
    https://view.xdocin.com/view?src=https%3A%2F%2Fview.xdocin.com%2Fdemo%2Fview.docx

    JS调用(带水印):

    window.open("https://view.xdocin.com/view?src=" + encodeURIComponent("https://view.xdocin.com/demo/view.docx") + "&watermark=" + encodeURIComponent("view.xdocin.com"));
    

    使用iframe

    <iframe :src="`https://view.xdocin.com/view?src=${encodeURIComponent(src)}`"
                    style="width:100%;height: 100vh;"></iframe>
    
    可选参数
    
    &pdf=true,word文档尝试以pdf方式显示,默认false
    
    &watermark=水印文本,显示文本水印;“img:”+图片url表示图片水印,如:img:https://view.xdocin.com/demo/wm.png
    
    &saveable=true,是否允许保存源文件,默认false
    
    &printable=false,是否允许打印,默认true
    
    ©able=false,是否允许选择复制内容,默认true
    
    &toolbar=false,是否显示底部工具条,默认true
    
    &title=自定义标题
    
    &expire=30,预览链接有效期,单位分钟,默认永久有效
    
    &limit=,限制页数,如:“5”表示只显示前5页,“2,5”表示从第2页开始的5页,对pdf/doc/docx/ppt/pptx有效
    
    &filename=文件名,辅助识别文档格式
    
    &fontsize=字体大小(单位px),默认14,范围:6~58
    
    &mtime=文件修改时间戳(如:1633093801,精确到秒)或修改时间(如:2021-10-01 21:10:01),值改变刷新缓存
    

    展示word还可以使用docx-preview
    展示excel还可以使用xlsxjs,但是没有表格样式

    弃用!!以后再整理

    二、音频mp3

    <audio controls :src="src"></audio>
    

    三、视频mp4

    <video autoplay="autoplay" loop="loop" controls>
                    <source :src="src" type="video/mp4">
                    Your browser does not support the video tag.
                </video>
    

    相关文章

      网友评论

          本文标题:vue实现word,excel,pdf,mp3,mp4,ppt,

          本文链接:https://www.haomeiwen.com/subject/ppldedtx.html