NodeJS を使用した Web サーバー側プログラミング

クライアント/サーバーアーキテクチャ

HTTP について説明する前に、HTTP が動作する環境の特性を簡単に紹介します。これは、クライアント/サーバー環境と呼ばれることがよくあります。

次の図に示すように、単純なクライアント/サーバーシステムには 1 つ以上のクライアントプロセスと 1 つのサーバープロセスがあります。

これは単純そうに見えますが、いくつかのプロパティによって予想よりも複雑になります。クライアントは、多くの異なるコンピュータシステム上で実行される独立したエンティティです。これ

これは、次のことを考慮する必要があることを意味します。

1. クライアントプロセスは、クライアントオペレーティングシステムと互換性がある必要があります。言語やデータ通信プロトコルのサポートなどが利用可能であり、互換性がある必要があります。

2. リモートクライアントはサーバー情報へのアクセスを許可される前に認証される必要があるため、セキュリティが問題になります。

3. さまざまなクライアントコンピュータが多数あるということは、最終的にはクライアント/サーバー通信中に 1 つ以上のコンピュータが壊れることを意味します。これには、施設が状況から回復する必要があります。

4. サーバーに多くのクライアントがアクセスできる場合、特にクライアント/サーバーの関係が商業顧客/ベンダーの関係である場合、サーバーの可用性とエラー回復をサポートする必要があります。

5. クライアント/サーバー対話の応答時間は許容範囲内であり、管理可能でなければなりません。

6. インターネット規模のネットワークでは、クライアントがアクセスできる数百万台のサーバーの中からサーバーをどのように見つけるかについても考慮する必要があります。

また、上に示した単純なクライアント/サーバーアーキテクチャは、すべてのクライアントが異なるマシン上にあることを意味するわけではないことも認識する必要があります。クライアント/サーバーアーキテクチャでは、1 つ以上のクライアントプロセスとサーバープロセスが同じコンピュータシステム上に存在することが完全に許可されます。

最新のクライアント/サーバーシステムはさらに複雑です。以下の図は、コンピュータシステム内のクライアントとサーバーの任意の組み合わせとどのように対話するかを示しています。複数のクライアントが 1 つのコンピュータシステム上で複数のサーバーと共存します。さらに、クライアントプロセスは目的を達成するために複数のサーバーにアクセスでき、サーバーはクライアントとして機能して独自のクライアントニーズを満たすことができます。

上の両方の図で、矢印の下にあるミドルウェアという用語がクライアント/サーバーの対話を表していることがわかります。ミドルウェアは、上記の目的を達成するためにクライアント/サーバーシステムに必要なソフトウェアコンポーネントです。クライアントプログラムとオペレーティングシステム、およびサーバープログラムとオペレーティングシステムの間のソフトウェアです。標準化されたインターフェイスを提供することで、クライアントとサーバーのプログラマを互換性、セキュリティ、相互配置などに関連する複雑な作業から切り離します。

ここで取り上げるミドルウェアは、ハイパーテキスト転送プロトコル (HTTP) と、それをサポートするために使用されるインフラストラクチャです。このユニット (モバイルシステム) の性質上、主にインフラストラクチャのクライアント側に注目します。ただし、このテクノロジーの制限と利点をより深く理解するには、サーバー側で何が起こっているかを理解することが重要です。

ネットワークサーバー

Web サーバーは、HTTP ベースのクライアント/サーバーシステムのサーバー側です。これらは、主に Web の普及とネットワークソフトウェア設計の発展により、現在インターネット上で支配的なサーバーテクノロジとなっています。HTTP の「ハイパーテキスト」はもともと HTML ドキュメントでしたが、現在 HTTP ではさらに多くのデータ形式が使用されており、そのいくつかをこの単元で検討します。このセクションでは、Web サーバーの基本的な操作について説明します。次のセクションでは、HTML をドキュメントマークアップ言語に変更し、HTML リンクが Web サーバーとの基本的な対話をどのように形成するかについて説明します。次に、<form> タグを見ていきます。これは、クライアントが Web サーバーにデータを送信する方法を提供し、Web サーバーがクライアントに送り返す固有のページを構築できるようにするためです。次に、Web サーバーがクライアント用のページを構築するプログラムを実行できるようにする単純な CGI システムを見ていきます。大容量 Web サーバー、PHP、および ASP の CGI に代わるその他の最新テクノロジーについても検討します。

