javascript - 无法从 chrome 扩展中的后台脚本向内容脚本发送消息

Question

我正在尝试制作一个 chrome 扩展程序，根据用户输入在指定时间内阻止某些站点。弹出窗口关闭时计时器停止，因此我尝试将用户定义的输入从内容脚本发送到后台脚本，并让后台脚本将更新的时间发送回要显示的内容脚本。但是，在后台脚本中使用 chrome.tabs.sendMessage 时，我不断收到“无法读取未定义 id 的属性”错误。

//background.js
    chrome.runtime.onMessage.addListener((request) => {
    let blockRequest = function() {
        return {cancel: true};
    }
    if (request) {
        chrome.webRequest.onBeforeRequest.addListener(
            blockRequest,
            {urls: ["https://github.com/"]},
            ["blocking"]
        );
        let seccount = (request.msg) / 1000; //request.msg is time sent by content script 
        let starttime = new Date().getTime();
        let intId = setInterval(sectimer, 100);
        function sectimer() {
            let remaining = Math.floor((seccount*1000 - (new Date().getTime() - starttime))/1000);
            chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
                chrome.tabs.sendMessage(tabs[0].id, {msg: remaining}) //error here, cannot read property of undefined
            });
            if (remaining <= 0) {
                clearInterval(intId);
            }
        }

//main.js (content script)
chrome.runtime.onMessage.addListener((request) => {
        if (request) {
            let min = Math.floor(request.msg / 60);
            let seconds2 = (request.msg) % 60;
            document.getElementById("button1").innerHTML=min + " minutes " + seconds2 + " seconds left!";
        }
    })

我什至不确定这是否是用正确的时间每秒更新 html 的最佳方式，所以也请随时对此发表评论。

标签： javascriptgoogle-chrome-extension