簡體   English   中英

在 puppeteer 上解決特定事件的承諾

[英]Resolve promise on specific event at puppeteer

在特定事件發生后,如何繼續使用我的 puppeteer 代碼? 以一種同步的方式。 例如,我有以下“請求”事件代碼:

await page.on('request', request => {
  if (request.resourceType() === 'xhr'){
    //do something
  }
});

我的 puppeteer 代碼依賴於特定頁面上的 AJAX 調用響應來填充表單。 所以我想我必須以一種方式使請求事件函數在滿足條件時解決承諾以在代碼中稍后使用它作為參考,但我很感激有關該主題的一些指導,因為我不是很熟悉使用異步代碼、promise 或 puppeteer。 謝謝!

您可以在進入頁面之前將page.on('request')包裹在 Promise 中,然后等待這個 Promise 像這樣解決:

const observedXhr = new Promise(resolve =>
  page.on('request', request => {
    if (request.resourceType() === "xhr") {
      resolve();
    }
    request.continue();
  })
);

// later in the code

await observedXhr;

// rest of the program after xhr is compleated

這是完整的示例:

const puppeteer = require('puppeteer');

const html = `
<html>
  <body>
    <script>
      fetch('https://swapi.co/api/people/1/');
    </script>
  </body>
</html>`;

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.setRequestInterception(true);

  const observedXhr = new Promise(resolve =>
    page.on('request', request => {
      if (request.resourceType() === "xhr") {
        resolve();
      }
      request.continue();
    })
  );

  await page.goto(`data:text/html,${html}`);

  console.log('before xhr');

  // await for resolved promise
  await observedXhr;

  console.log('after xhr');
  await browser.close();
})();

這個問題擴展了你的問題——它對你很有價值。

如果我要打開一個頁面,然后去改變它的下拉列表(以過濾數據),並且只希望發生最新的xhr響應,該怎么辦?

例如:

 const browser = await puppeteer.launch({headless: true, devtools: false}); const page = await browser.newPage(); page.on('response', async (response) => { let textResponse = await response.text(); console.log(textResponse); } }); await page.goto('url'); //click some drop downs on the page await page.click('.ddl-genders'); 

在這種情況下我應該如何進行? 謝謝

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM