在 Google 文档中创建智能芯片,以实现链接预览功能

十二月 19, 2023
Chanel Greco Developer Advocate Google Workspace

今年早些时候,我们宣布在 Google 文档中全面支持第三方智能芯片功能。这意味着,您可以直接在 Google 文档中添加、查看来自第三方应用的关键信息,并与之互动。AsanaAtlassianFigmaLoomMiroTableauWhimsical 在内的多个合作伙伴已经创建了智能芯片,以便用户开始将应用中的内容直接嵌入到文档中。Google Workspace 的 Google 开发者专家兼业余开发者 Sourabh Choraria 在 Google Workspace Marketplace 上发布了一个名为“链接预览”的第三方智能芯片解决方案。用户可借助该应用从多个常用的 SaaS 工具中获取信息,并将其添加至 Google 文档中。

在这篇博文中,您将了解如何创建自己的智能芯片以用于 Google 文档。

image1
为预览事件管理系统中的信息而创建的智能芯片的示例

了解用于第三方服务的智能芯片的工作原理

第三方智能芯片是通过 Google Workspace 插件来驱动的,并且可以发布到 Google Workspace Marketplace 上。管理员或用户能够从市场中安装这些插件。安装成功后,插件将会出现在 Google 文档界面右侧的侧边栏中。

Google Workspace 插件能够检测第三方服务的链接,并提示 Google Docs 用户预览这些链接。这意味着您可以为任何具有公开可访问网址的第三方服务创建智能芯片。您可以配置插件以预览多个网址模式,例如支持请求链接、销售潜在客户链接、员工档案链接等。此预览功能是在插件的清单文件中配置的。

{
  "timeZone": "America/Los_Angeles",
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",
  "oauthScopes": [
    "https://www.googleapis.com/auth/workspace.linkpreview",
    "https://www.googleapis.com/auth/script.external_request"
  ],
  "addOns": {
    "common": {
      "name": "Preview Books Add-on",
      "logoUrl": "https://developers.google.com/workspace/add-ons/images/library-icon.png",
      "layoutProperties": {
        "primaryColor": "#dd4b39"
      }
    },
    "docs": {
      "linkPreviewTriggers": [
        {
          "runFunction": "bookLinkPreview",
          "patterns": [
            {
              "hostPattern": "*.google.*",
              "pathPrefix": "books"
            },
            {
              "hostPattern": "*.google.*",
              "pathPrefix": "books/edition"
            }
          ],
          "labelText": "Book",
          "logoUrl": "https://developers.google.com/workspace/add-ons/images/book-icon.png",
          "localizedLabelText": {
            "es": "Libros"
          }
        }
      ]
    }
  }
}

清单文件包含 Google 图书 API 的网址模式

智能芯片会显示链接内容的图标、简短标题或描述。当用户鼠标悬停在芯片上时,会弹出一个卡片式的界面,其中包含关于文件或链接详细信息的预览。您可以自定义用户鼠标悬停在智能芯片上时显示的卡片界面。如要构建卡片界面,您可以使用 Widget 来呈现有关链接的信息。您还可以设计操作,让用户能够打开链接或修改内容。若要了解用于预览卡片的所有支持组件列表,请查阅开发者文档。

函数 getBook(id) {
// 从 Google 图书 API 获取数据的代码
}
 
函数 bookLinkPreview(event) {
 if (event.docs.matchedUrl.url) {
// 通过 getBook (id) 获取相关数据并用于构建智能芯片和卡片
 
    const previewHeader = CardService.newCardHeader()
      .setSubtitle('By ' + bookAuthors)
      .setTitle(bookTitle);
 
    const previewPages = CardService.newDecoratedText()
      .setTopLabel('Page count')
      .setText(bookPageCount);
 
    const previewDescription = CardService.newDecoratedText()
      .setTopLabel('About this book')
      .setText(bookDescription).setWrapText(true);
 
    const previewImage = CardService.newImage()
      .setAltText('Image of book cover')
      .setImageUrl(bookImage);
 
    const buttonBook = CardService.newTextButton()
      .setText('View book')
      .setOpenLink(CardService.newOpenLink()
        .setUrl(event.docs.matchedUrl.url));
 
    const cardSectionBook = CardService.newCardSection()
      .addWidget(previewImage)
      .addWidget(previewPages)
      .addWidget(CardService.newDivider())
      .addWidget(previewDescription)
      .addWidget(buttonBook);
 
    return CardService.newCardBuilder()
    .setHeader(previewHeader)
    .addSection(cardSectionBook)
    .build();
  }
}

这便是用于创建智能芯片的应用脚本代码。

image2
智能芯片在鼠标悬停状态下的表现。显示的数据是从用户粘贴的 Google 开发者博文网址处获取的。

如需详细了解本文中使用的代码,请查看“使用智能芯片的 Google 图书预览链接”示例教程。

如何为插件选择技术

在构建用于链接预览的智能芯片时,您可以选择两种不同的技术来创建插件:Google Apps Script 或替代运行时。

Apps Script 是一个内置于 Google Workspace 中的快速应用开发平台。Apps Script 不需要预先配置开发环境,因此这一特性使得该平台成为原型设计和验证智能芯片解决方案的理想选择。但 Apps Script 不仅可用于原型设计,许多开发者还选择使用该平台来创建 Google Workspace 插件,进而将插件发布到 Google Workspace Marketplace 上,供用户安装使用。

如果您希望使用 Apps Script 创建智能芯片,请观看下方的视频教程。该教程展示了如何逐步在 Google 文档中构建用于链接预览的智能芯片。如要获取视频教程中所使用的代码,请参阅“使用智能芯片预览来自 Google 图书的链接”示例页面。

Link to Youtube Video (visible only when JS is disabled)

如果您倾向于使用自己的开发环境、编程��言、托管服务、软件包等条件创建 Google Workspace 插件,那么替代运行时是您的不二之选。您可以在多种编程语言中进行挑选,比如 Node.js、Java、Python 等。���要���行时代码能够以公共 HTTP 端点的形式对外公开,插件运行时代码的托管可以位于任何云或本地基础设施上。您可以查阅开发者文档,详细了解如何使用替代运行时来创建智能芯片。

如何与他人分享插件

您可以通过 Google Workspace Marketplace 将插件分享给其他人。假设您想为您的团队提供智能芯片解决方案,那么您可以在您的 Google Workspace 组织内部发布这个插件,这通常被称为“专用应用”。另一方面,如果您希望任何拥有 Google 账号的人都可以使用您的插件,您可以选择将其作为“公开应用”发布。

如要详细了解如何在 Google Workspace Marketplace 上发布应用,您可以观看此视频,了解发布过程的具体步骤。

开始构建

您可以在开发者文档中了解有关创建智能芯片以实现链接预览功能的更多信息。该文档包含更多详细信息和代码示例,您可以基于这些资料来构建自己的解决方案。我们迫不及待地想看看您构建的智能芯片解决方案。