Using puppeteer to implement webpage screenshot function on linux (centos)

Using puppeteer to implement webpage screenshot function on linux (centos)

You may encounter the following problems when installing puppeteer on Linux. This article will guide you how to get out of the pit!

> puppeteer@2.0.0 install /www/node_modules/puppeteer
> node install.js

ERROR: Failed to download Chromium r706915! Set "PUPPETEER_SKIP_CHROMIUM_DOWNLOAD" env variable to skip download.
{ Error: EACCES: permission denied, mkdir '/www/node_modules/puppeteer/.local-chromium'
-- ASYNC --
at BrowserFetcher.<anonymous> (/www/node_modules/puppeteer/lib/helper.js:111:15)
at Object.<anonymous> (/www/node_modules/puppeteer/install.js:62:16)
at Module._compile (module.js:635:30)
at Object.Module._extensions..js (module.js:646:10)
at Module.load (module.js:554:32)
at tryModuleLoad (module.js:497:12)
at Function.Module._load (module.js:489:3)
at Function.Module.runMain (module.js:676:10)
at startup (bootstrap_node.js:187:16)
at bootstrap_node.js:608:3
errno: -13,
code: 'EACCES',
syscall: 'mkdir',
path: '/www/node_modules/puppeteer/.local-chromium' }
npm WARN enoent ENOENT: no such file or directory, open '/www/package.json'
npm WARN www No description
npm WARN www No repository field.
npm WARN www No README data
npm WARN www No license field

The process I successfully installed puppeteer and actually took screenshots is as follows:

1. Install nodejs and npm

# Download and decompress wget -c https://nodejs.org/dist/v8.9.1/node-v8.9.1-linux-x64.tar.xz
tar -xvf node-v8.9.1-linux-x64.tar.xz
# Move and rename (optional)
mv node-v8.9.1-linux-x64 /www/nodejs
# Create a soft link (shortcut). If the name in the previous step is different, adjust the underlined part of this step according to the actual situation. ln -s /www/nodejs/bin/node /usr/local/bin/node
ln -s /www/nodejs/bin/npm /usr/local/bin/npm

2. Install chromium

yum install chromium

3. Install puppeteer-core (direct installation of puppeteer will result in an error because chromium cannot be downloaded)

npm i puppeteer-core

4. Create a new a.js

const puppeteer = require('puppeteer-core');
(async () => {
 const browser = await puppeteer.launch({
 executablePath: '/usr/bin/chromium-browser',
 args:["--no-sandbox"]
 });
 const page = await browser.newPage();
 await page.goto('https://www.baidu.com');
 await page.screenshot({path: 'example.png'});
 await browser.close();
})();

The code in this step may be different from the one on the Internet. One is that the code in require is puppeteer-core instead of puppeteer, because we installed puppeteer-core instead of puppeteer

The other is that there are two parameters in launch. The first parameter is also because we did not install puppeteer directly, so we need to specify the path. The second parameter is due to some limitations of chromium, and the root account needs to add this parameter to execute

5. Execute a.js

node a.js

After execution, you can see an example.png

Note: If there is Chinese on the page, it may not display properly due to the lack of Chinese fonts. The solution is to directly upload the Chinese fonts in c:/windows/fonts on your computer to /usr/share/fonts/chinese on the server (there is no Chinese directory by default, so you can create one yourself). : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : :

Puppeter related documents https://pptr.dev/

Summarize

The above is what I introduced to you about using puppeteer on Linux (centos) to realize the webpage screenshot function. I hope it will be helpful to you!

You may also be interested in:
  • An enhanced screenshot and sharing tool for Linux: ScreenCloud
  • Detailed screenshots of the steps to install MySql on Linux
  • How to take screenshots of a website using PHP under Linux
  • A tutorial on using Python to write a script for screenshot sharing in Linux

<<:  A brief discussion on the implementation principle of Vue slot

>>:  Detailed explanation of MySQL remote connection permission

Recommend

JS realizes special effects of web page navigation bar

This article shares with you a practical web navi...

HTML+CSS to achieve surround reflection loading effect

This article mainly introduces the implementation...

Vue+Openlayer realizes the dragging and rotation deformation effect of graphics

Table of contents Preface Related Materials Achie...

7 native JS error types you should know

Table of contents Overview 1. RangeError 2. Refer...

Understand the basics of Navicat for MySQL in one article

Table of contents 1. Database Operation 2. Data T...

Awk command line or script that helps you sort text files (recommended)

Awk is a powerful tool that can perform some task...

Detailed explanation and examples of database account password encryption

Detailed explanation and examples of database acc...

How to use the VS2022 remote debugging tool

Sometimes you need to debug remotely in a server ...

Vue3.x uses mitt.js for component communication

Table of contents Quick Start How to use Core Pri...

zabbix custom monitoring nginx status implementation process

Table of contents Zabbix custom monitoring nginx ...

Overview of the definition of HTC components after IE5.0

Before the release of Microsoft IE 5.0, the bigges...

Web form creation skills

In fact, the three tables above all have three ro...