Ako používať hodnotenieOnNewDocument a exposeFunction? - javascript, bábkar

Nedávno som použil Puppetera na nový projekt.

Mám niekoľko otázok o tej časti rozhrania API, ktoré neviem pochopiť. Dokumentácia je veľmi jednoduchá pre tieto úvody API:

1. page.exposeFunction
2. page.evaluateOnNewDocument

Môžem mať podrobné demo, aby som lepšie pochopil?

odpovede:

Zhrnutie:

Funkcia Puppeteer page.exposeFunction() v podstate vám umožňuje prístup k funkcii Node.js v prostredí DOM Environment.

Na druhej strane, page.evaluateOnNewDocument() vyhodnotí preddefinovanú funkciu pri vytvorení nového dokumentu a pred vykonaním ktoréhokoľvek zo svojich skriptov.

Na Dokumentácii Bábkár page.exposeFunction() uvádza:

page.exposeFunction (názov, puppeteerFunction)

• name <povrázok> Názov funkcie na okno objekt
• puppeteerFunction <funkcie> Callback funkciu, ktorá sa bude nazývať Bábkár "s kontextu.
• vráti: <sľub>

Metóda pridá funkciu nazýva name na stránke "s window objekt. Keď volal, vykonáva funkciu puppeteerFunction node.js a návraty sľub ktorý rieši vráti hodnotu puppeteerFunction.

Ak puppeteerFunction vráti a sľub, to bude očakávaná.

POZNÁMKA Funkcie inštalované prostredníctvom page.exposeFunction prežiť navigácie.

Príkladom pridania md5 funkcie na stránke:

const puppeteer = require("puppeteer");
const crypto = require("crypto");

puppeteer.launch().then(async browser => {
const page = await browser.newPage();
page.on("console", msg => console.log(msg.text()));
await page.exposeFunction("md5", text =>
crypto.createHash("md5").update(text).digest("hex")
);
await page.evaluate(async () => {
// use window.md5 to compute hashes
const myString = "PUPPETEER";
const myHash = await window.md5(myString);
console.log(`md5 of ${myString} is ${myHash}`);
});
await browser.close();
});

Príkladom pridania window.readfile funkcie na stránke:

const puppeteer = require("puppeteer");
const fs = require("fs");

puppeteer.launch().then(async browser => {
const page = await browser.newPage();
page.on("console", msg => console.log(msg.text()));
await page.exposeFunction("readfile", async filePath => {
return new Promise((resolve, reject) => {
fs.readFile(filePath, "utf8", (err, text) => {
if (err)
reject(err);
else
resolve(text);
});
});
});
await page.evaluate(async () => {
// use window.readfile to read contents of a file
const content = await window.readfile("/etc/hosts");
console.log(content);
});
await browser.close();
});

Okrem toho Dokumentácii Bábkár page.evaluateOnNewDocument vysvetľuje:

page.evaluateOnNewDocument (pageFunction,... args)

• pageFunction <funkcie|povrázok> Funkcia vyhodnotiť v kontexte prehliadača
• ...args <...Serializable> Argumenty prejsť do pageFunction
• vráti: <sľub>

Pridáva funkcie, ktoré by vyvolá v jednom z týchto scenárov:

• vždy, keď je navigovať stránky
• kedykoľvek dieťa rám je pripojený alebo navigovať. V tomto prípade sa vyvolá funkcia v rámci novo pripojenej rám

Funkcia sa vyvolá po bol dokument vytvorený, ale skôr, ako niektorý z jeho skripty sa spustiť.To je užitočné doplniť JavaScriptu prostredí, napríkladsemeno Math.random.

Príklad vyššieho vlastnosť navigator.languages pred stránku zaťaženie:

// preload.js

// overwrite the `languages` property to use a custom getter
Object.defineProperty(navigator, "languages", {
get: function() {
return ["en-US", "en", "bn"];
}
});

// In your puppeteer script, assuming the preload.js file is in same folder of our script
const preloadFile = fs.readFileSync("./preload.js", "utf8");
await page.evaluateOnNewDocument(preloadFile);