使い方 - HeRoMo/site-checker GitHub Wiki

インストール

利用するには Node.js v10.18.1 以上をインストールしてください。

次のコマンドで site-checker をインストールできます。

$ npm install -g site-checker

インストール後、次のコマンドが動作すればインストールできています。

$ site-checker -h

ローカルマシンに Node.js をインストールするのはちょっとという方にはDockerイメージも用意しています。

使い方

URLを指定してチェックする

次の例のように -u オプションで対象サイトのURLを指定してください。
結果は標準出力にJSON形式で表示されます。
また、アクセスに成功した場合にはスクリーンショットが capture_00000.png というファイル名で保存されます。

$ site-checker -u https://github.com/HeRoMo/site-checker
Target URL: https://github.com/HeRoMo/site-checker
[ { id: '00000',
    url: 'https://github.com/HeRoMo/site-checker',
    status: 200,
    title: 'GitHub - HeRoMo/site-checker: checking web site status and capturing screenshot tool',
    filepath: './capture_00000.png',
    filename: 'capture_00000.png' } ]

URLリストで複数のサイトをチェック

複数のサイトをチェックするには次の例のように -l でURLリストを指定してください。

$ site-checker -l url-list.txt

結果はURLリストファイルと同じディレクトリにファイル名と同じディレクトリが作成され、その中に result.json が作成されます。
アクセスに成功したサイトのスクリーンショットも capture_xxxxx.png というファイル名で出力されます。
--htmlオプションを指定すると、 HTML形式での結果の一覧も index.html に出力します。

URLリストは .txt形式と.csv形式が利用できます。
.txt形式の場合、1行に一つづつURLを記述してください。サンプルはこちらです
.csv形式の場合、最初の行にカラムヘッダーを記載し、必ず "id"と"url"を含めてください。サンプルはこちらです。

オプション

-hオプション

-h オプションで 以下を表示できます。

$ site-checker -h
オプション:
  -u, --url         set the url which is checked and captured           [文字列]
  -l, --list        set the filepath of URL list.                       [文字列]
  -o, --output      set output dir name                                 [文字列]
      --html        output HTML file                  [真偽] [デフォルト: false]
  -d, --device      emulate device name                                 [文字列]
  -f, --fullpage    capture whole page                [真偽] [デフォルト: false]
      --nocache     disable browser cache             [真偽] [デフォルト: false]
      --timeline    access url with tracing timeline. [真偽] [デフォルト: false]
  -s, --screenshot  take a screenshot at access successfully.
                                                       [真偽] [デフォルト: true]
      --auth        basic auth credencial. <username>:<password>        [文字列]
      --version     バージョンを表示                                      [真偽]
  -h, --help        ヘルプを表示                                          [真偽]

-d オプション

エミュレートするデバイスを指定することができます。
このオプションを利用しない場合は PC版のChromeブラウザとしてのアクセスとなります。

次の例では "iPhone X" をエミュレートして指定URLにアクセスします。
保存されるスクリーンショットは "iPhone X" をエミュレートした見た目になります。

$ site-checker -u https://github.com/HeRoMo/site-checker -d "iPhone X"

次のコマンドを実行すると利用可能なデバイス名の一覧が出力されます。

$ site-checker -d

-o オプション

ファイルを出力するディレクトリを指定することができます。
存在しない場合には作成します。

-f オプション

このオプションを利用しない場合、スクリーンショットは ファーストビューの範囲内です。
-dオプション未使用の場合は 1440x900pxのサイズです)
-fオプションを使用すると対象サイトのページ全体のスクリーンキャプチャを保存します。

--timeline オプション

Chrome Dev Tool の Perfomance で取得できるタイムラインを取得します。 タイムラインは timelime_XXXXX.json という名前で保存されます。

Chrome Dev Tool の Perfomance タブにドラッグドロップすれば表示できます。 DevTools Timeline Viewerでも表示できると思います。

--auth オプション

BASIC認証をサポートしています。
--auth オプションに コロン区切りで ユーザ名、パスワードを指定して下さい。

$ site-checker -u https://basic-auth.com --auth username:password

URLリスト(-lオプション利用時) と併用する場合、すべてのURLに同じusername:passwordを利用します。

Docker を利用する場合

すぐに実行できるようにDockerイメージ(hero/site-checker - Docker Hub)も用意しています。

次の様に実行してください。

$ docker run --rm -v <ホストの出力ディレクトリ>:/output:rw ghcr.io/heromo/site-checker:latest -u https://github.com/HeRoMo/site-checker
⚠️ **GitHub.com Fallback** ⚠️