javascript - 打开标签，等待它完成加载然后关闭它

Question

我今天写了我的第一个 chrome 扩展，我希望它在后台打开一个标签（固定），在标签中的页面完成加载后，我希望标签关闭。

到目前为止，我有：

chrome.tabs.create({url: target, selected: false, pinned: true});

上面的代码所做的是在后台打开选项卡，然后将其固定。

完成加载后如何关闭选项卡？

Answer 1

您可以绑定 achrome.tabs.onUpdated或chrome.webNavigation.onCompleted事件以检测页面已完​​成加载，或插入内容脚本以关闭选项卡。

使用webNavigation.onCompleted事件

var tabsToClose = {};
chrome.webNavigation.onCompleted.addListener(function(details) {
    if (details.frameId !== 0) return; // Only process top-frame requests
    var tabId = details.tabId;
    if (tabsToClose[tabId]) {
        delete tabsToClose[tabId];
        chrome.tabs.remove(tabId);
    }
});

chrome.tabs.create({url: target, selected: false, pinned: true}, function(tab) {
    tabsToClose[tab.id] = 1;
});

注意：我假设导航总是会成功。您还应该绑定一个webNavigation.onErrorOccurred事件以在失败时关闭选项卡。

使用内容脚本

通过使用runAt: 'document_idle'（默认），window.close();将在页面完成加载后插入。

chrome.tabs.create({url: target, selected: false, pinned: true}, function(tab) {
    chrome.tabs.executeScript(tab.id, {
        code: 'window.close();',
        runAt: 'document_idle'
    });
});

Answer 2

chrome.tabs.create({url: target, selected: false, pinned: true}, myTab => {
    function listener(tabId, changeInfo, tab) {
        // make sure the status is 'complete' and it's the right tab
        if (tabId === myTab.id && changeInfo.status == 'complete') {
            chrome.tabs.remove(myTab.id);
            chrome.tabs.onUpdated.removeListener(listener);
        }
    };
    chrome.tabs.onUpdated.addListener(listener);
});