Node.js｜Sample
CONTENTS
Basic Application
Node.js によるWebアプリケーションの基本を説明するサンプルです。PHPの場合には、Apache Webサーバーの存在が前提でしたが、Node.js の場合は、サーバーごと作ってしまいます。基本的な手順は以下のようになります。
- httpアクセスを可能にするモジュール 'http' を準備する。
- createServer 関数を使って、サーバーを立ち上げる。
（リクエスト・レスポンスに関するプログラムも準備する。） - listen 関数で、リクエストを待ち受ける状態にする。
サーバーというのは要するに、ブラウザから当該 IP の当該ポート（通常は 80番）にリクエストがあれば、HTML を返す・・というプログラムが存在すれば実現できます。Apache のようなサーバーソフトが必須というわけではない・・ということがこの事例を通して体験できるでしょう。
前提
- ローカル（手元のPC）でサーバーを動かすことを前提としたサンプルです。
http://localhost:XXXXX
の形式でアクセスするので、XAMPP等が動いている場合は、衝突を避けるため、それを止めてください。 - Terminalの利用が前提です。
プロジェクトフォルダの作成
- 場所はどこでも構いません。サンプルを置く場所としての、プロジェクトフォルダ（以下、カレントディレクトリと呼びます）を準備して下さい。
- プログラムの起動は Terminal から行います。
当該フォルダを Terminal のアイコンに重ねるようにして Terminal を開くと、その時点で、カレントディレクトリに位置します。 - 念の為、Node.js がインストール済みで、カレントディレクトリからパスが通っていることを再確認して下さい。
$ node -v v11.6.0
上記のようにバージョンが表示されればOKです。
ダメな場合 Node.jsのページでインストールを再確認して下さい。
コーディング
- 以下のコードをテキストエディタにコピーして application.js という名前で、カレントディレクトリに保存します。
// MAIN Program // HTTPオブジェクトの生成（http モジュールの読み込み） const http = require( 'http' ); // サーバーオブジェクトの生成（イベントハンドラを定義） var server = http.createServer( myResponse ) // loaclhost（127.0.0.1）の 8000番ポートで待機 server.listen( 8000 ); // Terminal にメッセージを出力（動作状況、停止方法の説明） console.log('Server running at http://127.0.0.1:8000. QUIT > [CTRL + C]'); // FUNCTION function myResponse( request, response ) { // ヘッダ情報を出力 response.writeHead( 200, {'Content-Type': 'text/plain'}); // コンテンツを出力 response.write('Hello Node.js ! \n'); // EOF（End of File）を出力 response.end(); }
- Terminal から application.js を動かします。
$ node application.js Server running at http://127.0.0.1:8000. QUIT > [CTRL + C]
- この状態で、サーバーは動いています。
- ブラウザを起動して、URL 欄に以下を入力してみてください。
http://127.0.0.1:8000
IPアドレスの 127.0.0.1 は、ローカル・ループバック・アドレスと呼ばれる特別なもので、自分自身を指すIPアドレスです。localhost という名前でも参照できるようになっています。
- ブラウザに以下の表示が確認できると思います。
Hello Node.js!
- ターミナル上でメッセージ表示後、プロンプトも出ず、無反応になったように見えます。以下のキー操作でサーバー停止。プロンプトが表示されます。
CTRL + C
MAIN Program の解説
- var http = require('http')
Node.js には様々な機能モジュールが用意されていて、その代表格が HTTPアクセスを可能にする 'http'モジュールです。
最初の一行で、これを読み込んで、http という名称のオブジェクト（プロパティーとメソッドをもつ機能実体）を生成しています。
- var server = http.createServer( ここに関数名 )
httpオブジェクトの createServer メソッドを使って、server という名称の サーバーオブジェクト（http.Server）を生成しています。
createServer の引数はひとつで、ここに渡す関数にはリクエストとレスポンスの機能を持った関数を渡します。
- server.listen( ポート番号 );
http.Server の listen メソッドは、指定したポート番号での「待ち受け状態」をスタートさせます。Terminal からの停止命令（CTRL+C）があるまでは、常時待ち受け状態になります。指定するポート番号は、80番以外、要するに Well-Known ではない番号がよいでしょう。
FUNCTION myResponse の解説
- function myResponse( request, response ) { ここに処理内容 }
server オブジェクトが実際に機能するためのプログラムです。一般に、以下の２つを引数として持つことが必要で、これらのオブジェクトに関する操作を記述することで、サーバーとしての役割が果たせるようになります。- request
サーバーへの要求を管理するオブジェクト（http.ClientRequest） - response
サーバーからの応答を管理するオブジェクト（http.Server.Response）
- request
- response.writeHead( ステータスコード番号, メッセージ )
レスポンスのヘッダー情報を記述します。- 200番はステータス「正常アクセス」を意味します。
- 'Content-Type': 'text/plain' は「応答内容：プレーンテキスト」の意味。
- response.write( ここに応答内容を記述 );
応答内容を記述します。
- response.end( );
これで応答終了であることを伝えます。
HTML Response
上記の単純応答に対し、index.html ファイルを読み込んで、それを応答として返すサンプルプログラムを紹介します。
プロジェクトフォルダの作成
- 新しいプロジェクトフォルダ（カレントディレクトリ）を準備して下さい。
- ここには、以下の２つのファイルを置く前提です。
- index.html 中身は適当で構いません。
- application.js 次の節で紹介します。
- プログラムの起動は Terminal から行います。
コーディング
- 以下のコードをテキストエディタにコピーして application.js として、カレントディレクトリに保存します。
// MAIN Program // HTTPオブジェクトの生成（ http モジュールの読み込み ） const http = require('http'); // FileSystem オブジェクトの生成（ fs モジュールの読み込み ） const fs = require('fs'); // request と response を格納するための外部変数 var req, res; var server = http.createServer(myResponse) server.listen(8000); console.log('Server running at http://127.0.0.1:8000. QUIT > [CTRL + C]'); // FUNCTIONS function myResponse( request, response ) { // request と response を格納 req = request; res = response; // ファイルの読み込みとコールバック関数の定義 fs.readFile('./index.html','UTF-8', writeHTML ) } function writeHTML( err, html ){ res.writeHead( 200, {'Content-Type': 'text/html'}); res.write( html ); res.end(); }
- Terminal から application.js を動かします。
$ node application.js Server running at http://127.0.0.1:8000. QUIT > [CTRL + C]
- ブラウザを起動して、URL 欄に以下を入力してみてください。
http://127.0.0.1:8000
- ブラウザに以下の表示が確認できると思います。
Hello Node.js index.html を読み込んで表示するサンプル
MAIN Program の解説
- fs = require( 'fs' );
File System モジュールを読み込んで、FileSystemオブジェクトを生成
FUNCTIONS の解説
- function myResponse( request, response ) { }
server オブジェクトが実際に機能するためのプログラム。
- fs.readFile('./index.html','UTF-8', writeHTML )
- カレント（./）にある index.html を読み込む。
- 読み込み終了時に実行するコールバック関数を writeHTML( ) とする。
- function writeHTML( err, html )
- 第１引数 err：読込エラー時の情報オブジェクト（ここでは使ってません）
- 第２引数 html：readFile 関数で読み込んだファイルのデータ
- res.writeHead( 200, {'Content-Type': 'text/html'});
ヘッダー情報として、Content-Type が text/html であることを明記 - res.write( html );
読み込んだHTMLファイルの内容を応答出力
付記
プロンプトの復活
サーバーを起動すると、ターミナルのプロンプト $ が出ない状態になりますが、ターミナル上で以下のキー操作を行うことでサーバーの動作は停止して、プロンプトが表示されます。
CTRL + C
バックグラウンド動作の停止
ターミナルを強制的に閉じたりすると、プロセスが動きっぱなし・・となります。application.js が動きっぱなしは良くないので、動いているプロセスを確認して、それを強制終了する方法も紹介します。
- プロセスの存在を確認します。
$ ps -e | grep node | awk '{print $1}' 2666 2670 - 表示された数字が、プロセスのID です。これを直接 KILL します。
$ kill -9 2666 $ kill -9 2670
- 以上で node 関連のプロセスが終了します。
ポート番号 8000 について
サーバーへのアクセスでは、IPアドレスとポート番号のセットが必要になりますが、通常 HTTPアクセスは 80、HTTPSアクセスなら 443 と決まっていて、アクセス時に省略できることになっています。
それらを含め 0番 から1023番 は Well-known port と呼ばれる番号帯域に位置付けられているので、ここでは 8000 というポート番号を使っていますが、基本的には当該サーバーが使っているポート番号とぶつからない番号を選べばOKです。Node.js のサンプルではこの番号がよく用いられるようです。
Well-known port については、Network のページ に記載しています。