Puppeteer を使用して Linux (CentOS) で Web ページのスクリーンショット機能を実装する

Puppeteer を使用して Linux (CentOS) で Web ページのスクリーンショット機能を実装する

Linux に puppeteer をインストールするときに、次の問題が発生する可能性があります。この記事では、この難問から抜け出す方法を説明します。

> [email protected] をインストール /www/node_modules/puppeteer
> ノードのインストール.js

エラー: Chromium r706915 のダウンロードに失敗しました。ダウンロードをスキップするには、「PUPPETEER_SKIP_CHROMIUM_DOWNLOAD」環境変数を設定してください。
{ エラー: EACCES: 権限が拒否されました、mkdir '/www/node_modules/puppeteer/.local-chromium'
-- 非同期 --
BrowserFetcher.<匿名> (/www/node_modules/puppeteer/lib/helper.js:111:15) で
オブジェクト.<anonymous> (/www/node_modules/puppeteer/install.js:62:16)
Module._compile (module.js:635:30) で
Object.Module._extensions..js (module.js:646:10) で
Module.load (module.js:554:32) で
tryModuleLoad (module.js:497:12) で
Function.Module._load (module.js:489:3) で
Function.Module.runMain (module.js:676:10) で
起動時 (bootstrap_node.js:187:16)
bootstrap_node.js:608:3 で
エラー番号: -13,
コード: 'EACCES'、
システムコール: 'mkdir',
パス: '/www/node_modules/puppeteer/.local-chromium' }
npm WARN enoent ENOENT: そのようなファイルまたはディレクトリはありません。'/www/package.json' を開いてください
npm WARN www 説明なし
npm 警告 www リポジトリ フィールドがありません。
npm 警告 www README データがありません
npm 警告 www ライセンスフィールドがありません

puppeteer を正常にインストールし、実際にスクリーンショットを撮ったプロセスは次のとおりです。

1. nodejsとnpmをインストールする

# ダウンロードして解凍します wget -c https://nodejs.org/dist/v8.9.1/node-v8.9.1-linux-x64.tar.xz
tar -xvf ノード-v8.9.1-linux-x64.tar.xz
# 移動と名前の変更(オプション)
mv ノード-v8.9.1-linux-x64 /www/nodejs
# ソフトリンク(ショートカット)を作成します。前の手順の名前が異なる場合は、実際の状況に応じてこの手順の下線部分を調整してください。ln -s /www/nodejs/bin/node /usr/local/bin/node
ローカルの Node.js ディレクトリに npm と入力し、

2. クロムをインストールする

yum install chromium

3. puppeteer-core をインストールします (puppeteer を直接インストールすると、chromium をダウンロードできないためエラーが発生します)

npm i puppeteer-core

4. 新しいa.jsを作成する

'puppeteer-core' が必要です。
(非同期() => {
 const browser = puppeteer.launch({
 実行可能パス: '/usr/bin/chromium-browser',
 引数:["--no-sandbox"]
 });
 const page = browser.newPage() を待機します。
 page.goto('https://www.baidu.com') を待機します。
 page.screenshot({path: 'example.png'}); を待ちます。
 ブラウザを閉じるのを待ちます。
})();

このステップのコードは、インターネット上のものとは異なる場合があります。1つは、requireのコードがpuppeteerではなくpuppeteer-coreであることです。これは、puppeteerではなくpuppeteer-coreをインストールしたためです。

もう1つは、起動時に2つのパラメータがあることです。最初のパラメータは、Puppeteerを直接インストールしていないため、パスを指定する必要があります。2番目のパラメータは、Chromiumの制限によるもので、ルートアカウントで実行するためにこのパラメータを追加する必要があります。

5. a.jsを実行する

node a.js

実行後、example.pngが表示されます。

注意: ページに中国語が含まれている場合、中国語フォントがないため正しく表示されない可能性があります。解決策は、コンピュータ上の c:/windows/fonts にある中国語フォントをサーバーの /usr/share/fonts/chinese に直接アップロードすることです (デフォルトでは中国語ディレクトリがないため、自分で作成できます)。 : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : :

Puppeter 関連ドキュメント https://pptr.dev/

要約する

以上、Linux(centos)でpuppeteerを使ってWebページのスクリーンショット機能を実現する方法についてご紹介しました。参考になれば幸いです。

以下もご興味があるかもしれません:
  • Linux 向けの強化されたスクリーンショットと共有ツール: ScreenCloud
  • Linux に MySql をインストールする手順の詳細なスクリーンショット
  • Linux で PHP を使用して Web サイトのスクリーンショットを撮る方法
  • Linux でスクリーンショットを共有するためのスクリプトを Python を使って記述するチュートリアル

<<:  MySQLリモート接続権限の詳細な説明

>>:  Vue命令の実装原理の分析

推薦する

Django プロジェクトを作成して MySQL に接続する方法

1: django-admin.py startproject プロジェクト名2: cd プロジェク...

MySQL DMLステートメントの使用に関する詳細な説明

序文:前回の記事では、注意深い学生であれば発見できたかもしれない DDL ステートメントの使用法を中...

nginx.pid を開く際の失敗と無効の解決策

目次1. 問題の説明2. 問題分析3. 解決策解決策1: ディレクトリを作成する解決策2: 構成ファ...

Vue双方向バインディングの詳細な説明

目次1. 双方向バインディング2. 他のタグを選択した場合にも同じ結果になりますか? 答えはもちろん...

カスタム Docker イメージを作成するための Dockerfile の詳細な説明と CMD と ENTRYPOINT 命令の比較

1. 概要Docker イメージを作成するには、次の 3 つの方法があります。 Docker コミッ...

CSSはフロートをシミュレートして、画像の左右を囲む中央テキストの効果を実現します。

画像の周囲にテキストを折り返すとは何ですか?これは次の図の効果です。 エフェクトのCSSコードはここ...

HTML に埋め込まれた Flash HTML ウェブページ コードに Flash ファイルを埋め込むソリューション (パート 2)

上の記事で、SWFObject V1.5 の使い方の紹介は一旦終了です。これから、SWFObject...

初心者向けMySQLインデックス

序文MySQL インデックスで最も重要なデータ構造は B+ ツリーなので、まずは B+ ツリーの原理...

テーブルを使用する場合と CSS を使用する場合 (経験の共有)

TW のメインテキスト ページは、以前は小さなモニターと低解像度のユーザーを考慮して幅が 850 ピ...

Kubernetes を使用して Springboot または Nginx をデプロイするための詳細なチュートリアル

1 はじめに「Maven がワンクリックで Springboot を Docker リポジトリにデプ...

要素の水平方向の中央揃えを実現する3つの方法と、固定レイアウトとフローレイアウトの概念の理解

CSS でテキストを中央揃えにするプロパティは非常に簡単に実現できます。text-align:cen...

MySQL のデッドロック チェックとデッドロック除去の例の詳細な説明

1. クエリプロセスプロセスリストを表示2. 対応するプロセスを照会し、IDを強制終了します。検証(...

NginxはLua+Redisを使用してIPを動的にブロックします

1. 背景日常的なウェブサイトのメンテナンスでは、このような要件に頻繁に遭遇します。特定のクローラー...

HTMLでのラジオ値の取得、割り当て、登録の詳細な説明

1. ラジオのグループ化名前が同じであれば、それらはグループであり、つまり、次のようにグループ内で選...

CSS 命名: BEM、スコープ付き CSS、CSS モジュール、CSS-in-JS の説明

CSS の適用範囲はグローバルです。プロジェクトがどんどん大きくなり、参加する人が増えるにつれて、命...