Chrome 擴展命令切換

Question

我正在編寫一個簡單的 Chrome 擴展程序，它可以攔截媒體鍵事件並與網站進行交互。

我已對其進行設置，以便可以通過單擊它來關閉和打開擴展程序。 啟用時，它會監視選項卡並在按下媒體鍵時向其發送事件。 當它關閉時，它仍然會攔截媒體按鍵，但不會對它們做任何事情。

我的問題是我想在擴展“關閉”時停止攔截媒體按鍵。 如果未安裝我的擴展程序，我希望 Chrome 像往常一樣使用媒體密鑰。 我假設有一種方法可以停止攔截按鍵，或者將它們轉發給 Chrome，但我不知道如何做。

目前我正在使用清單通過以下代碼攔截按鍵：

{
    .... a bunch of stuff ...

    "manifest_version": 3,
    "background": {
        "service_worker": "background.js"
    },
    "commands": {
        "playPause": {
            "suggested_key": {
                "default": "MediaPlayPause"
            },
            "global": true,
            "description": "Toggle play/pause"
        },
        "playNext": {
            "suggested_key": {
                "default": "MediaNextTrack"
            },
            "global": true,
            "description": "Play next track"
        },
        "playPrev": {
            "suggested_key": {
                "default": "MediaPrevTrack"
            },
            "global": true,
            "description": "Play previous track"
        }
    }
}

然后我用這個捕捉按鍵：

function commandFired(command) {
    chrome.storage.local.get('activeTabId', result => {
        if (result.activeTabId == -1) {
            //send to chrome normally here
            return;
        }

        switch (command) {
            case "playNext":
                //Handling next
                break;
            case "playPrev":
                //Handling prev
                break;
            case "playPause":
                //Handling play
                break;
        }
    });
}

chrome.commands.onCommand.addListener(commandFired);

Answer 1

Chrome 沒有 API 以編程方式禁用熱鍵，因此您必須注銷整個服務工作者並在彈出窗口中提供一個按鈕以重新注冊它。

清單.json：

  "action": {"default_popup": "popup.html"},

彈出窗口.html：

<label><input type=checkbox id=power>Enabled</label>
<script src=popup.js></script>

popup.js：

Object.assign(document.getElementById('power'), {
  checked: !!navigator.serviceWorker.controller,
  async onchange() {
    if (this.checked) {
      const bg = chrome.runtime.getManifest().background;
      await navigator.serviceWorker.register(bg.service_worker, {type: bg.type});
    } else {
      (await navigator.serviceWorker.getRegistration())?.unregister();
    }
  },
});

如果您想繼續收聽其他chrome事件，請在取消注冊主要文件后注冊一個不同的 bg2.js 文件。 主要的 bg.js 可以導入 bg2.js 來對代碼進行去重，更多信息。