`

在线预览插件--pdf.js

 
阅读更多

最近项目开发需要在线预览pdf文件,网上找了很多插件,最终选择了pdf.js插件,pdf.js是一个技术原型,主要用于在 HTML5 平台上展示 PDF 文档,无需任何本地技术支持,以下是它的使用方法,仅供大家参考。

 

pdf.js下载地址:http://mozilla.github.io/pdf.js/

 

demo地址:http://mozilla.github.com/pdf.js/web/viewer.html

 

http://mozilla.github.io/pdf.js/下载构建好的例子如下:

将构建好的文件放到tomcat下,启动tomca服务,就可以通过以下地址访问:

 

http://localhost:8080/web/viewer.html

 

效果如下:

构建目录web/viewer.html主要是渲染pdf阅读器的样式,而web/viewer.js则是指定打开的pdf文件,我们看 web/viewer.js的一段代码:

 再看下面这段代码:

从上面可以看出通过传递file形参来动态指定打开的pdf文件,如果没有传递file,那么打开默认的pdf文件,写法如下:

 

http://localhost:8080/web/viewer.html?file=helloworld.pdf 

 

 注:项目当中有跨域读取pdf的问题,pdf.js只能读取同一个域里的pdf,最好是先用后台读取跨域的pdf流,写到前台,pdf.js读取该后台方法获取流显示。

 

 

分享到:
评论
1 楼 18335864773 2018-02-27  
用 pageoffice 组件在线打开 pdf 文件把.

相关推荐

    pdf.JS-前端无需跳转在线预览pdf功能

    PDF.JS是一个强大的开源JavaScript库,由Mozilla基金会维护,它允许在浏览器中直接查看PDF文档,无需依赖任何插件或第三方服务。这个功能对于提升用户体验非常有用,因为用户可以在前端直接预览PDF文件,无需跳转到...

    pdfjs-2.9.359-legacy-dist.zip

    PDF.js 是一个由 Mozilla 维护的开源项目,主要用于在 Web 浏览器中渲染 PDF 文档,无需依赖任何插件。它提供了高质量且可定制的 PDF 预览功能,广泛应用于各种 Web 应用场景,如在线文档查看、电子阅读器等。"pdfjs...

    pdf.js前端插件,用于在线预览pdf文件

    这个插件使得用户无需安装任何桌面软件就能在线预览PDF文件,极大地提升了网页应用的用户体验。下面我们将详细探讨PDF.js的核心功能、使用方法以及相关知识点。 1. **核心功能**: - **跨平台支持**:PDF.js支持...

    pdf.js-master.zip_pdf-master_pdf.js-master_pdfjs_pdf文件预览

    4. **离线预览**:由于 PDF.js 是纯 JavaScript 库,所以用户可以在线预览 PDF,也可以选择离线下载后在本地进行预览。 5. **安全性**:由于不依赖 Flash 或其他第三方插件,PDF.js 在安全方面更有优势,减少了因...

    pdfjs-2.6.347-dist.zip

    PDF.js 是一个开源的JavaScript库,由Mozilla基金会维护,用于在Web浏览器中渲染PDF文档,无需依赖任何外部插件。这个库的目标是提供一个纯Web技术解决方案,使得用户能够在任何支持HTML5的浏览器中查看PDF文件,...

    pdf.js-gh-pages.zip

    这个“pdf.js-gh-pages”压缩包文件很可能包含了该项目的 GitHub Pages 版本,用于在线预览 PDF 文件。让我们深入探讨一下 PDF.js 的核心功能、工作原理以及如何使用它来实现 PDF 在线预览。 **1. PDF.js 简介** ...

    js在线预览wordpdf.rar

    "js在线预览wordpdf.rar"这个资源提供了一种利用JavaScript技术实现在线预览这两种常见文档的解决方案。以下将详细讲解涉及的技术和知识点: 1. PDF在线预览: - **PDF.js**:这是一个由Mozilla开发的开源库,专门...

    小程序预览PDF文件插件Pdf.js

    本文将详细介绍如何使用"小程序预览PDF文件插件Pdf.js",以及在Uniapp框架中实现PDF预览的步骤。 Pdf.js是由Mozilla开发的一款开源JavaScript库,它允许在Web浏览器中直接预览PDF文件,而无需依赖任何其他第三方...

    PDF.jsPDF文件在线预览

    在这个场景中,我们讨论的是如何利用PDF.js实现PDF文件的在线预览功能。 首先,我们需要理解HTML的`<iframe>`标签。`<iframe>`(Inline Frame)是HTML中用于嵌入另一个源文档的元素,可以用来加载HTML、XML、SVG或...

    pdf.js Demo 纯js实现PDF在线预览及打印

    PDF.js是Mozilla开发的一个开源项目,它允许开发者使用纯JavaScript在Web浏览器中渲染PDF文档,无需依赖任何插件。这个Demo展示了如何利用PDF.js库实现PDF在线预览和打印功能,同时还提供了页面缩放和打开本地PDF...

    pdfjs-2.4.456-dist.zip

    PDF.js 是一个由 Mozilla 维护的开源项目,它的主要目标是实现 PDF 文件在 Web 浏览器中的高质量渲染,无需依赖任何插件。在这个"pdfjs-2.4.456-dist.zip"压缩包中,包含了实现这一功能的核心库和相关资源。 标题 ...

    pdf.js和pdf.worker.js

    PDF.js是Mozilla开发的一个开源项目,它允许在Web浏览器中以纯JavaScript实现PDF文档的解析和渲染,无需依赖任何插件。这个框架充分利用了HTML5技术,尤其是Canvas元素,为用户提供了一种在网页上查看PDF文件的新...

    pdf.js pdf在线预览组件,支持IE,chrome

    PDF.js是Mozilla开发的一个开源JavaScript库,主要用于在Web浏览器中实现PDF文档的高质量预览,无需依赖任何插件。这个库的设计目标是提供一个跨平台、跨浏览器的解决方案,使得用户能够在任何支持HTML5 Canvas的...

    前端项目-pdf.js.zip

    PDF.js 是一个由 Mozilla 团队开发的开源 JavaScript 库,专门用于在浏览器环境中渲染 PDF 文档。这个项目的目标是提供一种跨平台、无需插件的解决方案,让用户能够在 Web 上流畅地查看 PDF 文件。前端项目 "前端...

    pdfjs-2.2.228-dist.zip

    使用PDF.js时,开发者通常会将`web`目录的内容部署到服务器,并通过HTML和JavaScript引用相应的资源来实现PDF的在线预览。此外,由于PDF.js支持自定义,因此可以根据项目需求进行配置,如改变UI样式、添加自定义功能...

    openoffice实现文件预览的jar及pdf.js

    在实现文件预览时,前端部分通常会使用JavaScript库,这里提到的"pdf.js"就是Mozilla开发的一个开源项目,专门用于在浏览器中渲染PDF文件。PDF.js通过解析PDF文件并将其转换为HTML5 Canvas元素显示,从而实现无插件...

    全站PDF预览插件-PDFjs插件

    通过JavaScript和WebGL技术,PDF.js能够解析PDF文件并将其渲染成高质量的网页元素,使得用户可以流畅地在线预览PDF文档。 在"全站PDF预览插件-PDFjs插件"中,开发者已经对PDF.js进行了优化和包装,使其更易于在各种...

    web在线查看PDF文件 PDF.JS

    PDF.js是Mozilla开发的一个开源JavaScript库,专门用于在Web浏览器中查看PDF文件,无需依赖任何外部插件。这个库的设计目标是提供一个跨平台、安全且高性能的解决方案,让用户能够无缝地在线预览PDF文档。它完全基于...

Global site tag (gtag.js) - Google Analytics