Chrome 插件 tabs API 解析

Chrome.tabs API 解析

使用 chrome.tabs API 与浏览器的标签页系统进行交互,可以使用此 API 在浏览器中创建、修改和重新排列标签页

Tabs API 不仅提供操作和管理标签页的功能,还可以检测标签页的语言、截取屏幕截图,以及与标签页的内容脚本进行通信

Service Worker 和 action 页面可以使用 Tabs API,但 content script 中不能使用

一、各模块中 chrome.tabs 内容

1. Service worker 中 tabs 内容

在这里插入图片描述

2. Action 中 tabs 内容

在这里插入图片描述

二、权限

大多数功能都不需要任何权限即可使用,如创建新标签页、重新加载标签页、导航到其他网址等
使用 Tabs API 时需要注意三种权限

  • tabs 权限
  • host_permissions
  • activeTab 权限

1. tabs 权限

{"name": "My extension","permissions": ["tabs"],
}

此权限不授予对 chrome.tabs 命名空间的访问权限。而是会授予插件针对 tabs.Tab 实例上的四个敏感属性调用 tabs.query() 的权限:url、pendingUrl、title 和 favIconUrl

2. host_permissions

{"name": "My extension","host_permissions": ["http://*/*","https://*/*"],
}

主机权限允许插件读取和查询匹配标签页的四个敏感 tabs.Tab 属性。他们还可以使用 tabs.captureVisibleTab()、tabs.executeScript()、tabs.insertCSS() 和 tabs.removeCSS() 等方法直接与匹配的标签页互动

3. activeTab 权限

{"name": "My extension","permissions": ["activeTab"],
}

activeTab 授予插件对当前标签页的临时主机权限,以响应用户调用。与主机权限不同,activeTab 不会触发任何警告

三、chrome.tabs 类型(Types)

1. MutedInfo

标签页的静音状态以及上次状态更改的原因。

1.1. 属性
  • extensionId:string
    • 更改静音状态的插件的 ID。如果插件不是静音状态上次更改的原因,则不设置。
  • muted:boolean
    • 标签页是否静音(防止播放声音)。即使该标签页尚未播放或当前未播放声音,它也可能被静音。相当于是否显示“静音”音频指示器。
  • reason:MutedInfoReason
    • 标签页静音或取消静音的原因。如果标签页的静音状态从未改变,则不设置。

2. MutedInfoReason

导致静音状态更改的事件。

2.1 枚举
  • user
    • 用户输入操作用于设置静音状态
  • capture
    • 标签页捕获已开始,强制设为静音状态
  • extension
    • 由 extensionId 字段标识的插件,用于设置静音状态

3. Tab

3.1. 属性
  • active: boolean
    • 标签页在其窗口中是否处于活动状态。不一定意味着窗口已聚焦。
  • audible: boolean
    • 该标签页在过去几秒钟内是否发出声音(但如果也静音,则可能听不到)。相当于是否显示“扬声器音频”指示器。
  • autoDiscardable: boolean
    • 资源不足时浏览器是否可以自动丢弃标签页。
  • discarded: boolean
    • 标签是否被丢弃。丢弃的标签页是指其内容已从内存中卸载但在标签页条中仍可见的标签页。下次激活时会重新加载其内容
  • favIconUrl:string
    • 标签页图标的 URL。此属性仅在插件的清单包含 tabs 权限时才存在。如果标签页正在加载,它也可能是一个空字符串
  • groupId: number
    • 标签页所属的组的 ID
  • height: number
    • 标签页的高度(以像素为单位)
  • highlighted: boolean
    • 该标签页是否突出显示
  • id: number
    • 标签页的 ID。标签 ID 在浏览器会话中是唯一的。在某些情况下,可能不会为标签页分配 ID;例如,当使用会话 API 查询外部标签页时,在这种情况下可能会出现会话 session ID。对于应用程序和开发工具窗口,标签 ID 也可以设置为 chrome.tabs.TAB_ID_NONE
  • incognito: boolean
    • 标签页是否在隐身窗口中
  • index: number
    • 标签页在其窗口中的从零开始的索引
  • mutedInfo: MutedInfo
    • 标签页的静音状态以及上次状态更改的原因
  • openerTabId: number
    • 打开此标签页的标签页的 ID(如果有)。此属性仅在 opener 标签页仍然存在时才存在
  • pendingUrl: string
    • 标签页在提交之前导航到的 URL。此属性仅在插件的清单包含“标签页”权限并且存在挂起导航时才存在
  • pinned: boolean
    • 标签页是否固定
  • sessionId: string
    • 用于唯一标识从会话 API 获取的标签页的会话 sessions ID
  • status: TabStatus
    • 标签页的加载状态。
  • title: string
    • 标签页的标题。此属性仅在插件的清单包含 tabs 权限时才存在。
  • url: string
    • 标签页主框架的最后提交 URL。此属性仅在插件的清单包含 tabs 权限时才存在,如果标签页尚未提交,则该属性可能为空字符串。另请参阅 Tab.pendingUrl
  • width: number
    • 标签页的宽度(以像素为单位)。
  • windowId: number
    • 包含标签页的窗口的 ID

