pdfobject.js介绍

发布时间：2023-05-17

pdfobject.js是一个轻量级的Javascript库，用于嵌入PDF文件到网页中。因为PDF文件的格式具有广泛的支持和交互性，使其成为一种在网络上传输和共享文档的流行格式。pdfobject.js使你可以嵌入PDF文件到网页中，而无需使用嵌入式PDF插件或其他附加的软件。该库支持本地和远程PDF文件，并且可以控制其外观和功能。本文将深入阐述pdfobject.js的使用方法和功能。

一、pdfobject.js下载

pdfobject.js可以通过以下方式来下载和使用：

<script type="text/javascript" src="pdfobject.js"></script>

你可以下载pdfobject.js到本地并将其链接到你的HTML文件中。或者，你可以使用CDN来引用该文件：

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfobject/2.1.1/pdfobject.min.js"></script>

以上列举的CDN是比较常见的，你也可以选择其他的CDN。

二、pdfobject.js pdfOpenParams

pdfOpenParams是一个开放式参数，可以用来设置pdfobject.js中嵌入的PDF文件的打开方式和常见的PDF查看器选项。以下是一些最常见的pdfOpenParams选项和其功能描述：

<div id="pdf-container"></div>
<script type="text/javascript">
  var options = {
    pdfOpenParams: {
      //启用翻书效果
      navpanes: 1,
      toolbar: 1,
      statusbar: 1,
      view: "FitH",
      pagemode: "thumbs",
      page: 1
    }
  };
  PDFObject.embed("example.pdf", "#pdf-container", options);
</script>

三、pdfobject.js 打印

在pdfobject.js中，你可以使用JavaScript代码来控制PDF文件的打印。以下是一个简单的示例代码，用于在嵌入PDF文件时控制打印选项：

//演示pdfobject.js使用JavaScript控制PDF打印
var myPDF = new PDFObject({
  url: "example.pdf",
  pdfOpenParams: {
    view: "FitV",
    pagemode: "none",
    scrollbar: "1",
    toolbar: "1",
    statusbar: "1",
    messages: "0",
    navpanes: "1"
  }
}).embed("pdf-viewer");
myPDF.get("pdf").print();

在这个示例中，我们使用myPDF.get("pdf").print()方法调用PDF对象的打印功能。这使得PDF文件可以在不使用浏览器内置的打印功能的情况下进行打印的控制。

四、pdfobject.js 工具栏

pdfobject.js提供了一个简单的方法来隐藏PDF文件的工具栏和其他控件。下面是一个示例代码：

//演示pdfobject.js隐藏PDF文件工具栏的方式
PDFObject.embed("example.pdf", "#pdf-container", {
  pdfOpenParams: {
    toolbar: "0"
  }
});

在这个示例中，我们使用pdfOpenParams选项设置了toolbar为"0"以隐藏工具栏。

五、pdfobject.js 不能调用print

有时候，你可能希望禁止PDF文件的打印或其他交互功能。pdfobject.js可以满足这个需求，下面是一个示例代码，用于在pdfobject中禁止打印选项：

//演示pdfobject.js禁止打印选项的方式
PDFObject.embed("example.pdf", "#pdf-container", {
  pdfOpenParams: {
    print: "0",
  }
});

在这个示例中，我们使用pdfOpenParams选项将print设置为"0"以禁止打印选项。

六、pdfobject.js限制下载

你可以在pdfobject.js中设置下载选项以控制PDF文件的下载。下面是一个示例代码：

//演示pdfobject.js设置限制下载
PDFObject.embed("example.pdf", "#pdf-container", {
  pdfOpenParams: {
    scrollbar: "1",
    toolbar: "1",
    download: "0"
  }
});

在这个示例中，我们使用pdfOpenParams选项将download设置为"0"以禁止下载。

七、pdfobject.js 禁止下载功能

你也可以使用以下示例中列出的代码显示一个禁止下载功能的替代文本（在不支持PDF文件嵌入的浏览器中），而不是嵌入PDF文件。下面是一个示例代码：

//演示用禁止下载功能的文本替代pdf文件
PDFObject.embed(
  "example.pdf",
  "#pdf-container",
  {
    fallbackLink: "<p>Your browser does not support PDFs. <a href='example.pdf'>Download the PDF</a> instead.</p>",
    forcePDFJS: true,
    PDFJS_URL: "pdfobject.js"
  }
);

在这个示例中，我们使用了pdfobject.js的fallbackLink选项来显示替代文本，在不支持PDF文件嵌入的浏览器中使用的PDF.js轻量级渲染器。

总结

pdfobject.js是一个轻量级的Javascript库，可以帮助你将PDF文件嵌入到网页中。它通过一系列的选项和参数，允许你控制PDF文件在网页中的外观和行为。通过在你的HTML代码中嵌入pdfobject.js，你可以将一个PDF文件转化成一个与网页中其他元素无异的嵌入式对象。

推荐文章