Manifest V3 中的扩展程序操作

Simeon Vincent
Simeon Vincent

自推出 Chrome 扩展程序以来,该平台已允许开发者公开扩展程序 使用操作直接在顶层 Chrome 界面中执行功能。操作是一种图标按钮 在扩展程序中打开弹出式窗口或触发某些功能以前,Chrome 只支持 操作类型、浏览器操作和网页操作;Manifest V3 通过整合 功能(在新的 chrome.action API 中提供)。

扩展程序操作的简短历史记录

虽然 chrome.action 本身是 Manifest V3 中的新增功能,但其基本功能可以追溯到 到 2010 年 1 月首次发布稳定版的时间。第一个稳定版 的 Chrome 扩展程序平台版本支持两种不同的操作:浏览器 操作网页操作

浏览器操作允许扩展程序开发者在 Google Chrome 主工具栏中显示图标“ “位于地址栏右侧”(来源),并为用户提供简便的方法 以在任何网页上触发扩展程序功能。而网页操作 "表示可在当前网页上执行,但并不适用于所有网页的操作" (来源)。

多功能框中会显示网页操作(左侧),表示该扩展程序可在此网页上执行某些操作。浏览器操作(右侧)始终可见。

换言之,浏览器操作为扩展程序开发者在浏览器中提供了一个持久的界面, 而网页操作只有在扩展程序可以在当前网页上执行一些有用操作时才会显示。

这两种操作都是可选的,因此扩展程序开发者可以选择不提供 操作、网页操作或浏览器操作(不允许指定多项操作)。

大约六年后,Chrome 49 为扩展程序推出了新的界面范式。为了帮助 用户了解他们安装了哪些扩展程序,因此 Chrome 浏览器 开始向 。用户可能“溢出”根据需要将扩展程序添加到 Chrome 菜单中。

隐藏的扩展程序图标会显示在 Chrome 菜单中。

为了为每个扩展程序显示一个图标,此次更新还对 扩展程序在 Chrome 界面中的行为方式。首先,所有扩展程序都开始在工具栏中显示图标。 如果扩展程序没有图标,Chrome 会自动为其生成一个图标。第二,网页操作 移到了与浏览器操作一起显示的工具栏中,并提供了一个用于区分 他们的“节目”和“隐藏”状态。

已停用的网页操作(左侧)在工具栏中呈现为灰度图片,而已启用的页面操作(右侧)则以全彩色显示。

这项更改使网页操作附加信息可以继续按预期运行,但也减少了 网页操作的作用随时间的变化情况。重新设计用户界面的其中一项影响是,网页操作 可有效被浏览器操作所吸收。由于所有扩展程序都显示在工具栏中,因此用户前往 以为点击扩展程序的工具栏图标会调用该扩展程序,且浏览器操作 成为了越来越重要的互动渠道。

Manifest V3 变更

在 2016 年扩展程序界面推出后的几年里,Chrome 界面和扩展程序继续不断发展 重新设计,但浏览器操作和网页操作基本保持不变。也就是说,至少直到 我们开始规划如何使用 Manifest V3 对扩展程序平台进行现代化改造。

扩展程序团队已经清楚地知道,浏览器操作和网页操作越来越多地成为 也无意义。更糟糕的是,它们在行为方面存在细微差异,这使得开发者很难 来决定使用哪种格式我们意识到,如果将浏览器 操作和网页操作合并为一个“操作”。

正式推出 Action API;chrome.action 最直接类似于 chrome.browserAction, 有一些显著差异

首先,chrome.action 引入了一个名为 getUserSettings() 的新方法。此方法 让扩展程序开发者能够检查用户是否已将其扩展程序操作固定到 工具栏。

let userSettings = await chrome.action.getUserSettings();
console.log(`Is the action pinned? ${userSettings.isOnToolbar ? 'Yes' : 'No'}.`);

"getUserSettings"这项功能的名称似乎有点不同寻常 “isPinned”,但 Chrome 中的操作历史记录显示浏览器界面的变化速度 都有哪些用途因此,我们使用此 API 的目标是在 通用接口,从而最大限度地减少未来的 API 流失。它还可以让其他浏览器供应商 此 API 返回的 UserSettings 对象中的浏览器特定界面概念, 方法。

其次,您可以使用 声明式 Content API。这一点很重要,因为它可以让扩展程序响应用户的浏览 用户的行为,甚至不访问其所访问网页的网址。例如, 了解扩展程序如何在用户访问 example.com 上的网页时启用其操作。

// Manifest V3
chrome.runtime.onInstalled.addListener(() => {
  chrome.declarativeContent.onPageChanged.removeRules(undefined, () => {
    chrome.declarativeContent.onPageChanged.addRules([
      {
        conditions: [
          new chrome.declarativeContent.PageStateMatcher({
            pageUrl: {hostSuffix: '.example.com'},
          })
        ],
        actions: [new chrome.declarativeContent.ShowAction()]
      }
    ]);
  });
});

以上代码与扩展程序处理网页操作时所执行的操作几乎完全相同。唯一 不同之处在于,在 Manifest V3 中,我们使用的是 declarativeContent.ShowAction,而不是 declarativeContent.ShowPageAction

最后,内容拦截器可以使用 declarativeNetRequest API setExtensionActionOptions) 方法用于显示 特定标签页上被扩展程序屏蔽的请求。这项功能很重要 内容拦截器可确保最终用户了解相关信息,而不会暴露可能敏感的浏览元数据 。

小结

对 Chrome 扩展程序平台进行现代化改造是我们开发 Manifest V3 的主要动机之一。在许多 这意味着需要改用新技术,但也意味着要简化 API Surface; 这就是我们的目标

希望这篇帖子能帮助大家了解 Manifest V3 平台的这一特定方面。接收者 如需详细了解 Chrome 团队如何迈向浏览器扩展程序的未来,请查看 平台愿景Manifest V3 概览页面 开发者文档。您还可以在 chromium-extensions Google 群组。