4. TabStatus

标签页的加载状态

4.1. 枚举
  • unloaded
  • loading
  • complete

5. WindowType

窗口的类型

5.1. 枚举
  • normal
  • popup
  • panel
  • app
  • devtools

6. ZoomSettings

定义如何处理标签页中的缩放更改以及在什么范围内。

6.1. 属性
  • defaultZoomFactor:number
    • 用于在调用 tabs.getZoomSettings 时返回当前标签页的默认缩放级别。
  • mode: ZoomSettingsMode
    • 定义如何处理缩放更改,即哪个实体负责页面的实际缩放;默认为自动automatic。
  • scope: ZoomSettingsScope
    • 定义缩放更改是保留页面原点,还是仅在此标签页中生效;在自动automatic模式下默认为 per-origin,否则为 per-tab。

7. ZoomSettingsMode

定义如何处理缩放更改,即哪个实体负责页面的实际缩放;默认为自动automatic。

7.1. 枚举
  • automatic
  • manual
  • disabled

8. ZoomSettingsScope

定义缩放更改是保留页面原点,还是仅在此标签页中生效;在自动模式(automatic)下默认为 per-origin,否则为 per-tab

8.1. 枚举
  • per-origin
  • per-tab

四、chrome.tabs 属性(Properties)

1. MAX_CAPTURE_VISIBLE_TAB_CALLS_PER_SECOND

每秒可以调用 captureVisibleTab 的最大次数。captureVisibleTab 开销比较高,不应过于频繁地调用

1.1. 值

2

2. TAB_ID_NONE

表示缺少浏览器标签页的 ID

2.1. 值

-1

3. TAB_INDEX_NONE

表示 tab_strip 中不存在制表符索引的索引。

3.1. 值

-1

五、chrome.tabs 方法(Methods)

1. captureVisibleTab

捕获指定窗口中当前活动标签页的可见区域

要调用此方法,插件必须具有 <all_urls> 权限或 activeTab 权限。除了插件可以正常访问的站点外,此方法还允许插件捕获其他受限制的敏感站点,包括 chrome:-scheme 页面、其他插件的页面和 data: URL。这些敏感站点只能使用 activeTab 权限进行捕获。仅当插件已被授予文件访问权限时,才可以捕获文件 URL

1.1. 示例
chrome.tabs.captureVisibleTab( windowId?: number, options?: ImageDetails, callback?: function, )
1.2. 参数
  • windowId: number
    • 目标窗口。默认为当前窗口current window。
  • options: ImageDetails
  • callback: function
    • (dataUrl: string) => void
      • dataUrl: string
        • 对捕获的标签页的可见区域的图像进行编码的数据 URL。可以分配给 HTML img 元素的 src 属性以进行显示。
1.3. 返回

Promise<string>

2. connect

连接到指定标签页中的内容脚本。

在当前插件的指定标签页中运行的每个内容脚本中都会触发 runtime.onConnect 事件

2.1. 示例
chrome.tabs.connect(tabId: number,connectInfo?: object,
)
2.2. 参数
  • tabId:number
  • connectInfo:object
    • documentId: string
      • 打开一个指向由 documentId 标识的特定文档的端口,而不是标签页中的所有框架
    • frameId: number
      • 打开由 frameId 标识的特定框架frame的端口,而不是标签页中的所有框架
    • name: string
      • 传递到 onConnect 用于侦听连接事件的内容脚本。
2.3. 返回

runtime.Port

可用于与在指定标签页中运行的内容脚本进行通信的端口。如果标签页关闭或不存在,则会触发端口的 runtime.Port 事件。

3. create

创建一个新标签页