Web サーバーは、HTML ページと対話するクライアント/サーバーのサーバー部分です。最も単純な形式では、HTML ページのリクエストを受け入れ、保存されているページのコピーをリクエスト元のクライアントに送信します。ただし、最新の Web サーバーは、この単純な対話が示すよりもはるかに複雑です。

一般的な Web サーバーの対話に含まれる手順は次のとおりです。

1. Web クライアント (通常は Web ブラウザ) がインターネット経由で Web ページ要求を送信します。

2. サーバーはリクエストを検証して、ページが存在すること、必要なソフトウェアがインストールされていること、およびセキュリティ制約が満たされていることを確認します。

3. クライアント要求を実行するためにサーバーが必要とするソフトウェア。

4. サーバーは、サーバーファイルシステムから、またはプログラムからの出力として HTML ページを収集します。

5. サーバーは、インターネット経由で HTML ドキュメントをクライアントに送り返します。

ステップ 1 と 2 では、HTTP プロトコルを使用してリクエストをサーバーに送信し、HTML ページをクライアントに送信します。HTTP は、REQUEST メッセージと RESPONSE メッセージを使用してクライアントとサーバー間の対話を行う非常に単純なプロトコルです。HTTP の詳細を知る必要はありませんが、これらのメッセージの一般的な形式を確認すると役に立ちます。次の表に、HTTP リクエストメッセージの一般的な形式とサンプルメッセージを示します。

HTTP リクエストの一般的な形式

サンプルリクエスト

メソッド resource_id HTTP_version

ヘッダー:値

…

ヘッダー:値

空白行

メッセージ本文y

GET /jdk1.3/docs/index.html HTTP/1.0

受け入れる: テキスト/html

ユーザーエージェント: MacWeb

この例では、メソッド「GET」は、使用可能な HTTP メソッドの 1 つです。HTTP バージョンは 1.0 です。この場合、メッセージ本文はありません。リソース識別子は単にサーバー上のリソースのファイル名であることに注意してください。メッセージを送信するには、クライアントがメッセージの送信先を知るためにサーバー名をすでに見つけている必要があるため、サーバーのコンピューター名は必要ありません。

次の表は、HTTP 応答の一般的な形式と、HTML ページを含む実際の応答の例を示しています。

HTTP 応答の一般的な形式

応答例

HTTP_バージョン結果コード結果コメント

ヘッダー:値

…

ヘッダー:値

空白行

メッセージ本文

HTTP/1.0 200 OK

サーバー: Apache/1.3

Mime_version: 1.0

コンテンツタイプ: テキスト/html

この HTTP 応答はプロトコルバージョン 1.0 を使用し、結果コード 200 を返します。そのヘッダーと値のペアは、サーバーが Apache バージョン 1.3 サーバーであることを示し、HTML ページがメッセージ本文で送り返されます。

これで、ユニバーサルリソースロケーター (URL) が登場しました。たとえば、次の URL は、Web サーバー /jdk1.3/docs/index.html にある、spike.scu.edu.au という名前の Web ページを識別します。このページには、HTTP プロトコル経由でアクセスできます。

http://spike.scu.edu.au/jdk1.3/docs/index.html

プロトコル (HTTP) は URL の最初の部分で選択されており、サーバーは URL 内のコンピューター名 (この場合はspike.scu.edu) を使用して検出されているため、HTTP 要求メッセージでは Web サーバー上のファイルの場所のみが必要です。 .au。URL で HTTPS や FTP (https: および ftp:) などの他のプロトコルが使用されているのを見たことがあるかもしれません。

サーバーサイドプログラミング

サーバーサイドプログラミングとは、サーバー内で直接開発またはプログラミングするプロセスを指します。

