未激活选项卡的截图（屏幕截图）

Question

未激活选项卡的截图（屏幕截图）

javascriptgoogle-chromegoogle-chrome-extension

3

想要捕获可能处于非活动状态的选项卡的图像。

问题在于，当使用此处显示的方法时，选项卡经常没有时间在捕获之前加载，导致失败。

chrome.tabs.update() 回调在选项卡可以被捕获之前执行。

我还尝试添加事件监听器，例如 tabs.onActivated 和 tabs.onHighlighted 并在触发时进行捕获，但结果是相同的。因此，我还尝试了在 chrome.tabs.update() 上使用 highlighted 而不是 active - 以及两者的组合；带有监听器和回调。

使其部分工作得更好的唯一方法是使用 setTimeout()，但这非常不可靠且丑陋。事实上，在捕获之前必须激活选项卡有点吵闹 - 但是如果必须添加延迟，则问题会变得更糟。

这更像是我的扩展程序的一项便利功能，但使其正常工作也很好。

/* Not the real code, but the same logic. */

var request_tab = 25,
    request_win = 123
    old_tab;

/* Check which tab is active in requested window. */
chrome.tabs.query({
    active   : true,
    windowId : request_win
}, function (re) {

    old_tab = re[0].id;

    if (old_tab !== request_tab) {
        /* Requested tab is inactive. */
        /* Activate requested tab.    */
        chrome.tabs.update(request_tab, {
            active: true
        }, function () {     
            /* Request capture */                          /* CB TOO SOON! */
            chrome.tabs.captureVisibleTab(request_window, {
                format : 'png'
            }, function (data) {
                /* ... data ...  */

                /* Put back old tab */
                chrome.tabs.update(old_tab, {
                    active: true
                });
            })
        });
    } else {
        /* Requested tab is active. */
        /* Request capture. */
        chrome.tabs.captureVisibleTab(request_window, {
            format : 'png'
        }, function (data) {
            /* ... data ...  */
        })
    }
});

- user3342816

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Marco Bonelli · Accepted Answer

由于您正在使用chrome.tabs.update()方法更新选项卡，因此回调将在选项卡属性更改后立即调用，但是显然会在页面加载之前。要解决这个问题，您应该记住选项卡尚未准备好，并使用chrome.tabs.onUpdated事件检查何时准备就绪，然后可以使用chrome.tabs.captureVisibleTab()。

以下是解决方案：

var request_tab = 25,
    request_win = 123,
    waiting = false,
    // ^^^ Variable used to check if tab has loaded
    old_tab;

// Check which tab is active in requested window.
chrome.tabs.query({
    active   : true,
    windowId : request_win
}, function (re) {

    old_tab = re[0].id;

    if (old_tab !== request_tab) {
        // Requested tab is inactive
        // Activate requested tab
        chrome.tabs.update(request_tab, { active: true });    

        // Tab isn't ready, you can't capture yet
        // Set waiting = true and wait...
        waiting = true;

    } else {
        // Requested tab is active
        // Request capture
        chrome.tabs.captureVisibleTab(request_window, {
            format : 'png'
        }, function (data) {
            // Elaborate data...
        })
    }
});

chrome.tabs.onUpdated.addListener(function(tabID, info, tab) {

    // If the tab wasn't ready (waiting is true)
    // Then check if it's now ready and, if so, capture
    if (waiting && tab.status == "complete" && tab.id == request_tab) {

        // Now you can capture the tab
        chrome.tabs.captureVisibleTab(request_window, {
            format : 'png'
        }, function (data) {

            // Elaborate data...

            // Put back old tab
            // And set waiting back to false
            chrome.tabs.update(old_tab, { active: true });
            waiting = false;
        });
    }
});