弹出窗口读取"/>
如何从 Puppeteer 中的弹出窗口读取
当预订网站显示近期有新的约会(例如通过取消)时,我正在尝试接收通知。有问题的网站是 booksy.
我写了一个 Puppeteer 脚本,它将导航到页面并单击一个按钮,然后将打开一个弹出窗口,显示有关下一个可用约会时间的文本。该脚本适用于此。
我的下一步是让脚本实际读取弹出窗口的内容。这是一个问题,因为它只是试图在弹出窗口打开之前阅读原始页面。
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({ headless: false });
const page = await browser.newPage();
await page.goto('');
await page.waitForSelector('button[data-testid="service-button"]');
const button = await page.$('button[data-testid="service-button"]');
await button.click();
})();
我认为如果我可以阅读该页面,我可以提取显示的月份和日期,并可能根据当前日期评估该输出并确定它是否在未来 7 天之类的时间范围内。如果在那个时期内给我发通知。
我要问的只是我如何实际评估内容弹出窗口,将它的月份和/或日期作为输出。谢谢!
回答如下:预订模式在框架中,因此您可以使用
.contentFrame()
访问它并像页面对象一样调用它的方法:
const puppeteer = require("puppeteer"); // ^19.7.5
const url = "<Your URL>";
let browser;
(async () => {
browser = await puppeteer.launch();
const [page] = await browser.pages();
await page.goto(url, {waitUntil: "domcontentloaded"});
const btn = await page.waitForSelector(
'button[data-testid="service-button"]'
);
await btn.click();
const frameEl = await page.waitForSelector(
'[data-testid="booking-widget"]'
);
const frame = await frameEl.contentFrame();
await frame.waitForSelector(".chip div");
const dates = await frame.$$eval(".chip", els =>
Object.fromEntries(
els
.map(e =>
[...e.querySelectorAll("div")].map(e => e.textContent)
)
.filter(Boolean)
)
);
console.log(dates);
})()
.catch(err => console.error(err))
.finally(() => browser?.close());
我不完全确定你想要什么数据,但这给了你一周的日期。我希望你能从这里拿走它。
几点提示:
- 您通常不必在
之后重新选择,这返回它找到的元素。waitForSelector
- 让脚本运行后,考虑阻塞资源您需要的数据不需要的资源。这是一个缓慢的页面。
- 您想要的数据可能在您可以拦截的网络响应中,避免必须处理框架。但是如果你想对该模态采取行动,上面显示的 DOM 方法无论如何都值得一看。
更多推荐
如何从 Puppeteer 中的弹出窗口读取
发布评论