サーバー側プログラミングを使用する利点は、基礎となるデータにローカルでアクセスできることです。データにアクセスするためにネットワーク接続や外部リソースは必要ありません。さらに、サーバー上で実行される埋め込みコードは、データにアクセスするためにユーザーがデータベースにアクセスする必要があるクライアント側のコードよりも高速であることがよくあります。第 4 週モジュールでは、NodeJS を使用したデータベースアクセスについて学習します。

さらに、サーバー側プログラミングにより、コードをデータベースに直接組み込むことができます。コードは、他のデータベースオブジェクトと同様に、標準のデータベースバックアップツールを使用して管理および復元できます。

このセクションでは、サーバー側プログラミング言語のコンテキストで NodeJS について説明し、NodeJS を使用して最初のサーバーアプリケーションを構築するために必要な概念を探ります。その前に、最初のサーバーアプリケーションを構築するために必要な API である HTTP などの重要なトピックを再確認します。

ハイパーテキスト転送プロトコル (HTTP)

このモジュールの一環として、コンピューターネットワークで使用されるプロトコルであるハイパーテキスト転送プロトコル (HTTP) を理解する必要があります。SMTP (Simple Mail Transfer Protocol)、FTP (File Transfer Protocol)、POP3 (Post Office Protocol 3) などの他のプロトコルもあります。

プロトコルは、明確に定義されたメッセージ形式、ルール、構文、セマンティクスなどを提供し、異なるハードウェアとソフトウェアを備えたデバイスが相互に対話できるようにします。特定のプロトコルと互換性のあるデバイスは、ネットワーク上の他のデバイスと通信できます。

ハイパーテキスト転送プロトコル (HTTP) は、おそらく歴史上最も広く採用されているインターネットアプリケーションプロトコルの 1 つです。これは、クライアントとサーバーがインターネット上で通信する方法です。ブラウザを除けば、HTTP はインターネットに接続するほぼすべてのアプリケーションで選択されるプロトコルです。

ほとんどのオペレーティングシステムにはデフォルトで HTTP などのネットワークプロトコルが含まれているということは、インターネットにアクセスするために追加のソフトウェアをインストールする必要がないことを意味します。

Web を駆動する HTTP プロトコルは、コネクションレスプロトコルと呼ばれます。これは、Web ブラウザが Web サーバーと通信するために使用するプロトコルです。リンクがクリックされる、フォームが送信される、または検索が実行されるたびに、ブラウザからターゲットサーバーにリクエストが送信されます。サーバーに画像、ビデオ、テキストをリクエストした後、ブラウザとサーバーは接続されなくなります。これは、リクエスト/レスポンスモデルで動作するためです。

リクエストを送信するときは、リソースを識別する URL と適用されるメソッド (取得、削除、公開など) を含める必要があります。追加情報は、URL パラメーター (フィールドと値のペア)、POST データ、または Cookie の形式で含めることができます。

HTTP プロトコルは、クライアントとサーバー間の通信に関する明確なガイドラインを設定します。

通常、HTTP リクエストはクライアントによってのみサーバーに送信されます。サーバーはクライアントからの HTTP リクエストに応答します。サーバープッシュと呼ばれるテクノロジーを使用することにより、サーバーは、要求する前にクライアントのキャッシュに情報を入力することもできます。
HTTP 経由でファイルをリクエストする場合、クライアントはファイルの URL を提供する必要があります。
Web サーバーは、少なくともエラーメッセージを含めて、すべての HTTP リクエストに応答する必要があります。

HTML およびフォームの <form> タグ

HTML の <form> タグについては、前の単元で説明しました。これまで説明していないのは、データをリモートサーバーに送信する方法と、データ転送で発生する遅延やエラーを管理する方法についてです。そこで、改訂として、ここでは通常の HTML の <form> タグを再検討します。

