打开文档

ComPDF 支持打开各种数据类型的 PDF 文档，包括 URL、File、Blob、ArrayBuffer 和 Base64 类型。创建查看器时用 initialDoc 传入文档，或之后用 instance.UI.loadDocument() 加载。Base64 数据以 data:application/pdf;base64,... 形式的 URL 传入。

此示例演示如何打开文档：

URL

import ComPDFKitViewer from "@compdfkit_pdf_sdk/webviewer";

const viewer = document.getElementById('webviewer');
ComPDFKitViewer({
  path: '/',
  initialDoc: 'https://www.example.com/test.pdf',
  licenseKey: 'Input your license here'
}, viewer)
  .then((instance) => {
    const { documentViewer } = instance.Core;
    const { UI } = instance;
    documentViewer.addEventListener('documentLoaded', async () => {
      console.log('Document Loaded');
    })

    UI.loadDocument('https://www.example.com/test.pdf')
  });

Blob

import ComPDFKitViewer from "@compdfkit_pdf_sdk/webviewer";

const viewer = document.getElementById('webviewer');
ComPDFKitViewer({
  path: '/',
  initialDoc: blobData,
  licenseKey: 'Input your license here'
}, viewer)
  .then((instance) => {
    const { documentViewer } = instance.Core;
    const { UI } = instance;
    documentViewer.addEventListener('documentLoaded', async () => {
      console.log('Document Loaded');
    })

    UI.loadDocument(blobData, {
      filename: 'test.pdf'
    })
  });

ArrayBuffer

import ComPDFKitViewer from "@compdfkit_pdf_sdk/webviewer";

const viewer = document.getElementById('webviewer');
ComPDFKitViewer({
  path: '/',
  initialDoc: buffer,
  licenseKey: 'Input your license here'
}, viewer)
  .then((instance) => {
    const { documentViewer } = instance.Core;
    const { UI } = instance;
    documentViewer.addEventListener('documentLoaded', async () => {
      console.log('Document Loaded');
    })

    UI.loadDocument(buffer, {
      filename: 'test.pdf'
    })
  });

Base64

import ComPDFKitViewer from "@compdfkit_pdf_sdk/webviewer";

const viewer = document.getElementById('webviewer');
ComPDFKitViewer({
  path: '/',
  initialDoc: `data:application/pdf;base64,${base64Data}`,
  licenseKey: 'Input your license here'
}, viewer)
  .then((instance) => {
    const { documentViewer } = instance.Core;
    const { UI } = instance;
    documentViewer.addEventListener('documentLoaded', async () => {
      console.log('Document Loaded');
    })

    UI.loadDocument(`data:application/pdf;base64,${base64Data}`, {
      filename: 'test.pdf'
    })
  });