您如何使用清单 v3 在 chrome 扩展中进行定期后台工作

How do you do periodic background work in a chrome extension using manifest v3

清单 v3 中删除了 background.js 机制,现在我正在寻找它消失后如何在后台进行定期操作。

本升级指南说要使用 chrome 警报 api: https://developer.chrome.com/docs/extensions/mv3/migrating_to_service_workers/

具体说:

Instead, we can use the Alarms API. Like other listeners, alarm listeners should be registered in the top level of your script.

不清楚它需要成为哪个脚本的顶层,但是当使用我的 chrome 扩展的入口点时,“popup.js” 它会定期执行,但仅当chrome 弹出窗口实际打开。即使弹出窗口关闭,我也需要它在后台执行。附带说明是,在我将“警报”添加到清单文件中的权限之前,我对 chrome.alarms 未定义,然后它不会阻塞,但我仍然有问题,它没有 运行背景.

由于上面的文章是在 service worker 的上下文中,我假设您需要将警报侦听器放在 service-worker.js 文件的顶层。只有这个不行。我在这里得到 chrome.alarms 的未定义(即使授予了“警报”权限):

服务-worker.js

console.log("inside service worker")

// getting chrome.alarms undefined here
chrome.alarms.create("alarm", { periodInMinutes: 1 });

将它放在安装事件侦听器中也无济于事:

self.addEventListener('install', event => {
    console.log("Installing service worker")
    // still getting chrome.alarms undefined here
    chrome.alarms.create("alarm", { periodInMinutes: 1 });
    chrome.alarms.onAlarm.addListener((alarm) => {
        if (alarm.name === "alarm") {
            let milliseconds = new Date().getTime();
            console.log(milliseconds)
            chrome.action.setTitle({
                title: "Hello "+ milliseconds
            });
        }
    });
});

出于绝望,我也向清单添加了“后台”权限,但这也无济于事。

任何线索如何 运行 在清单 v3 中定期在后台进行某些操作?似乎警报 api 应该是你如何做的,但服务人员显然无法访问它?

迁移指南非常混乱,因为它是由网络开发人员编写的。它没有说的是,使用扩展的服务工作者与 ManifestV2 事件页面减去 DOM 相关的 API 有 99% 相同,这在工作者中不可用。因此,您需要进行的更改与切换到 event pages in ManifestV2.

基本相同

Since the above article is in the context of a service worker

它与您在 manifest.json 的 background 部分中声明的后台服务工作者脚本相同。

alarm listeners should be registered in the top level of your script.

除了创建警报之外,您还需要添加一个侦听器,该侦听器将在 alarm event fires in your background script. The "top level" was intended to be a simplification for what really is "the event listener should be registered in the first task of the event loop each time the background script is executed when it wakes up". So you can put it anywhere you want e.g. inside other functions or even inside a Promise that resolves in the same first task. For more info see JavaScript event loop.

时调用

警报会被浏览器记住,所以如果您需要定期警报,您应该在安装扩展程序时只创建一次。目前,每次 Service Worker 醒来时您都会重新创建警报,这会重置其时间。幸好你指定了一个 id 参数,否则每次都会添加一个新警报。

getting chrome.alarms undefined here

要使用 chrome API 的大部分内容,您需要将其名称添加到 manifest.json 中的 permissions。请注意,您需要在编辑清单或后台脚本后在chrome://extensions页面中单击扩展卡上的重新加载按钮。

  • manifest.json:

    "manifest_version": 3,
    "background": { "service_worker": "bg.js" },
    "permissions": [ "alarms" ],
    
  • bg.js:

    chrome.alarms.onAlarm.addListener(a => {
      console.log('Alarm! Alarm!', a);
    });
    
    chrome.runtime.onInstalled.addListener(() => {
      chrome.alarms.get('alarm', a => {
        if (!a) {
          chrome.alarms.create('alarm', {periodInMinutes: 1});
        }
      });
    });
    

self.addEventListener('install', 不是必需的,因为扩展的服务工作者在安装扩展时已在内部注册。 None 的服务工作者生命周期事件是 MV3 所必需的,most/all 甚至不会工作。