入门指南
福昕 PDF SDK Web 版是一款高性能、可定制的 JavaScript 库，为 Web 应用提供流畅、精准、稳定的 PDF 处理能力。它能够轻松集与各种 JavaScript 框架集成，仅需一个 DOM 元素即可加载功能强大的文档查看器。开箱即用的预构建的示例和灵活的 API 让开发者能够快速上手，实现高效集成，同时兼容不同的 Web 开发环境，提供流畅的用户体验和强大的 PDF 交互能力。
下载 SDK
- 官方网站下载： 访问福昕官方网站，选择并下载适合您项目需求的 SDK 版本。
- npm 下载： 点击 这里 访问 SDK 仓库。
示例工程
快速集成
包目录结构说明
软件包变更说明
在 10.0 版本之前，福昕 PDF SDK Web 版提供了以下三种软件包，以满足不同用户的需求：
- 无字体标准包 (FoxitPDFSDKForWeb_x_xxx_NoFonts.zip):
- 此版本不包含任何字体资源，适用于用户已拥有字体资源或仅需使用在线字体的情况。
- 其优势在于软件包体积较小。
- 标准包 (FoxitPDFSDKForWeb_x_xxx.zip):
- 此版本包含完整的字体资源，方便用户直接使用，无需额外配置。
- 适用于对字体库无特殊要求，且不介意软件包体积的用户。
- 完整包 (FoxitPDFSDKForWeb_x_xxx_Full.zip):
- 此版本在标准包的基础上，增加了文档比较、高级编辑和动态 XFA 等高级功能。
- 适用于需要使用高级功能的用户。
重要更新：
自 10.0 版本起，福昕 PDF SDK Web 版进行了重大更新，简化了软件包结构，仅提供以下完整包：
- 完整包 (FoxitPDFSDKForWeb_x_xxx.zip):
- 此版本整合了之前完整包的所有功能，并新增了 3D 功能的支持。
- 通过模块授权方式，根据用户的需求加载相应的功能模块，使用户可以更加灵活的选择需要使用的功能。
- 此更新旨在提供更全面的功能和更灵活的使用体验。
包目录结构
| 文件夹/文件 | 描述 |
|---|---|
| docs | 包含API手册和Foxit PDF SDK for Web的开发手册。 注意：HTML版本的开发者指南是使用VuePress构建的，不支持双击直接打开。需要启动HTTP服务器并通过Web浏览器访问。此外，其包括一些可运行的示例，需要启用WebPDFJRWorker.js，以便在支持HTTP服务器的环境中正确运行。 |
| examples | 一系列 demo 和示例，用来说明如何充分使用 福昕 PDF SDK Web 版功能。 |
| external | 字体资源。 |
| lib | 福昕 PDF SDK Web 版核心库。 |
| server | Web viewer 中使用的一系列基于服务器的应用程序所需的 http-server 和 Node.js 脚本。 |
| legal.txt | 法律和版权信息。 |
| package.json | 项目描述文件。 |
lib 文件夹包括如下的文件：
| 文件夹/文件 | 描述 |
|---|---|
| jr-engine | 前端渲染引擎。 |
| locales | 支持的国际化语言。不同语言的资源文件按标签放置在不同的目录下。 |
| PDFViewCtrl | PDFViewCtrl 库附加的 plugin。 |
| stamps | Stamp 资源文件，图片文件和模板。 |
| assets | 包含文档比较功能需要用到的模板资源文件，当前仅在完整包中包含此目录。 |
| uix-addons | UIExtension 库附加的 plugin。 |
| PDFViewCtrl.css | PDFViewCtrl viewer UI 样式的 CSS 文件。 |
| PDFViewCtrl.full.js | PDFViewCtrl viewer 库的完整脚本文件。 |
| PDFViewCtrl.js | 无第三方库的 PDFViewCtrl viewer 库的脚本文件。 |
| PDFViewCtrl.polyfills.js | PDFViewCtrl 所依赖的 polyfill 脚本文件，用于兼容不同的浏览器。 |
| PDFViewCtrl.vendor.js | PDFViewCtrl 所使用的第三方库 (列表见后文)。 |
| preload-jr-worker.js | 用于并行加载 JS 引擎资源以提升 viewer 加载速度的 worker 脚本文件。 |
| UIExtension.css | UI 样式默认的 CSS 文件。 |
| UIExtension.dark-variable.css | 用于暗黑主题的样式文件。 |
| UIExtension.vw.css | 使用 vmin unit 的 CSS 文件。 |
| UIExtension.full.js | UIExtension viewer 库的完整脚本文件。 |
| UIExtension.js | 无第三方库的 UIExtension viewer 库的脚本文件。 |
| UIExtension.polyfills.js | UIExtension 所依赖的 polyfill 脚本文件，用于兼容不同的浏览器。 |
| UIExtension.vendor.js | UIExtension 所使用的第三方库 (列表见后文)。 |
| WebPDFJRWorker.js | Web Worker 中运行的脚本，用来调用前端渲染引擎。 |
| WebPDFSRWorker.js | Web Worker 中运行的脚本，用来调用服务器端渲染引擎。 |
| *.d.ts | "d.ts"文件用于为TypeScript 提供有关用JavaScript 编写的API 的类型信息，目的在于让 IDE 能够识别它并提供代码提示，以及在编译时执行静态类型检查。在提供便利的同时也保证了接口调用的准确性。 |
静态库与动态库
v10.0 版本之前：静态库
- 旧版福昕 PDF SDK Web 版使用静态库，即将所有功能打包成一个大型 .wasm 文件。
- 缺点是随着功能增加，文件体积变大，导致首次加载时间较长。
- 优点是一次加载后，后续使用无需再次加载。
v10.0 版本起：动态库
- 新版福昕 PDF SDK Web 版采用动态库，将功能按模块拆分编译。
- 首次加载仅需加载主模块（基础功能如渲染），显著缩短初始加载时间。
- 其他功能模块在使用时按需加载，优化了资源利用和加载性能。
动态库模块划分
动态库模块被细分为核心主模块和按需加载的侧模块，以优化性能和资源利用。
核心主模块:
gsdk.wasm
侧模块: (按需加载)
- compare.wasm
- pageeditor.wasm
- touchup.wasm
- xfa.wasm
- 3d.wasm
- lr.wasm
- Pageformat.wasm
- docprocess.wasm
以下是模块功能及依赖列表：
| 模块名 | 功能 | 依赖 |
|---|---|---|
| gsdk.wasm | 提供基础 PDF 功能以及 Redact（密文编辑）功能。 | pageformat.wasm lr.wasm docprocess.wasm optimizer.wasm |
| compare.wasm | Overlay Compare功能依赖该模块。 | lr.wasm |
| pageeditor.wasm | 支持 Paragraph-based editor（高级段落编辑器）功能。 | lr.wasm |
| touchup.wasm | 为高级编辑器的 EditText（编辑文本）和 AddText（添加文本）功能提供支持。 | lr.wasm |
| xfa.wasm | 支持动态 XFA 表单功能。 | lr.wasm |
| 3d.wasm | 支持 PDF 3D 内容的显示和交。 | 无 |
| optimizer.wasm | 支持数字图章功能。块。 | 无 |
| lr.wasm | Layout Recognition engine（布局识别引擎），为高级功能提供底层支持，当触发依赖的相关模块时，它将被加载。 | 无 |
| Pageformat.wasm | 支持 Header&Footer（页眉页脚）和 Watermark（水印）功能。 | 无 |
| docprocess.wasm | 支持表单识别功能。 | 无 |
第三方库说明
福昕 PDF SDK Web 版提供了两种版本的 JS 文件：包含第三方库的完整版本的 JS 文件和不包含第三方库的常规的 JS 文件。如果您的工程已经使用了 SDK 中包含的第三方库，那么您不需要再安装该库。
PDFViewCtrl.full.js 脚本包含：
- PDFViewCtrl.full.js: PDFViewCtrl viewer 库的完整脚本文件。
- PDFViewCtrl.polyfills.js: PDFViewCtrl 所依赖的 polyfill 脚本文件，用于兼容不同的浏览器。
- PDFViewCtrl.vendor.js: PDFViewCtrl所使用的第三方库 (列表见后文)。
- PDFViewCtrl.js: 无第三方库的 PDFViewCtrl viewer 库的脚本文件。
因此，PDFViewCtrl.polyfills.js + PDFViewCtrl.vendor.js + PDFViewCtrl.js = PDFViewCtrl.full.js.
以下两种形式是等效的：
html
<script src="../FoxitPDFSDKForWeb/lib/PDFViewCtrl.full.js"></script>和
html
<script src="../FoxitPDFSDKForWeb/lib/ PDFViewCtrl.polyfills.js"></script>
<script src="../FoxitPDFSDKForWeb/lib/PDFViewCtrl.vendor.js"></script>
<script src="../FoxitPDFSDKForWeb/lib/PDFViewCtrl.js"></script>PDFViewCtrl.vendor.js 包含的第三方库如下所示：
html
jquery
i18next
i18next-chained-backend
i18next-localstorage-backend
i18next-xhr-backend
jquery-contextmenu
dialog-polyfill
hammerjs
eventemitter3UIExtension.full.js脚本包含:
- UIExtension.full.js: UIExtension viewer 库的完整脚本文件。
- UIExtension.polyfills.js: UIExtension 所依赖的 polyfill 脚本文件，用于兼容不同的浏览器。
- UIExtension.vendor.js: UIExtension 所使用的第三方库 (列表见后文)。
- UIExtension.js: 无第三方库的 UIExtension viewer 库的脚本文件。
因此， UIExtension.polyfills.js + UIExtension.vendor.js + UIExtension.js = UIExtension.full.js.
以下两种形式是等效的：
html
<script src="../FoxitPDFSDKForWeb/lib/UIExtension.full.js"></script>和
html
<script src="../FoxitPDFSDKForWeb/lib/UIExtension.polyfills.js"></script>
<script src="../FoxitPDFSDKForWeb/lib/UIExtension.vendor.js"></script>
<script src="../FoxitPDFSDKForWeb/lib/UIExtension.js"></script>UIExtension.vendor.js 包含的第三方库如下所示：
html
jquery
i18next
i18next-chained-backend
i18next-localstorage-backend
i18next-xhr-backend
dialog-polyfill
hammerjs
eventemitter3
file-saver