puppeteer: Get base64 encoded image without separate download
Yes, you can use response.buffer()
to get the buffer of a resource. You can then turn the buffer into a base64-encoded string by using buffer.toString('base64')
.
Code Sample
The following example goes to the google.com
website, waits for the first PNG resource and then prints its base64-encoded image.
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
const [response] = await Promise.all([
page.waitForResponse(response => response.url().includes('.png')),
page.goto('https://www.google.com/')
]);
const buffer = await response.buffer();
console.log('data:image/png;base64,' + buffer.toString('base64'));
await browser.close();
})();
This code sample waits for a single resource. Alternatively, you could listen to the response
event to download multiple images in the same way.
another solution is:
const base64 = await page.screenshot({ encoding: "base64" })