pspdfkit web example pwa

pspdfkit用於網絡示例-PWA

此示例顯示瞭如何集成Web的PSPDFKIT並創建PWA（漸進Web應用程序）。

您可以在此處查看實時預覽：pspdfkit.com/pwa。

該示例應用程序具有基本的PWA設置，包括清單和服務工作者，允許您的應用程序脫機以及PDF的索引DB存儲。這樣，即使關閉瀏覽器後，您的文件也會持續。

在此示例中，我們使用Workbox，這是Google流行的PWA框架。

先決條件

• node.js
• Web許可證的PSPDFKIT。如果您還沒有一個，則可以在此處要求免費試用。

支持，問題和許可問題

PSPDFKIT通過https://pspdfkit.com/support/request/為客戶提供主動SDK許可證的客戶支持

您在評估我們的SDK嗎？太好了，我們很樂意提供幫助！為了確保這很快，請使用一封工作電子郵件，並讓您公司的某人填寫我們的銷售表：https：//pspdfkit.com/sales/

入門

克隆回購：

git clone https://github.com/PSPDFKit/pspdfkit-web-example-pwa.git
cd pspdfkit-web-example-pwa

使用npm安裝項目依賴性：

npm install

現在已經安裝了所有內容，我們需要配置該應用程序以將我們的PSPDFKIT用於Web License密鑰。

編輯./config/license-key ，然後用您通過電子郵件收到的許可證密鑰替換字符串YOUR_LICENSE_KEY_GOES_HERE 。

運行示例

我們準備啟動該應用程序！ ？

在開發模式下運行應用程序：

npm run start

建立生產工件

要構建生產版本，只需遵循以上指南，而不是運行start ：

npm run build

然後，構建腳本將創建一個名為./dist的文件，您可以將其複製到Web服務器AS-IS。

它如何工作

在./src下，您可以找到一個簡單的應用程序外殼，該殼為Web加載PSPDFKIT。

該申請使用服務人員為大多數資產提供離線支持和預處理。

為了減少樣板的數量，我們使用工作箱 - Google的圖書館，該圖書館抽象了與服務工作者創建和配置相關的一些冗長。

我們還使用Google的另一個庫Wookbox-CLI在運行npm start時自動為我們的ServiceWorker Pre-Cache生成清單文件。您可以在./src/workbox-config.js中找到此配置文件。

為了允許PDF在本地持續存在，因此不需要再次下載它們，我們已經創建了PSPDFKitFileStore庫。它在引擎蓋下使用了稱為idb的IndexEdDB API周圍使用輕巧且具有Promise的包裝器。該代碼旨在獨立於PWA示例工作，也可以在Internet Explorer 11中使用。

移動支持

如果您嘗試遠程連接到本地開發服務器，您會很快看到PWA無法正常工作。這是由於PWA API需要有效的SSL/TLS證書才能正常運行，因此您可能在本地沒有此設置。

為了獲得更好的體驗，我們建議您查看託管的PWA示例或將生產構建部署到自己的服務器。

執照

該軟件是根據修改後的BSD許可證獲得許可的。

貢獻

請確保您已經簽署了我們的CLA，以便我們可以接受您的貢獻。