3.1. 示例
chrome.tabs.create( createProperties: object, callback?: function, )
3.2. 参数
  • createProperties: object
    • active: boolean
      • 该标签页是否应成为窗口中的活动标签页。不影响窗口是否聚焦,默认为 true
    • index: number
      • 标签页在窗口中应占据的位置。提供的值被限制在零和窗口中的标签页数量之间。
    • openerTabId: number
      • 打开此标签页的标签页的 ID。如果指定,opener 标签页必须与新创建的标签页位于同一窗口中。
    • pinned: boolean
      • 是否应固定标签页。默认为false。
    • url: string
      • 最初将标签页导航到的 URL。默认为新标签页。
    • windowId: number
      • 在其中创建新标签页的窗口。默认为当前窗口current window。
  • callback: function
    • (tab: Tab) => void
      • tab: Tab
        • 创建的标签页
3.3. 返回

Promise<Tab>

4. detectLanguage

检测标签页中内容的主要语言

4.1. 示例
chrome.tabs.detectLanguage(tabId?: number,callback?: function,
)
4.2. 参数
  • tabId: number
    • 默认为当前窗口current window的活动标签页。
  • callback: function
    • (language: string) => void
      • language: string
        • ISO 语言代码,例如 en 或 fr
4.3. 返回

Promise<string>

5. discard

从内存中丢弃一个标签页

5.1. 示例
chrome.tabs.discard(tabId?: number,callback?: function,
)
5.2. 参数
  • tabId: number
    • 要丢弃的标签页的 ID。如果指定,标签页将被丢弃,除非它处于活动状态或已被丢弃。如果省略,浏览器会丢弃最不重要的标签页
  • callback: function
    • (tab?: Tab) => void
      • tab: Tab
        • 丢弃的标签页,如果成功丢弃;否则未定义。
5.3 返回

Promise<Tab | undefined>

6. duplicate

复制标签页

6.1. 示例
chrome.tabs.duplicate(tabId: number,callback?: function,
)
6.2. 参数
  • tabId: number
    • 要复制的标签页的 ID
  • callback: function
    • (tab?: Tab) => void
      • tab: Tab
        • 有关重复标签页的详细信息。如果未请求 tabs 权限,则 tabs.Tab 对象不包含 url、pendingUrl、title 和 favIconUrl。
6.3. 返回

Promise<Tab | undefined>

7. get

检索有关指定标签页的详细信息

7.1. 示例
chrome.tabs.get(tabId: number,callback?: function,
)
7.2. 参数
  • tabId: number
  • callback: function
    • (tab: Tab) => void
7.3. 返回

Promise<Tab>

8. getCurrent

获取进行此脚本调用的标签页

8.1. 示例
chrome.tabs.getCurrent(callback?: function,
)
8.2. 参数
  • callback: function
    • (tab?: Tab) => void
      • tab: Tab
8.3. 返回

Promise<Tab | undefined>

9. getZoom

获取指定标签页的当前缩放系数

9.1. 示例
chrome.tabs.getZoom(tabId?: number,callback?: function,
)
9.2. 参数
  • tabId: number
    • 从中获取当前缩放系数的标签页的 ID;默认为当前窗口的活动标签页。
  • callback: function
    • (zoomFactor: number) => void
      • zoomFactor: number
        • 标签页的当前缩放系数。
9.3. 返回

Promise<number>

10. getZoomSettings

获取指定标签页的当前缩放设置

10.1. 示例
chrome.tabs.getZoomSettings(tabId?: number,callback?: function,
)
10.2. 参数
  • tabId: number
    • 从中获取当前缩放设置的标签页的 ID;默认为当前窗口的活动标签页。
  • callback: function
    • (zoomSettings: ZoomSettings) => void
      • zoomSettings: ZoomSettings
        • 标签页的当前缩放设置
10.3. 返回

Promise<ZoomSettings>

11. goBack

如果有,请返回上一页

11.1. 示例
chrome.tabs.goBack(tabId?: number,callback?: function,
)
11.2. 参数
  • tabId: number
    • 要返回的标签页的 ID;默认为当前窗口的选定标签页。
  • callback: function
    • () => void
11.3. 返回

Promise<void>

12. goForward

前进到下一页,如果有的话

12.1. 示例
chrome.tabs.goForward(tabId?: number,callback?: function,
)
12.2. 参数
  • tabId: number
    • 要向前导航的标签页的 ID;默认为当前窗口的选定标签页
  • callback: function
    • () => void
12.3. 返回

Promise<void>

13. group