Java Web サイト (java.sun.com) から取得した HTML <form> タグの例は次のとおりです。

  <form action="/cgi-bin/coffee" method="post">
    Would you care for a cup of coffee?<BR>
    <INPUT type="radio" name="coffee" value="Y" CHECKED="checked"/>Yes
    <INPUT type="radio" name="coffee" value="N"/>No<P>
    If yes:<BR/>
    What flavor?
    <SELECT name="flavor" size="1">
      <OPTION value="French Roast"/>French Roast
      <OPTION value="Vienna Roast"/>Vienna Roast
      <OPTION value="Almond Mocha"/>Almond Mocha
    </SELECT><BR/>
    <INPUT type="checkbox" name="cream" value="Y"/>Include Cream
    <INPUT type="checkbox" name="sugar" value="Y"/>Include Sugar<br/>
    <INPUT type="submit" value="Brew It"/>
  </form>

この <form> タグの action 属性は、サーバー (この場合は /cgi-bin/coffee) に送信されるデータを処理するプログラムを指定します。Web サーバーはこの情報を使用してプログラムを起動し、データを処理します。Method 属性は、その post 値を使用して、サーバーにデータを送信するために HTTP リクエストで HTTP POST メソッドを使用する必要があることを指定します。

このタグは、クライアントユーザーが <form> と </form> で区切られたタグを解釈して Web サーバーに送信する値を選択できるようにする一連の視覚的なコントロールも構築します。ブラウザには以下の画像のようなものが表示されます。

この例では、 <input> タグを使用して、ラジオボタン、チェックボックス、およびフォームの下部にある [作成] ボタンを作成します。<select> タグは、ユーザーがコーヒーの種類を選択できるドロップダウンメニューを構築するために使用されます。

共通ゲートウェイインターフェイス (CGI)

前のセクションでは、<form> タグを使用してユーザーからデータを収集し、処理のためにサーバーに送信する方法について説明しました。このデータを使用した最初のサーバー側システムは、常に単に CGI と呼ばれる Common Gateway Interface でした。

CGI は、Web サーバーが CGI プログラムと呼ばれるプログラムを起動してフォームデータを処理する単純なシステムです。次に CGI プログラムは HTML Web ページを生成し、サーバーはそれをクライアントに送り返します。次の図は、クライアントとサーバー間の完全な対話を示しています。

この図は、おそらく以前の CGI リクエストを通じてフォームが Web サーバーからどのように最初にロードされるかを示しています。次に、クライアントユーザーはフォームを操作し、処理のためにフォームデータをサーバーに送信します。次に、サーバーは、<form> タグの action 属性で指定された CGI プログラムの処理を開始します。この CGI プログラムは、クライアントからデータを読み取り、サーバーがクライアントに送り返す HTML ページを生成します。最後に、クライアントは生成された Web ページを表示します。

データは、ユーザーが送信ボタンをクリックするか、適切な JavaScript 関数の実行などの送信インタラクションをオーバーライドするときに、Web ブラウザーによって組み立てられます。データは、サーバーに送信される前にラベルと値のペアに組み立てられます。ペアはタグ=値の形式で配置され、個々のペアは「&」文字で区切られます。また、ブラウザは特殊文字を HTTP 経由で送信できる文字に置き換えます。たとえば、スペースは「+」に置き換えられます。

CGI プログラムは、同じタグと値のペアのクライアントデータを Web サーバーからフェッチします。たとえば、以下に示すように、前のセクションでコーヒーの例のコントロールを選択したとします。

ブラウザは次の文字列を作成して CGI プログラムに送り返し、HTTP POST メソッドを使用してデータを CGI プログラムに送り返します。

  flavor=Vienna+Roast&cream=Y&coffee=Y

ここで、上記の HTML コードと注意深く比較する必要があります。タグの順序は、HTML の <form> タグで宣言された順序とは異なることに注意してください。一般に、CGI プログラムはタグの順序に依存できません。また、この文字列では、sugar というラベルの付いたチェックボックスがどのように表現されていないかにも注目してください。通常、これはチェックボックスがオフの場合にも当てはまります。つまり、チェックされたチェックボックスのみがラベルと値のペアを返します。

