如何强制我的 chrome 扩展程序等到请求结束才能发送另一个请求？

Question

我正在创建一个在某个网站上运行的 chrome 扩展程序来自动执行网站中的某些任务，该扩展程序获取一组数据并一个一个地发送它们（模仿点击网站中的按钮将数据发送到后端），所以我正在自动化异步重复任务。

但问题是我在点击发送按钮后没有收到网站返回的任何数据，因为我不是创建该网站的所有者或开发者

该网站就像一家书店，您需要按名称搜索该书，然后再对该书进行进一步处理，我的扩展程序是关于自动化该过程的，因此无需从该网站搜索该书 UI，该扩展程序有许多输入，可以接受多个书名，然后通过模仿单击网站中的发送按钮将此集合发送到网站后端 UI

我的问题是，在添加一些书名后单击扩展中的按钮后，我有一个功能可以与集合中的每个项目一起使用，但问题是我需要在每个周期中等待直到网站找到这本书，所以我在这里有异步步骤，这是我真正的问题，我需要等待书籍查找功能完成，然后我才能做进一步的工作

//extension add books button
const addBooks = document.getElementById('add-books');
//books collected from changing the extension inputs
let bookCollection = [{...}, {...}, {...}]

addBooks.addEventListener('click', async () => {
for (let drug of collectedDrugs) {
      let { name, code, price } = book;
      //trying to await the website find the book
      await getBook(name);
    
      await addBook(price, qty);
  }

})

不幸的是，这不起作用，而且这个函数应该适用于集合中的每个项目，等待异步步骤完成，完成该函数，然后对另一本书重复相同的循环，我该如何修复这段代码让它发挥作用！

Answer 1

您必须将异步函数调用移动到侦听器外部的代理，因为本机 eventListener 生态系统有点遗留并且不支持新的异步功能：

function getBook(name){
    console.log("getBook", name);
}

async function getBookProxy(name){
    await getBook(name);
}

document.body.addEventListener('click', () => {
    getBookProxy("bob");
});

如何强制我的 chrome 扩展程序等到请求结束才能发送另一个请求？

How to force my chrome extension wait till a request end to send another request?

html

javascript

google-chrome-extension