将一个或多个标签页添加到指定的组,或者如果未指定组,则将给定的标签页添加到新创建的组。

13.1. 示例
chrome.tabs.group(options: object,callback?: function,
)
13.2. 参数
  • options: object
    • createProperties: object 用于创建组的配置。如果已经指定了 groupId,则不能使用
      • windowId: number
        • 新组的窗口。默认为当前窗口
    • groupId: number
      • 要将标签页添加到的组的 ID。如果未指定,将创建一个新组
    • tabIds: number | [number, ...number[]]
      • 要添加到指定组的标签页 ID 或标签页 ID 列表
  • callback: function
    • (groupId: number) => void
      • groupId: number
        • 添加标签页的组的 ID
13.3. 返回

Promise<number>

14. highlight

突出显示给定的标签页并关注组中的第一个。如果指定的标签页当前处于活动状态,则似乎什么都不做

14.1. 示例
chrome.tabs.highlight(highlightInfo: object,callback?: function,
)
14.2. 参数
  • highlightInfo: object
    • tabs: number | number[]
      • 要突出显示的一个或多个标签索引。
    • windowId: number
      • 包含标签页的窗口。
  • callback: function
    • (window: Window) => void
14.3. 返回

Promise<windows.Window>

15. move

将一个或多个标签页移动到其窗口内的新位置,或移动到新窗口。请注意,标签页只能移入和移出普通 (window.type === “normal”) 窗口

15.1. 示例
chrome.tabs.move(tabIds: number | number[],moveProperties: object,callback?: function,
)
15.2. 参数
  • tabIds:number | number[]
    • 要移动的标签页 ID 或标签页 ID 列表。
  • moveProperties: object
    • index: number
      • 将窗口移动到的位置。使用 -1 将标签页放在窗口的末尾。
    • windowId: number
      • 默认为标签页当前所在的窗口。
  • callback: function
    • (tabs: Tab | Tab[]) => void
15.3. 返回

Promise<Tab | Tab[]>

16. query

获取具有指定属性的所有标签页,如果未指定属性,则获取所有标签页

16.1. 示例
chrome.tabs.query(queryInfo: object,callback?: function,
)
16.2. 参数
  • queryInfo: object
    • active: boolean
      • 标签页在其窗口中是否处于活动状态
    • audible: boolean
      • 是否可以听到标签页
    • autoDiscardable: boolean
      • 资源不足时浏览器是否可以自动丢弃标签页
    • currentWindow: boolean
      • 标签页是否在当前窗口中current window
    • discarded: boolean
      • 标签是否被丢弃。丢弃的标签页是指其内容已从内存中卸载但在标签页条中仍可见的标签页。下次激活时会重新加载其内容
    • groupId: number
      • 标签页所在组的 ID,或 tabGroups.TAB_GROUP_ID_NONE 用于未分组的标签页
    • highlighted: boolean
      • 标签页是否突出显示
    • index: number
      • 标签页在其窗口中的位置
    • lastFocusedWindow: boolean
      • 标签页是否在最后一个聚焦窗口中
    • muted: boolean
      • 标签页是否静音
    • pinned: boolean
      • 标签是否固定
    • status: TabStatus
      • 标签页加载状态。
    • title: string
      • 将页面标题与模式匹配。如果插件没有“tabs”权限,则忽略此属性。
    • url: string | string[]
      • 根据一个或多个 URL 模式匹配URL patterns标签页。片段标识符不匹配。如果插件没有“tabs”权限,则忽略此属性。
    • windowId: number
      • 父窗口的 ID,或当前窗口current window的 windows.WINDOW_ID_CURRENT。
    • windowType: WindowType
      • 标签页所在的窗口类型。
  • callback: function
    • (result: Tab[]) => void
16.3. 返回

Promise<Tab[]>

17. reload

重新加载标签页

17.1. 示例
chrome.tabs.reload(tabId?: number,reloadProperties?: object,callback?: function,
)
17.2. 参数
  • tabId: number
    • 要重新加载的标签页的 ID;默认为当前窗口的选定标签页。
  • reloadProperties: object
    • bypassCache: boolean
      • 是否绕过本地缓存。默认为false。
  • callback: function
    • () => void
17.3. 返回

Promise<void>

18. remove

关闭一个或多个标签页

18.1. 示例
chrome.tabs.remove(tabIds: number | number[],callback?: function,
)
18.2. 参数
  • tabIds: number | number[]
    • 要关闭的标签页 ID 或标签页 ID 列表。
  • callback: function
    • () => void
