【问题标题】:Chrome extension: open tabs with delayChrome扩展程序:延迟打开标签
【发布时间】:2013-09-11 06:50:51
【问题描述】:

我正在制作一个扩展,它有一个背景页面(以及与之关联的脚本:eventPage.js)和一个内容脚本(work.js)

内容脚本扫描网页,并检索数组中的数据:

var datas = new Array();
var i = 0;
$('.szovegbox_kn tbody').each(function () {
    var data = $(this).first("tr").find("td:nth-child(5)").html();

    if (data !== undefined) {
        datas[i] = data.replace(/\s/g, '');
        chrome.runtime.sendMessage({
            data: datas[i]
        });
        i++;
    }
});

如您所见,当变量数据未未定义时,data[i] 会被发送到后台页面。

这是我的后台页面脚本:

chrome.runtime.onMessage.addListener(
function (request, sender, sendResponse) {
    if (request.data !== undefined) {
        var data = request.data;
        var newURL = "http://www.something.com/loadpage.php?dest=" + data;
        chrome.tabs.create({
            url: newURL
        });

        chrome.tabs.onUpdated.addListener(function (tabId, changeInfo) {
            if (changeInfo.status === 'complete') {
                window.setTimeout(function () {
                    chrome.tabs.remove(tabId);
                }, 3000);
            }
        });
    }
});

我想做的是,当一条有效消息(其类型不是未定义的)到达后台页面时,选项卡创建延迟 n 秒,并且只有一个选项卡被创建,直到选项卡获取关闭。现在,如果我的 datas[] 数组中有 100 条记录,我的后台页面会立即打开所有 100 个选项卡。我尝试了 setTimout,但没有成功。

tl;博士: 数据数组被发送到后台页面,一个一个打开选项卡,它们之间有十秒的延迟。

如果您需要更多信息,我可以提供

【问题讨论】:

    标签: javascript jquery google-chrome google-chrome-extension


    【解决方案1】:

    听起来您想限制您的事件处理逻辑。

    var tabCreationDelay = 10000; //milliseconds
    
    var createTabThrottled = _.throttle(function(url){
        chrome.tabs.create({
            url: url
        });
    }, tabCreationDelay);
    
    chrome.runtime.onMessage.addListener(
    function (request, sender, sendResponse) {
        if (request.data !== undefined) {
            var data = request.data;
            var newURL = "http://www.something.com/loadpage.php?dest=" + data;
            createTabThrottled(newURL);
        }
    
        // ...
    });
    

    UnderscoreLo-Dash 等库中有限制算法的实现。

    【讨论】:

    • 与您的问题无关,但您是否要在每次收到消息时添加onUpdated 事件处理程序?您最终会得到许多处理程序,每个处理程序都试图删除相同的选项卡。如果只添加一个处理程序,它仍然会在每次onUpdated 事件触发时运行。
    • 感谢您的回答,这看起来很棒,但是由于某种原因,只有后台页面的消息 URL 被打开。 (所以如果有 20 条记录,只打开第 20 条)我使用了下划线。
    • 对不起,我误解了你的问题。如果您希望在选项卡中打开所有 URL,但在打开每个选项卡之间存在延迟,则可以改用 _.throttle(相同的参数)。
    • 我遇到了另一个问题:出于某种原因 _.throttle 只打开 2 个选项卡。(第一个和最后一个)它按预期工作,但如果我有 n 条记录,只有第一个和最后一个得到在新标签页中打开
    • 如果在一个节流窗口内发生多个事件,_.throttle 函数可能会抛出事件。如果是这种情况,您可能需要一个更复杂的异步库。我用过Q,它非常强大(虽然学习曲线有点挑战性)。我认为reduce sampledelay method 适合您要解决的问题。