Pricing
Pay per usage
Example showing how to use headless Chromium with Puppeteer to open a web page, fetch the list of DOM nodes on the pages and obtain CSS styling information for each HTML element. The actor uses the Chrome DevTools Protocol to access the required browser functionality.
0.0 (0)
Pricing
Pay per usage
3
73
1
Last modified
3 years ago
# This is a template for a Dockerfile used to run acts in Actor system.# The base image name below is set during the act build, based on user settings.# IMPORTANT: The base image must set a correct working directory, such as /usr/src/app or /home/userFROM apify/actor-node-puppeteer-chrome:15-10.1.0
# Second, copy just package.json and package-lock.json since it should be# the only file that affects "npm install" in the next step, to speed up the buildCOPY package*.json ./
# Install NPM packages, skip optional and development dependencies to# keep the image small. Avoid logging too much and print the dependency# tree for debuggingRUN npm --quiet set progress=false \ && npm install --only=prod --no-optional \ && echo "Installed NPM packages:" \ && (npm list --all || true) \ && echo "Node.js version:" \ && node --version \ && echo "NPM version:" \ && npm --version
# Copy source code to container# Do this in the last step, to have fast build if only the source code changedCOPY . ./
# NOTE: The CMD is already defined by the base image.# Uncomment this for local node inspector debugging:# CMD [ "node", "--inspect=0.0.0.0:9229", "main.js" ]1const Apify = require('apify');2
3Apify.main(async () => {4 const input = await Apify.getValue('INPUT');5 6 if (!input || !input.url) throw new Error('Invalid input, must be a JSON object with the "url" field!');7 8 console.log('Launching Puppeteer...');9 const browser = await Apify.launchPuppeteer();10 11 console.log(`Opening URL: ${input.url}`); 12 const page = await browser.newPage();13 await page.goto(input.url);14 15 console.log(`Starting a CDP session`);16 const client = await page.target().createCDPSession();17 await client.send('DOM.enable');18 await client.send('CSS.enable');19 20 console.log('Fetching list of DOM nodes');21 const nodes = (await client.send('DOM.getFlattenedDocument')).nodes;22 23 console.log(`Analyzing CSS for each of the ${nodes.length} node`);24 for (let i=0; i<nodes.length; i++) {25 const node = nodes[i];26 if (node.nodeType === 1) {27 node.matchedStyle = await client.send('CSS.getMatchedStylesForNode', {28 nodeId: node.nodeId29 });30 }31 };32 33 await Apify.setValue('OUTPUT', nodes);34});{ "name": "apify-project", "version": "0.0.1", "description": "", "author": "It's not you it's me", "license": "ISC", "dependencies": { "apify": "1.3.4", "puppeteer": "10.1.0" }, "scripts": { "start": "node main.js" }}