18.3. 返回

Promise<void>

19. sendMessage

向指定标签页中的内容脚本发送一条消息,并在发回响应时运行可选的回调。在当前插件的指定标签页中运行的每个内容脚本中都会触发 runtime.onMessage 事件

19.1. 示例
chrome.tabs.sendMessage(tabId: number,message: any,options?: object,responseCallback?: function,
)
19.2. 参数
  • tabId: number
  • message: any
    • 要发送的消息。此消息应该是一个 JSON-ifiable 对象。
  • options: object
    • documentId: string
      • 向由 documentId 标识的特定文档发送消息,而不是标签页中的所有框架
    • frameId: number
      • 将消息发送到由 frameId 标识的特定框架frame,而不是标签页中的所有框架
  • callback: function
    • (response: any) => void

消息处理程序发送的 JSON 响应对象。如果在连接到指定标签页时发生错误,则不带参数调用回调并将 runtime.lastError 设置为错误消息

19.3. 返回

Promise<any>

20. setZoom

缩放指定的标签页

20.1. 示例
chrome.tabs.setZoom(tabId?: number,zoomFactor: number,callback?: function,
)
20.2. 参数
  • tabId: number
    • 要缩放的标签页的 ID;默认为当前窗口的活动标签页。
  • zoomFactor: number
    • 新的缩放系数。值 0 将标签页设置为其当前的默认缩放系数。大于 0 的值指定标签页的(可能是非默认的)缩放系数。
  • callback: function
    • () => void
20.3. 返回

Promise<void>

21. setZoomSettings

设置指定标签页的缩放设置,定义如何处理缩放更改。导航标签页时,这些设置将重置为默认值。

21.1. 示例
chrome.tabs.setZoomSettings( tabId?: number, zoomSettings: ZoomSettings, callback?: function, )
21.2. 参数
  • tabId: number
    • 要更改缩放设置的标签页的 ID;默认为当前窗口的活动标签页。
  • zoomSettings: ZoomSettings
    • 定义如何处理缩放更改以及在什么范围内。
  • callback: function
    • () => void
21.3. 返回

Promise<void>

22. ungroup

从各自的组中删除一个或多个标签页。如果任何组变空,它们将被删除。

22.1. 示例
chrome.tabs.ungroup(tabIds: number | [number, ...number[]],callback?: function,
)
22.2. 参数
  • tabIds: number | [number, ...number[]]
    • 要从各自组中删除的标签页 ID 或标签页 ID 列表。
  • callback: function
    • () => void
22.3. 返回

Promise<void>

23. update

修改标签页的属性。未在 updateProperties 中指定的属性不会被修改。

23.1. 示例
chrome.tabs.update(tabId?: number,updateProperties: object,callback?: function,
)
23.2. 参数
  • tabId: number
    • 默认为当前窗口current window的选定标签页。
  • updateProperties: object
    • active: boolean
      • 该标签页是否应处于活动状态。不影响窗口是否聚焦(参见 windows.update)。
    • autoDiscardable: boolean
      • 当资源不足时,浏览器是否应自动丢弃该标签页。
    • highlighted: boolean
      • 在当前选择中添加或删除标签页。
    • muted: boolean
      • 该标签页是否应静音。
    • openerTabId: number
      • 打开此标签页的标签页的 ID。如果指定,opener 标签页必须与此标签页位于同一窗口中。
    • pinned: boolean
      • 是否应固定标签页。
    • url: string
      • 将标签页导航到的 URL。不支持 JavaScript URL;改用 scripting.executeScript 。
  • callback: function
    • (tab?: Tab) => void
23.3. 返回

Promise<Tab | undefined>

六、chrome.tabs 事件(Events)

1. onActivated

当窗口中的活动标签页更改时触发。请注意,在触发此事件时可能未设置标签页的 URL,但您可以侦听 onUpdated 事件,以便在设置 URL 时收到通知。

1.1. 示例
chrome.tabs.onActivated.addListener(callback: function,
)
1.2. 参数
  • callback: function
    • (activeInfo: object) => void
      • tabId: number
        • 已激活的标签页的 ID
      • windowId: number
        • 活动标签页在其中更改的窗口的 ID

2. onAttached

将标签页附加到窗口时激发

2.1 示例
chrome.tabs.onAttached.addListener(callback: function,
)
2.2 参数
  • callback: function
    • (tabId: number, attachInfo: object) => void
      • tabId: number
      • attachInfo: object
        • newPosition: number
        • newWindowId: number

