V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Dive into HTML5
http://diveintohtml5.org/
burnbrid
V2EX  ›  HTML

页面预览 PDF 文件

  •  
  •   burnbrid · 2020-04-15 08:47:03 +08:00 · 2646 次点击
    这是一个创建于 804 天前的主题,其中的信息可能已经有所发展或是发生改变。

    早安,先生们。我想问下怎么把一个 PDF 文件直接展示到页面上给用户看?不需要用户去下载,直接在网页上预览。

    11 条回复    2020-04-15 13:28:05 +08:00
    YuxiangLuo
        1
    YuxiangLuo  
       2020-04-15 08:52:31 +08:00 via Android
    sevenzhou1218
        2
    sevenzhou1218  
       2020-04-15 08:52:56 +08:00
    jspdf
    jydeng
        3
    jydeng  
       2020-04-15 08:58:13 +08:00
    pdf.js +1 最近刚刚做了一个类似的项目。
    chanchan
        4
    chanchan  
       2020-04-15 09:02:14 +08:00
    <embed>标签?
    burnbrid
        5
    burnbrid  
    OP
       2020-04-15 09:02:29 +08:00
    @jydeng 能看下你源码吗?我老笨,培训学校出来的
    jydeng
        6
    jydeng  
       2020-04-15 09:09:38 +08:00
    @burnbrid 项目是基于 vue 的,关键字:vue-pdf
    HeyWeGo
        7
    HeyWeGo  
       2020-04-15 09:10:17 +08:00
    lanhuapp.com/meeting

    我觉得简单场景下,上面链接里的实现方式挺合适的。看上去就是用浏览器自带的预览,iframe 嵌入
    dodo2012
        8
    dodo2012  
       2020-04-15 09:13:37 +08:00
    移动端 pdf.js 有时不好用,我后来直接把 pdf 弄成一张张图片了
    burnbrid
        9
    burnbrid  
    OP
       2020-04-15 09:58:59 +08:00
    dodo2012
        10
    dodo2012  
       2020-04-15 12:34:12 +08:00
    @burnbrid 这个在手机上有时是会有问题,所以我直接生成图片加载了😭
    davin
        11
    davin  
       2020-04-15 13:28:05 +08:00
    原文件本身就是 pdf 格式的么,还是从 office 文档( pptx/docx/xlsx )转换来的?如果原文件是 office 文档,可以把文件放在远程服务器上,在浏览器输入 https://view.officeapps.live.com/op/embed.aspx?src= 再在等号后面加上以 https 开头的远程路径文件(可以是 pptx/docx/xlsx 格式)地址即可进行访问。

    一般的小项目,直接 object + embed 解决了:
    <object data="***.pdf" type="application/pdf" width="400" height="600">
    <embed src="***.pdf" type="application/pdf">
    <p>当前浏览器不支持 PDF 预览,请<a href="***.pdf">下载</a>后载查看。</p>
    </embed>
    </object>
    关于   ·   帮助文档   ·   API   ·   FAQ   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   2771 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 12:03 · PVG 20:03 · LAX 05:03 · JFK 08:03
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.