chrome 擴展命令傳遞給內容腳本

Question

我想在我的內容腳本中實現一個觸發功能的熱鍵。 內容腳本 (main.js) 在我的 popup.js 文件中的頁面 laod 上執行。

我已將命令添加到我的 manifest.json 中，當我將 onCommand 偵聽器添加到我的 popup.js 時，我可以控制台記錄當我按下熱鍵 (Ctrl+Shift+K) 時它被觸發

但是我無法將它傳遞給我的內容腳本。

清單文件

{
    "manifest_version": 2,
    "name": "FUT trade buddy light",
    "description": "Chrome extension of FUT trade buddy",
    "version": "1.0",
    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html"
    },
    "permissions": ["tabs", "*://www.ea.com/*", "storage", "activeTab"],
    "content_scripts": [
        {
            "matches": ["*://www.ea.com/*"],
            "css": ["style.css"],
            "js": ["jquery.js", "main.js"]
        }
    ],
    "content_security_policy": "script-src 'self' https://ajax.googleapis.com; object-src 'self'",
    "web_accessible_resources": ["toolbar.html", "style.css"],
    "commands": {
        "show_deals": {
            "suggested_key": {
                "default": "Ctrl+Shift+K"
            },
            "description": "Highlight Deals"
        }
    }
}

彈出窗口.js

function registerButtonAction(tabId, button, action) {
    // clicking button will send a message to
    // content script in the same tab as the popup
    button.addEventListener('click', () => chrome.tabs.sendMessage(tabId, { [action]: true }));
}

function setupButtons(tabId) {
    // add click actions to each 3 buttons
    registerButtonAction(tabId, document.getElementById('start-btn'), 'startSearch');
    registerButtonAction(tabId, document.getElementById('deals-btn'), 'startDeals');
    registerButtonAction(tabId, document.getElementById('stop-btn'), 'stopSearch');
}

function injectStartSearchScript() {
    chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
        // Injects JavaScript code into a page
        // chrome.tabs.executeScript(tabs[0].id, { file: 'main.js' });

        // add click handlers for buttons
        setupButtons(tabs[0].id);
    });
}

injectStartSearchScript();


// hotkey command listener
chrome.commands.onCommand.addListener((show_deals) => {
    console.log(`Command "${show_deals}" triggered`);
    // how can I get to main.js to call deals()

});

main.js（內容腳本）

async function deals() {
    // should be fired when I press my hotkey Ctrl+Shift+K

Answer 1

使用如下消息

彈出窗口.js

chrome.commands.onCommand.addListener((show_deals) => {
    console.log(`Command "${show_deals}" triggered`);
    chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
        chrome.tabs.sendMessage(tab.id, { msg: "deals"})
    })
});

並在您的內容腳本中

if (!window.firstTimeExecuted) {
    window.firstTimeExecuted = true;
    chrome.runtime.onMessage.addListener((data, sender, sendResponse) => {
        if (data.msg == 'deals') {
            deals()
        }
    });
}