了解制表符.sendMessage和Promises

Question

我已经阅读了大量的论坛和reddit链接以及stackoverflow QnA和非回答问题或以明确的方式解释它。我已经花了2-3天的时间在这个async await promise上了。

我有一个异步弹出函数，调用chrome.tabs.sendMessage，你可以看到下面，它是非常，非常基本的。我发消息，等待回复。中提琴,做。

我对回调函数的理解告诉我chrome.tabs.sendMessageWILL等待响应THEN运行函数，但是函数运行了会发生什么?我完全搞不懂它只是运行它接收asap而不等待内容脚本完成。那么回调函数的意义是什么呢?

我已经尝试在发送和等待回调函数和任何可能的方式之前添加等待，但它不起作用。我不明白。程序直接运行，不需要等待。

我读过这不起作用。这毫无意义。承诺等待"完成";消息，不知何故，这让它等待。但标签。消息回调函数也等待响应，但仍然运行，不等待任何东西?

document.addEventListener('DOMContentLoaded', async function() {
console.log('got tabs id');
tab = await getCurrentTab();
console.log('Active tab ' + tab.id);
console.log('Sending Message to Content');
chrome.tabs.sendMessage(tab.id, {action: "getDOM"},function (ret) {
console.log('Receiving Message from Content');
try {
if (!ret.incident.length) return;
globalThis.response = ret;
processResponse(response);
}
catch(err) {
console.log('doing nothing, bad return data')
window.close;
return;
}
});
return;
}); 

Answer 1

OP显然很困惑。Callback, async/await, promise都是一样的东西，只是写得不同而已。下面是更新后的代码，只使用承诺，并在绝对必要时使用回调。在这种情况下，chrome的tabs.sendMessage不像Firefox那样返回一个承诺。所以它必须使用回调表单。在这种情况下，content_script使用sendResponse超时，它工作正常。

document.addEventListener('DOMContentLoaded', function() {
console.log('got tabs id');
let queryOptions = {active: true, currentWindow: true};
chrome.tabs.query(queryOptions)
.then((tabs) => {
chrome.tabs.sendMessage(tabs[0].id, {action: "getDOM"}, (response) => {
console.log(response);
// processResponse(response);
});
})
.catch((err) => {
console.log(err);
window.close();
return;
});
});