全局变量和异步回调函数

Question

如何将当前标签的URL存储在变量中，以便以后可以访问？我做了一些谷歌搜索，但不太了解异步回调函数。

var currentTab;
chrome.tabs.getSelected(null, function(tab) { currentTab = tab.url; });
console.log(currentTab);

Answer 1

所有Chrome方法都是异步的，这意味着他们只是排队稍后要调用的代码。

另请注意tabs.getSelected has been deprecated，因此我使用的是tabs.query({active: true}...。

在其他所有内容完成后，回调将无序触发：

var currentTab;                   // 1

chrome.tabs.query({active: true}, // 2, queues up callback and continues
    function(tabs) { 
        currentTab = tabs[0].url; // 4, last, after everything else
    });

console.log(currentTab);          // 3 callback hasn't fired yet, so undefined

欢迎来到有时被称为'回调地狱'的事情。

最简单的方法是使用像chrome-extension-async这样的异步或承诺包装器库。这是让你使用async / await语法：

async function yourCode() {
    try {
       const currentTabs = await chrome.tabs.query({active: true});
       const currentTab = currentTabs[0];
       console.log(currentTab);
    }
    catch(err) {
        // Log errors etc
    }
}

你仍然在完成后进行回调并执行代码，但现在你可以轻松地在await之前和之后使用变量。我最近blogged about that in a lot more detail than will fit here。