javascript - Puppeteer 始终未定义,但 devtools 适用于嵌套节点列表
问题描述
我是 Puppeteer 的新手,不太确定我在这里做错了什么,但是在 DevTools 中,我得到了正确的输出。但是,我希望使用这些值创建一个文件并继续获取undefined
.
我认为它与节点列表有关,无法返回它们,但我不知道如何修复它。
这适用于 DevTools:
let arr2 = Array.from(document.querySelectorAll(
"#data > div.data-wrapper > div > div > table > tbody tr"))
.map(row => (
{site:row.querySelector('td:nth- child(2)').innerText,
pass:row.querySelector('td:nth- child(10)').innerText,
user:row.querySelector('td:nth-child(9)').innerText
}))
//with a console.log()
我也尝试过row.evaluate(()=>)
这对我不起作用。
这是我的代码不起作用:
(async () => {
const browser = await puppeteer.launch({ headless: false });
const page = await browser.newPage();
await page.authenticate({ username: "username", password: "password" });
await page.goto("https://website/.../all");
await page.waitFor(120000); // beacuse It loads everything slowly and times out the default 30000
console.log("started evalating");
var data = await page.evaluate(() => {
Array.from(
document.querySelectorAll(
"#data > div.data-wrapper > div > div > table > tbody tr"
)
).map(row => {
return {
site: row.querySelector("td:nth-child(2)").innerText,
pass: row.querySelector("td:nth-child(10)").innerText,
user: row.querySelector("td:nth-child(9)").innerText
};
});
});
console.log(data);
})();
//I want an array of objects but the result throws errors or comes back with [undefined,......]
解决方案
传递给的页面函数page.evaluate()
缺少return
语句,因此不返回值。结果,变量data
为undefined
。
您应该注意两个额外的细节:
Array.from()
具有内置map
功能。Array.from(arrayLike, mapFn) // good Array.from(arrayLike).map(mapFn) // bad
-
let data = ... // good var data = ... // bad
这是您的代码的修订版,应该可以正常工作:
'use strict';
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({
headless: false,
});
const page = await browser.newPage();
await page.authenticate({
username: 'username',
password: 'password',
});
await page.goto('https://website/.../all');
await page.waitFor(120000);
console.log('started evalating');
let data = await page.evaluate(() => {
return Array.from(
document.querySelectorAll('#data > div.data-wrapper > div > div > table > tbody tr'),
row => ({
site: row.querySelector('td:nth-child(2)').innerText,
pass: row.querySelector('td:nth-child(10)').innerText,
user: row.querySelector('td:nth-child(9)').innerText,
})
);
});
console.log(data);
})();
推荐阅读
- git - 如何为 xamarin.forms 项目创建自动生成生成?
- ionic-framework - 无法使用 ionic 创建新项目
- php - 会话值未在 PHP 中设置
- java - SLF4J:类路径包含多个 SLF4J 绑定 slf4j-test vs logback-classic
- javascript - 使用 JQuery 加载 JSON
- mysql - MySQL:准备语句失败
- solr - 为什么在 synonyms_query.txt 中为该术语添加同义词后 solr 没有给出任何结果?
- assembly - 与 BNE 执行和标签指令获取相关的流水线停顿
- azure-stream-analytics - 流分析 UDF - 在另一个 UDF 中使用一个 UDF 的输出
- java - 如何在android中按字符串值过滤json对象?