ローカルのテストサーバーはどのようにセットアップしますか？

この記事では、マシン上に簡単なローカルテストサーバを設定する方法と、その使い方の基本について説明します。

前提条件: 最初にインターネットの仕組みや Web サーバについて知っておく必要があります。
目的: ローカルのテストサーバを設定する方法を学習します。

ローカルファイルとリモートファイル

ほとんどの学習領域では、ブラウザでサンプルを直接開くだけで済みます。HTML ファイルをダブルクリックするか、ブラウザウィンドウにドラッグ ＆ ドロップするか、ファイル > 開く...を選択して HTML ファイルを選択するなどです。これを達成する方法はたくさんあります。

Web アドレスのパスが file:// で始まり、その後にローカルハードドライブのファイルへのパスが続く場合、ローカルファイルが使用されています。対照的に、GitHub でホストされている例 (または他のリモートサーバの例) を見ると、Web アドレスは http:// または https:// で始まっており、ファイルが HTTP 経由で受信されたことを示します。

ローカルファイルのテストに関する問題

一部のサンプルはローカルファイルとして開くと実行されません。これにはさまざまな理由があります。最も可能性が高いのは、

  • それらは非同期リクエストを特徴とします。一部のブラウザ (Chrome を含む) は、ローカルファイルからサンプルを実行するだけで非同期リクエストは実行しません (サーバからのデータの取得を参照)。これはセキュリティ上の制限があるためです (Web セキュリティの詳細については、Web サイトのセキュリティを参照してください)
  • それらはサーバサイドの言語を備えています。サーバサイドの言語 (PHP や Python など) では、コードを解釈して結果を提供する特別なサーバが必要です

シンプルなローカル HTTP サーバの実行

非同期リクエストの問題を回避するには、ローカル Web サーバを介して実行することによって、そのようなサンプルをテストする必要があります。私たちの目的のためにこれを行う最も簡単な方法の1つは、Python の SimpleHTTPServer モジュールを使うことです。

これをするためには：

  1. Python をインストールします。Linux または Mac OS X を使用している場合は、既にシステム上で使用可能になっているはずです。Windows ユーザの方は、Python ホームページからインストーラを入手し、インストーラの指示に従ってインストールすることができます：

    • python.org に進みます
    • ダウンロードセクションの下で、Python "3.xxx" のリンクをクリックします
    • ページ下部の Windows x86 実行可能インストーラを選択してダウンロードします
    • ダウンロードしたら、それを実行します
    • インストーラの最初のページで、"Add Python 3.xxx to PATH" チェックボックスをオンにします
    • [インストール]をクリックし、インストールが完了したら[閉じる]をクリックします

  2. コマンドプロンプト (Windows)/ターミナル (OS X/Linux) を開きます。Python がインストールされていることを確認するには、次のコマンドを入力します

    python -V

  3. これによりバージョン番号が返されます。OK の場合は、cd コマンドを使用してサンプルが入っているディレクトリに移動します

    # include the directory name to enter it, for example
cd Desktop
# use two dots to jump up one directory level if you need to
cd ..

  4. ディレクトリの中でサーバを起動するコマンドを入力します

    # If Python version returned above is 3.X
python -m http.server
# If Python version returned above is 2.X
python -m SimpleHTTPServer

  5. デフォルトでは、これはローカル Web サーバ上のディレクトリの内容を 8000 番ポート上で実行します。このサーバにアクセスするには、Web ブラウザで localhost:8000 のURL に移動します。ここにディレクトリの内容が表示されるので、実行する HTML ファイルをクリックします

メモ: すでに 8000 番ポートで何かが稼働している場合は、server コマンドを実行して別のポート番号を選択することができます。例えば python3 -m http.server 7800 (Python 3.x) または python -m SimpleHTTPServer 7800 (Python 2.x) です。これで localhost:7800 でコンテンツにアクセスできます。

サーバサイドの言語をローカルで実行する

Python の SimpleHTTPServer (python 2.0) http.server (python 3.0) モジュールは便利ですが、Python、PHP、JavaScript などの言語で書かれたコードの実行方法はわかりません。これを処理するには、必要なことがあります。必要なのは、実行しようとしているサーバサイドの言語に依存します。いくつかの例があります：

  • Python のサーバサイドコードを実行するには、Python Web フレームワークを使用する必要があります。Django フレームワークの使い方については、Django Web Framework (Python) を参照してください。Flask はまた、Django の代わりとしても良い (わずかに重量の少ない) 代替品です。これを実行するには Python/PIP をインストールし、 pip3 install flask を使用して Flask をインストールする必要があります。この段階で、python3 python-example.py を使ってPython Flaskのサンプルを実行し、ブラウザの localhost:5000 に遷移することができます
  • Node.js (JavaScript) サーバサイドコードを実行するには、生のノードまたはその上に構築されたフレームワークを使用する必要があります。Express は良い選択です - Express Web Framework (Node.js/JavaScript) を参照してください
  • PHP サーバサイドコードを実行するには、PHP の組み込み開発サーバを起動します
$ cd path/to/your/php/code
$ php -S localhost:8000