如何从 async/await 函数返回值？

Question

使用 puppeteer 将来自 2 个不同网页的数据收集到数组中以供以后比较。但是程序在继续执行之前不会等待返回的数组。

async function go(){
  try{
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.goto('www.webpage.com');

    const tds = await page.$$('td');
    const data = [];
    for (let i = 0; i < tds.length; i++){
      const td = tds[i];
      const tdcontent = await page.evaluate(td => td.innerText, td);
      if (tdcontent.length > 5) {
        data[i] = {"content": tdcontent};
      }
    }
    return data;
  } catch (e) {
     console.log(e);
  }
};

(async function main(){
  const returnedData = await go();
  console.log(returnedData.length);
})();

返回data.length 是0。 nodejs 新手，async 编程结构。我认为这是因为在返回 data 之前记录了 .length？

我如何以可以操作并完成比较的方式返回数据？

Answer 1

首先，您的page.$$() 函数中缺少撇号。您应该将其更改为：

const tds = await page.$$('td');

接下来，您尝试将一个不存在的变量传递给page.evaluate()。您可以通过传递 tds[i] 而不是 td 来解决此问题：

const tdcontent = await page.evaluate(td => td.innerText, tds[i]);

您的最终结果应如下所示：

const go = async () => {
  try {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();

    await page.goto('www.webpage.com');

    const tds  = await page.$$('td');
    const data = [];

    for (let i = 0; i < tds.length; i++) {
      const tdcontent = await page.evaluate(td => td.innerText, tds[i]);

      if (tdcontent.length > 5) {
        data[i] = {
          content: tdcontent,
        };
      }
    }

    return data;
  } catch (error) {
    console.log(error);
  }
};

(async function main() {
  const returnedData = await go();

  console.log(returnedData.length);
})();

如果您仍然遇到问题，您可能希望使用page.goto( ... , { waitUntil: 'networkidle0' }) 等到页面完全加载，或者使用page.waitForSelector() 等到有问题的元素添加到DOM：

await page.goto('www.webpage.com' , {
  waitUntil: 'networkidle0',
});
// ...
await page.waitForSelector('td');

Answer 2

在这种情况下，我尽量不使用page.$$。相反，我使用document.querySelectorAll 并通过元素映射并提取文本。

这里是修改后的代码：

const getTdData = async () => {
  try {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.goto("http://example.com");

    return page.evaluate(() => {
      // get all td elements
      const tdList = [...document.querySelectorAll("td")]; 
      return tdList.map(element => ({ content: element.textContent }));
    });
  } catch (e) {
    console.log(e);
  }
};

(async function main() {
  const returnedData = await getTdData();
  console.log(returnedData.length);
})();