Skip to content

ComPDF Salesforce SDK 集成

作为 Lightning Web 组件集成到新的 Salesforce 项目中

本指南将帮助您将 WebViewer 集成到 Salesforce Lightning 组件中。它将帮助您克隆 Salesforce 示例存储库,并向您展示如何将 WebViewer 集成为 Lightning Web 组件。

先决条件

  • Node.js 和 NPM 的最新稳定版本
  • ComPDF 许可证密钥
  • Salesforce 开发环境

获取您的许可证密钥

运行 WebViewer 需要许可证密钥。您可以参考我们的要求来获取许可证密钥。

设置 Salesforce 开发环境

有关设置 Salesforce 开发环境的分步帮助,请按照设置开发指南设置开发 Trailhead 模块中的说明进行操作。这些步骤包括:

将软件包部署到您的 Salesforce

要将 ComPDF Web SDK 包部署到您的 Salesforce 组织,请按照以下步骤操作。

  1. 从 GitHub 仓库克隆 ComPDF Salesforce SDK 项目:

    bash
    git clone https://github.com/ComPDFKit/compdf-web-example-salesforce.git
  2. 在终端中,转到 ComPDF Salesforce SDK 项目文件夹并运行以下命令来安装 npm 模块。

    bash
    npm install
  3. ComPDF Salesforce SDK 集成示例现在利用了我们位于 https://static.compdf.com 的服务器提供的 ComPDF Web SDK,这意味着它不再受 Salesforce 的上传资产大小 5MB 限制。

  4. ./force-app/main/default/lwc/compdfViewer/compdfViewer.js 文件中,将您的 ComPDF 许可证密钥添加到 licenseKey 属性值中。

    js
    licenseKey = 'YOUR_LICENSE_KEY'
  5. 如果您尚未这样做,请向您的目标组织进行身份验证并为其提供别名(以下命令中的 “DevHub” ):

    bash
    sf org login web --set-default-dev-hub --alias DevHub
  6. 在打开的浏览器中,输入您的 Dev Hub 组织凭据。成功登录后,您可以关闭浏览器。使用 config/project-scratch-def.json 文件创建一个临时组织,将用户名设置为默认用户名,并为其分配一个别名(以下命令中的 “myScratchOrg” )。

    bash
    sf org create scratch --definition-file config/project-scratch-def.json --set-default --target-dev-hub DevHub --alias myScratchOrg
  7. 将应用程序推送到您的临时组织:

    bash
    sf project deploy start --source-dir force-app --target-org myScratchOrg --concise
  8. 打开您的临时组织:

    bash
    sf org open --target-org myScratchOrg
  9. (可选)如果您需要上传/保存大文件(超过6MB),建议将您的 Access Token 添加到 ./force-app/main/default/lwc/compdfViewer/compdfViewer.js 文件的 accessToken 属性值中。可以使用以下命令查看您的组织信息,以获取 Access Token

    bash
    sf org display --target-org myScratchOrg
    js
    accessToken = 'YOUR_ACCESS_TOKEN'

接下来,我们仍然需要在您的 Salesforce 组织设置中做一些配置。

更改安全设置

ComPDF Salesforce SDK 示例使用了我们第三方服务器提供的资源包,因此需要在 Salesforce 中添加受信任的 URL。要更改默认安全设置,请按照以下步骤操作。

  1. 在 Salesforce 中,转到 “安全” > “受信任的 URL”

  2. 单击 “新建可信 URL”

  3. 配置 URL 属性:

    • 自定义一个 API 名称 ,例如 “ComPDF”
    • URL 输入框中写入以下 URL。
    https://static.compdf.com
    • 确保 “启用” 属性已勾选,并勾选所有 CSP 指令
  4. 单击 “保存”

在 Salesforce 中使用 ComPDF Web SDK

现在,您可以在已打开的临时组织中使用 ComPDF Web SDK:

  1. 点击左上角的应用启动器图标,然后选择 ComPDF 。然后您应该看到应用程序启动。

ComPDF App

  1. 单击浏览以上传本地 PDF 文件,或从 Salesforce 打开文件。

WebViewer