クライアント/サーバー対話の次のステップは、Web サーバーが HTTP POST リクエストを受信し、環境変数を使用して HTTP メッセージの詳細を指定された CGI プログラムに渡すことです。次に、CGI プログラムは環境変数を取得して、HTTP リクエストのパターンを特定します。PATH や CLASSPATH などの環境変数を以前に見たことがあるかもしれません。CGI システムは、CGI プログラムで取得できるさまざまな変数を使用します。

この例では、CGI プログラムは、CGI リクエストが POST モードを使用していることを検出し、プログラムの標準入力からラベルと値のペアを読み取ることができます。プログラムは、渡された文字列を解釈して、挿入されたさまざまな文字 (「=」、「?」、「+」など) を削除する必要があります。プログラムは、タグとそれに関連付けられた値を含む内部データ構造を構築します。

CGI プログラムは、データベース、ファイル、その他のプログラムにアクセスしてデータを処理できます。最後に、CGI プログラムは HTML ページをプログラムの標準出力ストリームに直接書き込みます。これは、Java CGI プログラムで、たとえば System.out.println() 関数を使用して実行できます。

CGI プログラムが標準出力を閉じるか終了すると、Web サーバーは HTML ページをクライアントに送り返します。クライアントが Web ブラウザの場合、Web ページが表示されます。

CGI には、大容量 Web サーバーには適さないいくつかの問題があります。

1. CGI システムが遅い。これは、Web サーバーが CGI リクエストごとに新しいプログラムを開始する必要があるためです。CGI プログラムを開始するには、多くのシステムリソースをまとめてファイルシステムからプログラムをロードする必要があります。より優れたシステムでは、コンピュータのメモリ内で実行し続けるプログラムを使用することで、これらの問題を回避します。

2. CGI はステートレスです。ステートレスとは、CGI プログラムがどのクライアントが最後の CGI リクエストを送信したかを覚えていないため、クライアントが最後のリクエストで何をしたかを覚えていないことを意味します。これは、CGI インタラクションが通常 1 画面 1 応答のアプリケーションであることを意味し、この問題を解決するために Cookie やその他の状態保存デバイスが導入されました。

3.CGIプログラミングは難しい。問題 2 を解決すると、CGI プログラミングが非常に複雑になります。プログラミングを容易にするために、より優れたシステムが開発されています。

表現型状態転送 (REST)

Representational State Transfer (REST) は、HTTP プロトコルに基づいてアプリケーションを編成するための一般的な方法になりました。HHTP メッセージヘッダーとプロトコル属性を自然かつ関連性の高い方法で使用します。このセクションでは、RESTful (一般的に知られている) Web サービスによって実装される主な機能の概要を説明します。

REST Web サービスには主に 4 つの側面があります。

1. HTTP では、メッセージタイプ (GET、POST、PUT など) に明確な意味があります。

2. 通信はステートレスです。

3. データのディレクトリ構造はクライアントとサーバーに公開されます。

4. データは、XML または HTTP ヘッダーで指定されたその他の MIME タイプで転送されます。

NodeJS を使用して Web サーバーを作成し、HTML ファイルをロードする

前提条件:

Node.js がコンピューターにインストールされていることを確認してください
Web サーバーの作成に必要な基本を学習しました。

Web サーバーを作成します。

「My Server」という名前の新しいフォルダーを作成します。
新しく作成したフォルダー my-server に「web-server.js」という名前の新しいファイルを作成します。
次のコードをファイル「web-server.js」に追加します。

最初に行うことは、Node.js インストールにある標準の http モジュールをロードすることです。http モジュールには、サーバーを作成するための関数が含まれています。

const http = require("http");

次に、サーバーに割り当てられるホストとポートという 2 つの定数を定義します。

const host = 'localhost';
const port = 8080

前のセクションで説明したように、Web サーバーはブラウザーや他のクライアントからのリクエストを処理します。ドメイン名を使用すると、Web サーバーと対話でき、Web サーバーは DNS サーバーによって IP アドレスに変換されます。localhost は、コンピュータがネットワークに接続するときに指定されるアドレスの名前であり、ループバックアドレスとも呼ばれます。「内部 IP アドレス 127.0.0.1」とも呼ばれるこのアドレスは、ローカルコンピュータ上でのみ利用可能であり、当社が属するネットワークやインターネット上では利用できません。

