如何根据chrome扩展中的页面显示弹出窗口？

问题描述

我正在尝试构建这个 chrome 扩展，它只在我在 youtube 视频页面上时显示弹出窗口。但是，我在执行此操作时遇到了很多困难并使用了多种方法。

我的最新方法是使用 chrome.action.onClicked 并检查 URL 是否包含 https://youtube.com/watch。然后我会在我的 HTML 文件中使用 chrome.action.setPopup。这适用于所有页面，直到我在 youtube 视频页面上单击扩展程序时，它才会显示在每个页面上。

这是我的 background.js：

chrome.action.onClicked.addListener((tab) => {

    console.log(tab.tabId); 
    if (tab.url.includes("https://www.youtube.com/watch") == true) {
        chrome.action.setPopup({ tabId: tab.tabId,popup: "/Pages/index.html" });
    } else if (tab.url.includes("https://www.youtube.com/watch") == false) {
        chrome.action.setPopup({ tabId: tab.tabId,popup: "" });
    }
});

我认为它不起作用，因为在设置弹出窗口后，这意味着它不再检查 onClicked 事件 (specified here)。

任何帮助将不胜感激！

解决方法

不是tab.tabId而是tab.id。你可以检查一下。而 setPopup 当 onClicked 时，您必须单击扩展程序两次才会显示弹出窗口。