我正在尝试使用伪造者https://jcc.org/park-heights-indoor-pool-registration抓取此页面，并将部分数据放入数组（事件时间，标题，注册链接等）中。
我将要抓取的页面的html复制到了本地html文件中，并且一切正常（使用完全相同的代码！），但是对于puppeteer，它返回空错误。最重要的是，当我选择一个元素时，收集所有数据都不会出错！
代码：
const puppeteer = require('puppeteer');
(async () => {
let jcc_url = 'https://jcc.org/park-heights-indoor-pool-registration';
let browser = await puppeteer.launch();
let page = await browser.newPage();
await page.goto(jcc_url, {waitUntil: 'networkidle0'});
let data = await page.evaluate(() => {
let slots_array = [];
$(".GXPEntry").each(function (index, element) {
slots_array[index] = {
index: index,
cancelled: undefined,
time: element.querySelector(".GXPTime").textContent,
title: element.querySelector('.GXPTitle').textContent,
link: element.querySelector('a.signUpGXP').getAttribute("href"),
availability: element.querySelector('div.GXPDescription span').textContent,
dayOfWeek: element.querySelector('a').getAttribute('data-date')
};
if (slots_array[index].title === "CANCELED: Lap Swimming - Men's Only"
||
slots_array[index].title === "CANCELED: Lap Swimming - Women's Only") {
slots_array[index].cancelled = true;
} else {
slots_array[index].cancelled = false;
}
});
return slots_array;
});
console.log(data);
await browser.close();
})();
这是我要定位的页面的HTML布局：
<div class="GXPEntry">
<div class="GXPTime">8:15am-9:00am</div>
<div class="GXPTitle"><img src="https://groupexpro.com/schedule/logos/custom/logo_53760.jpg"
style="display: block; max-height: 30px; max-width: 120px; padding: 0px 5px 5px 0px;"
title="">Lap Swimming - Men's Only<span
style="position: relative; top: 2px; left: 4px;"><a class="signUpGXP removeIconGXP"
href="https://groupexpro.com/gxp/reservations/start/index/11814665/10/05/2020?e=1"
title="This class requires a reservation"><i
style="background-image: url('https://groupexpro.com/gxp/design/img/glyphicons-halflings.png'); background-position: -96px -72px; background-repeat: no-repeat; display: inline-block; height: 14px; vertical-align: text-top; width: 14px; position: relative; top: 0px; left: -4px; float: left; margin-right:6px; "></i></a></span>
</div>
<div class="GXPInstructor">Staff</div>
<div class="GXPStudio">Indoor Pool </div>
<div class="GXPCategory">Aquatics</div>
<div class="GXPLocation">Park Heights</div>
<div class="GXPDescription">
<a 11814665 alt="11814665" class="descGXP" data-date="10/05/2020" href="javascript://""="">Description</a>
|
<a alt="11814665" class="signUpGXP"
href="https://groupexpro.com/gxp/reservations/start/index/11814665/10/05/2020?e=1"
textmsg="3 SPOTS LEFT">
Sign Up</a>
<a alt="Add to Calendar" class="addToCalendar" href="#">
<img alt="Add to Calendar" border="0" height="14" src="https://groupexpro.com/schedule/embed/images/ics.gif">
</a>
<br><br><span>3 SPOTS LEFT</span>
</div>
我只是想从具有.signUpGXP类的链接，最后一个span标签“ 3 SPOTS LEFT”中的文本，来自div.GXPTitle的标题文本以及data-date中第一个链接的div.GXPDescription属性。
如果我将HTML复制到本地文件中，这在jQuery上可以正常工作，但是在pupputeer中它不起作用，并给我这个错误：
(node:22638) UnhandledPromiseRejectionWarning: Error: Evaluation failed: TypeError: Cannot read property 'getAttribute' of null
at HTMLDivElement.<anonymous> (__puppeteer_evaluation_script__:12:59)
at Function.each (https://jcc.org/sites/default/files/js/js_POjCvph0DpQRBLbuAoUSghIegyfU_5lXHo4ESl4z0tw.js:2:2975)
at $.fn.init.each (https://jcc.org/sites/default/files/js/js_POjCvph0DpQRBLbuAoUSghIegyfU_5lXHo4ESl4z0tw.js:2:835)
at __puppeteer_evaluation_script__:5:24
at ExecutionContext._evaluateInternal (/Users/moshe/coding-workspace/jcc-ph-pool-register/node_modules/puppeteer/lib/cjs/puppeteer/common/ExecutionContext.js:217:19)
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at async ExecutionContext.evaluate (/Users/moshe/coding-workspace/jcc-ph-pool-register/node_modules/puppeteer/lib/cjs/puppeteer/common/ExecutionContext.js:106:16)
at async /Users/moshe/coding-workspace/jcc-ph-pool-register/app.js:13:16
(node:22638) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:22638) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
不太清楚为什么找不到该属性。如果我这样做的话，它完全可以正常工作：
const puppeteer = require('puppeteer');
(async () => {
let jcc_url = 'https://jcc.org/park-heights-indoor-pool-registration';
let browser = await puppeteer.launch();
let page = await browser.newPage();
await page.goto(jcc_url, {waitUntil: 'networkidle2'});
let data = await page.evaluate(() => {
let time = document.querySelector('.GXPTime').innerText;
let title = document.querySelector('.GXPTitle').innerText;
let availability = document.querySelector('.GXPDescription span').innerText;
let link = document.querySelector('.signUpGXP').href;
let dayOfWeek = document.querySelector('.GXPDescription a').getAttribute('data-date');
return {
time,
title,
availability,
link,
dayOfWeek
}
});
console.log(data);
debugger;
await browser.close();
})();
我在这里获得了所有数据，但是只有页面的第一部分。
我希望能对此有所帮助。谢谢！
答案 0 :(得分：1)
如果在浏览器中运行评估函数，则会遇到相同的错误。似乎问题在于，已取消的事件没有注册链接。