すべてのネットワーク接続デバイスには標準化されたポートがあり、それぞれに固有の番号が付いています。特定のプロトコル用に予約されているポートが多数あります。たとえば、ポート 80 は、ハイパーテキスト転送プロトコル (HTTP) メッセージに割り当てられるデフォルトのポートです。

IP アドレスを使用すると、特定のデバイスとの間でメッセージを送信できます。一方、ポート番号を使用すると、特定のサービスまたはアプリケーションが特定のデバイスをターゲットにし、ゲートウェイとして機能できるようになります。ここではポート番号として 8080 を使用します。サーバーが正常にセットアップされている場合は、 http://localhost:8080で http 経由でサーバーにアクセスできるはずです。

サーバーにアクセスしたら、次のステップはメッセージを表示することです。これを行うには、関数を作成する必要があります。

const requestLis = function (req, res) {
    res.end("Hello world, this is my first web server using NodeJS");
};

Node.js では、すべてのリクエストリスナー関数は 2 つのパラメーター、req と res を受け入れます。ユーザーの HTTP リクエストは、最初のパラメータ req に対応するリクエストオブジェクトにキャプチャされます。2 番目のパラメーター res (res) の応答オブジェクトは、ユーザーに返される HTTP 応答を生成するために使用されます。res.end() 関数は、HTTP 応答をクライアントに返します。

最後のステップでは、サーバーを作成し、リクエストリスナーを使用してクライアントと通信するようにサーバーを構成します。

const server = http.createServer(requestLis);
server.listen(port, host, () => {
    console.log(`Server is up and running on http://${host}:${port}`);
});

次に、ファイルを保存し、Powershell またはターミナルに移動して、次のコマンドを実行します。

node web-server.js

これで、PowerShell/ターミナルで次の情報を表示できるようになります。

Server is up and running on http://localhost:8080

NodeJS を使用して HTML ファイルを読み込みます。

前のセクションで説明した fs モジュールを使用すると、HTML ファイルをロードし、HTTP 応答を記述するときにそのデータを使用できます。

Web サーバーから返される HTML ドキュメントを作成します。

index.html

HTML ファイルにコードを追加して、Web ページを魅力的にします。

HTML ファイルのロードに必要な readFile() 関数を使用する次のコードを Web サーバーに記述して、fs-module.js をインポートします。

const fs = require('fs').promises;

最新の Javascript のベストプラクティスに準拠するために、Promise のバリアント、つまり .promises を使用します。

最後に、次のコードを webserver.js に追加します。

Express (Node.js フレームワーク) を使用して HTTP サーバーを作成する

Node.jsにはExpress.jsやKoa.jsなどのさまざまなフレームワークが利用可能です。これらのフレームワークは、さまざまな便利なミドルウェア機能に加え、開発者が自分で開発する代わりに活用できる他の多くの便利な機能を提供します。このコースでは、Express.js フレームワークを学習し、HTTP サーバーを作成します。

Express フレームワークを使用するには、まず Express をインストールする必要があります。これを行うには、Powershell/ターミナルに移動し、次のコマンドを入力する必要があります。

npm install express

次に、require() 関数を使用して、express という名前のスキーマをインポートします。Express フレームワークを使用するには、まず require() 関数を使用して Express という名前のスキーマをインポートする必要があります。Express フレームワークを使用してモジュールをインポートする方法の例を次に示します。

const express = require('express');
const app = express();

require() 関数は、最初にモジュールの名前を文字列 (「express」) として指定して呼び出され、次に返されたオブジェクトが呼び出されて Express アプリケーションが作成されます。これで、アプリケーションオブジェクトのプロパティと関数にアクセスできるようになります。

app.js という名前の新しいファイルを作成し、次のコードを使用します。

const express = require('express');
const app = express();
const port = 8000;

app.get('/', function(req, res) {
  res.send('Hello World!')
});

app.listen(port, function() {
  console.log(`Example app listening on port ${port}!`)
});

Powershell またはターミナルに移動してコードを実行します

node ./app.js