3. onCreated

创建标签页时触发

3.1 示例
chrome.tabs.onCreated.addListener(callback: function,
)
3.2 参数
  • callback: function
    • (tab: Tab) => void

4. onDetached

当标签页从窗口分离时激发

4.1 示例
chrome.tabs.onDetached.addListener(callback: function,
)
4.2 参数
  • callback: function
    • (tabId: number, detachInfo: object) => void
      • tabId: number
      • detachInfo: object
        • oldPosition: number
        • oldWindowId: number

5. onHighlighted

当窗口中突出显示或选定的标签页发生变化时触发。

5.1 示例
chrome.tabs.onHighlighted.addListener(callback: function,
)
5.2 参数
  • callback: function
    • (highlightInfo: object) => void
      • selectInfo: object
        • tabIds: number[]
          • 窗口中所有突出显示的标签页。
        • windowId: number
          • 标签页更改的窗口。

6. onMoved

在窗口内移动标签页时触发

6.1 示例
chrome.tabs.onMoved.addListener(callback: function,
)
6.2 参数
  • callback: function
    • (tabId: number, moveInfo: object) => void
      • tabId: number
      • moveInfo: object
        • fromIndex: number
        • toIndex: number
        • windowId: number

7. onRemoved

关闭标签页时触发

7.1 示例
chrome.tabs.onRemoved.addListener(callback: function,
)
7.2 参数
  • callback: function
    • (tabId: number, removeInfo: object) => void
      • tabId: number
      • removeInfo: object
        • isWindowClosing: boolean
          • 由于其父窗口已关闭而关闭标签页时为 True
        • windowId: number
          • 标签页关闭的窗口

8. onReplaced

由于预渲染或即时将标签页替换为另一个标签页时触发

8.1 示例
chrome.tabs.onReplaced.addListener(callback: function,
)
8.2 参数
  • callback: function
    • (addedTabId: number, removedTabId: number) => void
      • addedTabId: number
      • removedTabId: number

9. onUpdated

更新标签页时触发

9.1 示例
chrome.tabs.onUpdated.addListener(callback: function,
)
9.2 参数
  • callback: function
    • (tabId: number, changeInfo: object, tab: Tab) => void
      • tabId: number
      • changeInfo: object
        • audible: boolean
          • 标签页的新声音状态
        • autoDiscardable: boolean
          • 标签页的新自动丢弃状态。
        • discarded: boolean
          • 标签页的新丢弃状态
        • favIconUrl: string
          • 标签页的新图标 URL
        • groupId: number
          • 标签页的新组。
        • mutedInfo: MutedInfo
          • 标签页的新静音状态和更改原因
        • pinned: boolean
          • 标签页的新固定状态。
        • status: TabStatus
          • 标签页的加载状态
        • title: string
          • 标签页的新标题。
        • url: string
          • 标签页的 URL
      • tab: Tab

10. onZoomChange

缩放标签页时触发

10.1 示例
chrome.tabs.onZoomChange.addListener(callback: function,
)
10.2 参数
  • callback: function
    • (ZoomChangeInfo: object) => void
      • ZoomChangeInfo: object
        • newZoomFactor: number
        • oldZoomFactor: number
        • tabId: number
        • zoomSettings: ZoomSettings

七、chrome.tabs API 使用示例

1. 在新标签页中打开扩展程序页面

在安装扩展程序后在新标签页中打开初始配置页面

Service Worker js 中

chrome.runtime.onInstalled.addListener(({reason}) => {if (reason === 'install') {chrome.tabs.create({url: "setting.html"});}
});

2. 获取当前标签页

扩展程序的 Service Worker 如何从当前聚焦的窗口
Service Worker js 中

  async function getCurrentTab() {let queryOptions = { active: true, lastFocusedWindow: true };let [tab] = await chrome.tabs.query(queryOptions);return tab;}
  function getCurrentTab(callback) {let queryOptions = { active: true, lastFocusedWindow: true };chrome.tabs.query(queryOptions, ([tab]) => {if (chrome.runtime.lastError)console.error(chrome.runtime.lastError);callback(tab);});}

3. 将指定标签页静音

扩展程序如何切换指定标签页的静音状态

