この章ではNode.jsをWebサーバとして利用する方法について解説します。
Node.jsとは,Chromeなどで使用されているJavaScriptのインタプリタを独立させたもので,様々なモジュールをnpmコマンドでインストールできるようになっているのが特徴です。
サーバサイドでのWebアプリ開発は,古くはWebサーバから独立に呼び出されて動作するPerl等のスクリプト言語によるCGI(Common Gateway Interface)の利用から始まりました。その後,Webサーバと強調して動作するTomcat(Java),PHP,C#(Microsoft IIS)等の独自言語体系が使われるようになっており,10数年以上の歴史を持つ定番アプリはまだまだ現役です。機械学習用としてPythonが急速に浸透した後はFlaskやDjangoといった,Webサーバ環境を内包したフレームワークも普及しています。
とはいえ,ブラウザで直接扱うHTML, CSS, JavaScript以外に別の言語を覚えることに抵抗を持つ人も少なくないようです。JavaScriptだけでサーバサイドのWeb開発ができれば学習コストが減ること間違いありません。
ことにJavaScriptは,JIT(Just In Time)コンパイラの導入によって,インタプリタ言語が持つ実行時のもたつきが急減し,大規模なスクリプトを高速に実行できるようになりました。このJITコンパイラを持つGoogleのV8 JavaScriptエンジンによってNode.jsは実用的なプログラミング環境として導入が進みました。
2022年現在ではNode.jsを前提としたWeb開発用のフレームワークの開発が盛んで, React,Vueといった定番のものからさらに発展し, TypeScriptを用いたNext.js, NestJS等の利用が盛んになっています。
Node.jsのダウンロードページから,使用する環境(Windows, macOS, Linux)に応じてインストールメディアを入手し,インストールを行います。下記はWindowsにインストール時のウインドウ表記です。
インストール時に必要なファイルや設定の確認を行っています。コマンドライン環境での実行(CUI)が必要になりますので,特に拒否しない限り,実行ファイルを置いたフォルダ位置を"PATH"に追加してくれます。
既に第1章で述べたように,JavaScriptはブラウザのレンダリングエンジンのJavaScriptインタプリタで実行することができました。この場合,HTMLを読み込むことが前提でしたので,JavaScriptは付随的にHTMLファイルに埋め込まれていたわけです。
しかしNode.js環境ではJavaScriptを直接実行することを前提としています。従って,すべてのJavaScriptコードはHTMLなしで,つまり<script>...</script>
を必要としません。以下,拡張子".js"のファイルはHTMLタグなしのJavaScriptスクリプトとして作成していきます。
Cプログラムの最初の教科書がそうであったように,コンソール画面(CUI操作ウィンドウ)に"Hellow, Node.js!"と表示するだけのNode.js用スクリプト"hellow.js"を作成します。
1. まずは下記のソースコードを適当なテキストエディタで作成し,Node.jsが動作する(=nodeコマンドが動く)フォルダに"hellow.js"という名前で保存して下さい。
cosole.log("文字列")
はコンソール画面(Node.jsではCUI画面,ブラウザ上では開発用ウィンドウ)に文字列を表示する命令です。デバッグする際には常用しますので覚えておいて下さい。
2. "hellow.js"を保存したフォルダをカレントフォルダとしてコンソール画面を開きます。Windows 11の場合はファイルマネージャで当該フォルダを右クリックして「Windowsターミナルを開く」という動作になります。macOS, Linuxでも同様の操作が可能です。
コンソール画面が開いたら,下記のようにしてnodeコマンドでカレントフォルダにあるJavaScriptを動かします。
$ node JavaScriptファイル名
下記はWindows 11のターミナルにおける実行時の画面です。”Hellow, Node.js!"と表示されれば実行成功です。
いよいよWebサーバサイドのアプリケーションを作っていきます。先ほどと同様に"Hellow, World!"という表示を,アクセスしてきたブラウザ上に行うアプリを作っていきます。
使用するのはhttpモジュールで,これはNode.jsインストール時にはデフォルトで同梱されている筈です。Webサーバはブラウザと同じマシン上,つまりlocalhost(=127.0.0.1)で動いているものとし,他のWebサーバとバッティングしないよう,TCP 3000番ポートでブラウザからのアクセスを待つ状態にします。
まず,下記のソースコードを先ほどと同様に作成し,"hellow_server.js"という名前で適当なフォルダに保存します。
作成後,先ほどと同様に,コンソール画面をソースコードのあるところをカレントフォルダとして開き,nodeコマンドで"hellow_server.js"を下記のようにして実行して下さい。
サーバですので,実行後は常にブラウザを待つ状態でポーリングします。終了するには[CTRL+C]でnodeコマンドごと強制的にプロセス停止して下さい。
起動したら,適当なブラウザを開き,アドレス欄に"localhost:3000"もしくは"127.0.0.1:3000"と打ち込み,下記の表示が得られることを確認して下さい。
一連の動作ができたところで,先生役の人は"hellow_server.js"の内容を説明するようにして下さい。