目次
はじめに
『Node.js』は、JavaScriptの実行環境です。サーバーで利用したり、ローカルのCLI（Command Line Interface）環境で用いたりします。この『Node.js』を使い、Web上のデータを収集して、必要な情報を取り出す「Webスクレイピング」を行うための基礎知識を、この本ではまとめます。
Webスクレイピングは、さまざまなプログラミング言語で行えます。そのため、JavaScript以外のプログラミング言語を選択することもできます。
Webスクレイピングを『Node.js』（JavaScript）で行うメリットは、いくつかあります。その特徴を以下に挙げます。
・JavaScriptはWebページの操作に向いており、関数やライブラリー、周辺情報が豊富です。
・ネットワーク処理は待機が多いです。JavaScriptには、こうした処理を扱うための非同期の仕組みが組み込まれています。
これらの特徴は、JavaScriptが、元々Webブラウザー用のプログラミング言語であることに起因しています。『Node.js』を使えば、ふだんWeb開発をしている人の知識を、そのまま応用できます。
この本では、『Node.js』（JavaScript）でWebスクレイピングを行うために、以下の知識を紹介します。
・『Node.js』の開発環境の構築。
・「node」や「npm」コマンドの利用方法。
・JavaScriptの駆け足での基礎知識。
・コア モジュール、npmモジュール、自作モジュール。
・require、importの利用。
・『node-fetch』『jsdom』を利用したファイルのダウンロードやHTMLのパース。
・『Puppeteer』を利用したWebブラウザーの操作や情報の取得。
これらの知識を学ぶことで、『Node.js』を利用してWebスクレイピングを行えるようになることを目指します。
サンプル コードについて
本書には、サンプル コードのデータがあります。巻末のURLからダウンロードできます。
表記関係について
本書に記載されている会社名、製品名などは、一般に各社の登録商標または商標、商品名です。会社名、製品名については、本文中では©、®、™マークなどは表示していません。
第1章 前提知識と開発環境の構築
この章では、本書を読み進める上での前提知識と、開発環境の構築方法について学びます。『Node.js』の導入やトラブルの解消、『Visal Studio Code』の導入や簡単な使い方の説明を行います。
1.1 Node.jsとは
『Node.js』は、JavaScriptの実行環境です。『Node.js』では「V8 JavaScript エンジン」を利用しています。このエンジンの開発元はGoogleで、『Google Chrome』などで利用されています。
『Node.js』の最初の公開は2009年（v0.0.1）です。元々、サーバー向けに開発されたもので、非同期に処理を実行することが特徴でした。現在では、ローカルのJavaScript実行環境としてもよく利用されています。
・同期処理。
─待ち時間がある処理の終了を待って、次の処理を進める方式です。
─待っている間、処理が止まります。
─プログラムは順番に進むので単純です。
・非同期処理。
─待ち時間がある処理の終了を待たずに、次の処理を進める方式です。
─待っている間も処理が止まりません。
─プログラムは順番に進まないので、同期処理よりも複雑です。
以下に、同期処理と非同期処理の概念図を示します。
『Node.js』の公式サイトや、ドキュメントのページは、以下のとおりです。
Node.js
https://nodejs.org/ja/
ドキュメント | Node.js
https://nodejs.org/ja/docs/
『Node.js』は、さまざまなモジュールが充実しています。ファイル操作や通信といった数多くのコア モジュール（標準モジュール）を持ちます。コア モジュールは、特別な追加インストールなしで最初から使える機能です。
ただし注意が必要です。コア モジュールは過去に何度か破壊的な変更が入っています。そのためサンプル コードを見るときなどは、利用している『Node.js』のバージョンとドキュメントの確認が必須となります。
また、『Node.js』では、npm（Node Package Manager）というコマンドが利用できます。このコマンドを使うと、Web上にある同名のパッケージ公開先「www.npmjs.com」からパッケージ（モジュール）をダウンロードしてインストールできます。依存するパッケージも、自動でダウンロードしてインストールしてくれます。
現在では非常に多くのパッケージが公開されており、自身のプロジェクトに利用可能です。以下は、NPMのサイトのURLです。
npm
https://www.npmjs.com/
外部のプログラムはモジュールとして読み込み可能です。自分でモジュールを作ることもできます。
モジュールの読み込みシステムは、元々「require」を使う方式でした。近年では、Web標準となった「import」方式も使えます。コア モジュールのドキュメントは、既に「import」方式に変わっています。「require」と「import」は、それぞれ長所と短所があり、現状併存しています。
・外部のプログラムの読み込み方法
─「require」を使う方式
─「import」を使う方式
JavaScript自体の仕様については、MDN（『Mozilla Firefox』を作っているMozillaのサイト）を参考にするとよいです。詳しい仕様がまとまっています。
各種の組み込み関数やオブジェクトの詳しいプロパティーやメソッドについて調べたいときは、MDNを利用するとよいです。たとえばGoogleなどの検索エンジンで「mdn array」と検索すれば、MDNのArray（配列）についてのページにたどり着けます。仕様を確かめるには、この方法がよいです。
以下は、MDNのJavaScriptについてのページのURLです。
JavaScript | MDN
https://developer.mozilla.org/ja/docs/Web/JavaScript
1.2 Node.jsのインストール
『Node.js』は、公式サイトからインストーラーをダウンロードしてインストールできます。別途バージョン管理ツールを導入する方法もありますが、初めて使う場合は公式からインストールする方が無難です。
ダウンロードしたあと、CLI環境で以下のコマンドのいずれかを実行してください。正しくインストールできていれば、バージョン番号が表示されます。
node --version
node -v
また「npm」コマンドが利用可能になっているかも確認します。「npm」は「Node Package Manager」の略です。『Node.js』をインストールすると一緒にインストールされます。「npm」は『Node.js』とは別にバージョンがあります。
CLI環境で以下のコマンドのいずれかを実行してください。正しくインストールできていれば、バージョン番号が表示されます。
npm --version
npm -v
「npm」コマンドは、以下のことを行うツールです。
・プロジェクトを作成します。
・「npm」サイトに公開されているパッケージの、インストールや更新などを行います。
1.3 WindowsでPathが通っていないとき
Windows で『Node.js』のインストール後に「node -v」が失敗する場合があります。その際は、環境変数の「Path」に『Node.js』をインストールしたディレクトリーのパスが追加されていない可能性があります。
もし「node -v」が失敗する場合は、以下の手順で『Node.js』のパスを追加してください。
１．「Win + S」で検索ダイアログを開きます。
２．「システムの詳細」と検索して「システムのプロパティ」ダイアログを開きます。
３．「環境設定」タブの「環境変数」ボタンを押して「環境変数」ダイアログを開きます。
４．「システム環境変数」の「Path」を選択します。
５．「編集」ボタンを押して「環境変数名の編集」ダイアログを開きます。
６．「新規」ボタンを押して「Node.jsをインストールしたパス」（通常は「C:\Program Files\nodejs\」）を追加します。
設定を行ったあと、全てのプロセスに設定を反映するにはWindowsを再起動します。アプリケーション単位で反映するには、そのアプリケーションを再起動します。
Windows専用ではないプログラムをWindowsに導入するときには、こうした問題が発生することが多いです。他のプログラムを利用する際にも、覚えておいた方がよいです。
1.4 WindowsでNODE_PATHが設定されていないとき
『Node.js』で「グローバル」にパッケージをインストールしたあと「require(～)」関数で読み込むときには、環境変数『NODE_PATH』の値を利用します（現在の推奨は、グローバルを使わずに、プロジェクトごとに「ローカル」インストールすることです）。
Windowsで「NODE_PATH」が設定されているかは、CLI環境で、以下のコマンドを実行するとわかります。
echo %NODE_PATH%
「C:\Users\＜ユーザー名＞\AppData\Roaming\npm\node_modules」のようなパスが出力されれば、正しく設定できています。
パスが正しく設定されていない場合は、以下のコマンドで出力されるパスを、環境変数「NODE_PATH」に登録する必要があります。以下は「npm」で、グローバルのルートの場所を出力するコマンドです。
npm root -g
こちらで表示されたパス（「C:\Users\＜ユーザー名＞\AppData\Roaming\npm\node_modules」のようなパス）を、以下の方法で追加します。
１．「Win + S」で検索ダイアログを開きます。
２．「システムの詳細」と検索して「システムのプロパティ」ダイアログを開きます。
３．「環境設定」タブの「環境変数」ボタンを押して「環境変数」ダイアログを開きます。
４．「システム環境変数」の「NODE_PATH」を選択します（なければ新規に作成します）。
５．「編集」ボタンを押して「システム変数の編集」ダイアログを開きます。
６．「変数値」にパスを入力して、「OK」ボタンを押します。
1.5 Visal Studio Codeのインストール
Visal Studio Codeとは
『Visal Studio Code』は、プログラミング用のエディターです。『VSCode』と略されることも多いです。
無料で利用でき、シンタックス ハイライトや、各種開発用の機能、多彩なプラグインによる拡張性を備えています。
このエディターはMicrosoftが開発しており、『Electron』でできています。『Electron』は、『Node.js』に、『Googole Chrome』と同じWebレンダリング エンジンを統合した実行環境です。
『Visal Studio Code』は近年非常に人気があり、Web開発の現場で非常によく利用されています。まだ利用していない場合は導入しておくとよいです。
Visal Studio Codeのインストール
開発用のエディターとして、『Visal Studio Code』をインストールしましょう。以下のサイトから入手して、インストールを行います。
Visual Studio Code – コード エディター | Microsoft Azure
https://azure.microsoft.com/ja-jp/products/visual-studio-code/
『Visal Studio Code』のウィンドウに、開発しているプロジェクトの「ディレクトリー」をドロップして使います。ディレクトリーをドロップすると、そのディレクトリーをルートにして、ファイルなどを開くことができます。
ディレクトリーを開くと、画面の左側にファイルとディレクトリーが表示されます。ファイルをクリックして開くと、拡張子の種類に合わせてハイライト表示されます。
設定の変更
『Visal Studio Code』の各種設定を変更するには「Ctrl+,」のショートカットを使います。設定のリストが表示されます。
1.6 Visal Studio Codeの利用
Visal Studio Code内でプログラムを実行1
『Visal Studio Code』内でプログラムを実行する方法を示します。「Ctrl+@」でターミナル タブ（CLI環境）を開きます。そこで「node .」（node 半角スペース ドット）コマンドを実行すれば、カレント ディレクトリーでプロジェクトを実行できます。
node .
Visal Studio Code内でプログラムを実行2
『Visal Studio Code』内でプログラムを実行する方法は、他にもあります。『Visal Studio Code』のデバッグ機能を利用することです。この場合は、ブレークポイントを設定できます。
「とりあえず実行したい」「とりあえず開発したい」という場合は、前述の1の方法でよいです。2の方法は、『Visal Studio Code』のデバッグ機能を使いたいとき用のものです。
『Visal Studio Code』のデバッグ機能は、以下の方法で利用できます。
１．ウィンドウ左の「Run and Debug」ボタン（三角に虫のアイコン）をクリックします。「Ctrl+Shift+D」のショートカットを使ってもかまいません。
２．ウィンドウ左側の領域に「RUN AND DEBUG」パネルが表示されます。
以降は、状況により処理が分岐します。
A.「Run and Debug」ボタンを利用する
１．パネルに「Run and Debug」ボタンが表示されるのでクリックします。
２．「Select environment」のメニューが表示されますので「Node.js」を選びます。
３．「DEBUG CONSOLE」がウィンドウ下に表示されます。
B.「create a launch.json file」を利用する
１．パネルに「create a launch.json file」ボタンが表示されるので、クリックします。
２．「Select environment」のメニューが表示されますので、「Node.js」を選びます。
３．「.vscode/launch.json」が作成されます。
４．「DEBUG CONSOLE」がウィンドウ下に表示されます。
C.「create a launch.json file」を既に選択したあと
１．パネルに「Launch Program」ボタンが表示されるので、左横の「Start Debugging」ボタン（三角ボタン）をクリックします。あるいは「F5」を押します。あるいはメニューの「Run」＞「Start Debugging」を押します。
２．「DEBUG CONSOLE」がウィンドウ下に表示されます。
D. 使用を始めたあとに設定を変更する
「Select Environment」を再び出して選び直す場合は、以下のようにします。
１．左柱の「Run & Debug」をクリックして表示します。
２．「Run & Debug」ボタンを押して、すばやく上部の歯車アイコンを押します。
３．「Select Environment」が出るので切り換えます。