async function toggleMuteState(tabId) {const tab = await chrome.tabs.get(tabId);const muted = !tab.mutedInfo.muted;await chrome.tabs.update(tabId, {muted});console.log(`Tab ${tab.id} is ${muted ? "muted" : "unmuted"}`);
}
function toggleMuteState(tabId) {chrome.tabs.get(tabId, async (tab) => {let muted = !tab.mutedInfo.muted;await chrome.tabs.update(tabId, { muted });console.log(`Tab ${tab.id} is ${ muted ? "muted" : "unmuted" }`);});
}

4. 点击当前标签页时将其移至第一个位置

chrome.tabs.onActivated.addListener(moveToFirstPosition);
async function moveToFirstPosition(activeInfo) {try {await chrome.tabs.move(activeInfo.tabId, {index: 0});console.log("Success.");} catch (error) {if (error == "Error: Tabs cannot be edited right now (user may be dragging a tab).") {setTimeout(() => moveToFirstPosition(activeInfo), 50);} else {console.error(error);}}
}

5. 向所选标签页的内容脚本传递消息

function sendMessageToActiveTab(message) {const [tab] = await chrome.tabs.query({ active: true, lastFocusedWindow: true });const response = await chrome.tabs.sendMessage(tab.id, message);
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.tpcf.cn/news/775430.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

远程监测的具体技术

远程监测是指利用技术手段&#xff0c;在不同地点对患者的生命体征、健康状况或医疗设备的状态进行实时追踪和评估。在医疗保健领域&#xff0c;远程监测通过物联网&#xff08;IoT&#xff09;设备、移动通信技术、云计算平台和数据分析工具实现。以下是远程监测的具体技术组成…

批量删除 rabbitmq中随机队列

批量删除 amq.gen–* 随机队列 操作错误产生了无效随机队列&#xff0c;需要批量删除 过滤列出指定amq.gen–队列 # 列出 指定 vhost/qq 以amq.gen开头的所有队列 rabbitmqctl list_queues --vhost / | grep ^amq.gen-# 批量删除队列 #由于list_queues会列出队列名称以及对应…

【SAP2000】在框架结构中应用分布式面板荷载Applying Distributed Panel Loads to Frame Structures

在框架结构中应用分布式面板荷载 Applying Distributed Panel Loads to Frame Structures 使用"Uniform to Frame"选项,可以简单地将荷载用于更多样化的情况。 With the “Uniform to Frame” option, loads can be easily used for a greater diversity of situat…

Win11电脑cpu温度过高怎么办呢

Win11电脑cpu温度过高怎么办呢&#xff1f;有时候我们感觉电脑发烫&#xff0c;担心电脑过烫会不会损坏。正常情况下&#xff0c;cpu的温度在45~65度之间&#xff0c;但不排除电脑同时开了太多软件&#xff0c;或者在玩吃鸡、英雄联盟等的大型游戏而导致温度超过85度。只要最高…

CSS 滚动条样式修改

1、滚动条整体部分 使用 ::-webkit-scrollbar 注意&#xff1a;这个必须要加&#xff0c;不然修改的样式不生效 ::-webkit-scrollbar {width: 10px;//修改滚动条宽度 }2、滚动条中的滑块 使用 ::-webkit-scrollbar-thumb ::-webkit-scrollbar-thumb {border-radius: 8px;b…

亚信安全荣获2023年度5G创新应用评优活动两项大奖

近日&#xff0c;“关于2023 年度5G 创新应用评优活动评选结果”正式公布&#xff0c;亚信安全凭借在5G安全领域的深厚积累和创新实践&#xff0c;成功荣获“5G技术创新的优秀代表”和“5G应用创新的杰出实践”两项大奖。 面向异构安全能力的5G安全自动化响应系统 作为5G技术创…

Avalonia11.0.2+.Net6.0支持多语言,国际化使用DynamicResource绑定数据

Avalonia11.0.2+.Net6.0支持多语言,国际化使用DynamicResource绑定数据 介绍调整的内容效果展示介绍 本章内容是对上一章博客的补充,当时我们用的是自定义扩展的方式实现了多语言数据的绑定,本章我们用标准的 Text="{DynamicResource 名称}" 来替换 Text="{i…

前端Web移动端学习day05

移动 Web 第五天 响应式布局方案 媒体查询Bootstrap框架 响应式网页指的是一套代码适配多端&#xff0c;一套代码适配各种大小的屏幕。 共有两种方案可以实现响应式网页&#xff0c;一种是媒体查询&#xff0c;另一种是使用bootstrap框架。 01-媒体查询 基本写法 max-wid…

vue2 el-table指定某些数据不参与排序

vue2 el-table指定某些数据不参与排序 1、需求描述2、配置属性方法3、详细代码如下 1、需求描述 最后一行总计不参与排序 2、配置属性方法 el-table 需要配置 sort-change"soltHandle" 方法 el-table-column 需要配置 sortable"custom"属性3、详细代码如…

标准偏差与标准误差的区别

在统计学中,有两个关系容易搞混 标准偏差:standard deviation (SD) 标准误差:standard error (SE) 不用很复杂的定义,用下面的一个例子来说明这两个概念 假如一个盒子中有7个球,球号为1~7,从中取25次。那么这25次球号的数学和的期望是多少呢? 这很容易计算,取一次的…

Mysql---安全值守常用语句

文章目录 目录 文章目录 一.用户权限设置 用户设置 元数据查询 Union联合查询 分组查询 字符串函数 总结 一.用户权限设置 用户设置 #用户创建 create user "用户名""%主机名" identified by "密码" #用户删除 drop user 用户名 #用户查询…

Rust语言中Regex正则表达式,匹配和查找替换等

官方仓库&#xff1a;https://crates.io/crates/regex 文档地址&#xff1a;regex - Rust github仓库地址&#xff1a;GitHub - rust-lang/regex: An implementation of regular expressions for Rust. This implementation uses finite automata and guarantees linear tim…

Centos 7 安装 Node.js v16.13.1

二进制安装 Node.js 下载node 16版本wget https://nodejs.org/dist/v16.13.2/node-v16.13.2-linux-x64.tar.xz 解压xz xz -d node-v16.13.2-linux-x64.tar.xz 注&#xff1a;xz 找不到命令需要执行 yum install xz.x86_64 -y 解压tar tar xvf node-v16.13.2-linux-x64.tar 转移…

8.HelloWorld小案例

文章目录 一、Java程序开发运行流程如何理解编译&#xff1f; 二、HelloWorld案例的编写1、新建文本文档文件&#xff0c;修改名称为HelloWorld.java。2、用记事本打开HelloWorld.java文件&#xff0c;输写程序内容。代码要跟我编写的完全保持一致。3、ctrl s 保存&#xff0c…

CSS面试题常用知识总结day02

大家好我是没钱的君子下流坯&#xff0c;用自己的话解释自己的知识 前端行业下坡路&#xff0c;甚至可说前端已死&#xff0c;我还想在前段行业在干下去&#xff0c;所以从新开始储备自己的知识。 从CSS——>Javascript——>VUE2——>Vuex、VueRouter、webpack——>…

从MVC 到DDD 架构

目录 一、前言 二、MVC架构 三、DDD架构 四、我为什么会使用DDD&#xff1f; 五、DDD架构分层 一、前言 最近在做一个项目&#xff0c;使用的是DDD架构思&#xff0c;觉得很不错&#xff0c;在此记录下。 二、MVC架构 MVC是一种经典的软件架构模式&#xff0c;主要用于…

前端框架的简单介绍

html html-结构 盖房子之前先划三室二厅 &#xff08;超文本标记语言&#xff09;(可以实现一切的文本) css css-样式 在房里添家具 &#xff08;层叠样式单&#xff09;(化妆在脸上叠加) javascript(js) javascript(js)-交互(行为) 我点击你打开 供显示信息的元…

http模块 url对象的主要属性

在 Node.js 中&#xff0c;URL 对象是一个内置类&#xff0c;用于解析和操作 URL 字符串。URL 对象具有多个属性&#xff0c;这些属性提供了对 URL 不同部分的访问。以下是URL对象的一些主要属性及其含义&#xff1a; &#xff08;1&#xff09;href 返回完整的 URL 字符串。…

【小白版】AI 答疑

现在的AI和过去的有什么差别&#xff1f; 过去的AI更像设定好答案的机器人&#xff0c;而现在的AI的答案不再确定。 根本在于背后的数据量级别不一样了。所以&#xff0c;现在的AI表现更接近一个人的理解能力。 AGI是什么&#xff1f; AI分成 ANI 和 AGI&#xff0c;分别为人…

【爬虫基础】第5讲 AJAX动态页面的数据获取

静态&#xff1a;访问地址栏里的数据就可以获取到想要的数据 动态&#xff1a;访问地址栏里的数据获取不到想要的数据 解决方案&#xff1a;抓包 打开浏览器的开发者工具-network-xhr,找到可以获取到数据的URL访问即可 获取url地址 代码实现&#xff1a; from urllib.request…