ローカルにテスト用サーバーを用意するには?

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

前提条件: インターネットの仕組みおよびウェブサーバーとは何かを知っておく必要があります。
目標: ローカルのテストサーバーを設定する方法を学習します。

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

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

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

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

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

  • 非同期リクエストを特徴としている。 一部のブラウザー (Chrome を含む) は、ローカルファイルからサンプルを実行するだけでは非同期リクエストは実行しません (サーバーからのデータの取得を参照)。これはセキュリティ上の制限があるためです (ウェブセキュリティの詳細については、ウェブサイトのセキュリティを参照してください)
  • サーバー側の言語を使用している。 サーバー側の言語 (PHP や Python など) では、コードを解釈して結果を提供する特別なサーバーが必要です。
  • 他のファイルをインクルードしている。 ブラウザーは通常、file:// スキーマを使用してリソースを読み込むリクエストをオリジン間リクエストとして扱います。 そのため、他のローカルファイルを入れることができるローカルファイルを読み込むと、 CORS エラーが発生することがあります。

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

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

メモ: 古いバージョンの Python (バージョン 2.7 まで) では、SimpleHTTPServer という名前の似たようなモジュールが提供されていました。Python 2.x を使用している場合、http.server の使用をすべて SimpleHTTPServer に置き換えることで、このガイドを実行することができます。しかし、最新バージョンの Python を使用することをお勧めします。

このためには次のようにします。

  1. Python をインストールします。 Linux または Mac OS X を使用している場合は、既にシステム上で使用可能になっているはずです。 Windows ユーザーの方は、 Python ホームページからインストーラーを入手し、インストーラーの指示に従ってインストールすることができます。
    • python.org に進みます
    • ダウンロードセクションの下で、 Python "3.xxx" のリンクをクリックします
    • ページ下部の Windows Installer を選択してダウンロードします
    • ダウンロードしたら、実行します
    • インストーラーの最初のページで、 "Add Python 3.xxx to PATH" チェックボックスをオンにします
    • [インストール]をクリックし、インストールが完了したら[閉じる]をクリックします
  2. コマンドプロンプト (Windows)/ターミナル (OS X/Linux) を開きます。 Python がインストールされていることを確認するには、次のコマンドを入力してください。

    bash

    python -V
    # If the above fails, try:
    python3 -V
    # Or, if the "py" command is available, try:
    py -V
    
  3. これによりバージョン番号が返されます。 OK の場合は、cd コマンドを使用してサンプルが入っているディレクトリーに移動します

    bash

    # 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. そのディレクトリーにあるサーバーを起動するコマンドを入力します。

    bash

    # If Python version returned above is 3.X
    # On Windows, try "python -m http.server" or "py -3 -m http.server"
    python3 -m http.server
    # If Python version returned above is 2.X
    python -m SimpleHTTPServer
    
  5. 既定では、これはローカルウェブサーバー上のディレクトリーの内容を 8000 番ポート上で実行します。このサーバーにアクセスするには、ウェブブラウザーで localhost:8000 の URL に移動します。ここにディレクトリーの内容が表示されるので、実行する HTML ファイルをクリックしてください。

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

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

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

  • Python のサーバー側コードを実行するには、Python ウェブフレームワークを使用する必要があります。 Python のウェブフレームワークには、 Django(ガイドが利用できます)、FlaskPyramid など人気のものが多く存在します。
  • Node.js (JavaScript) サーバー側コードを実行するには、生のノードまたはその上に構築されたフレームワークを使用する必要があります。 Express は良い選択です - Express Web Framework (Node.js/JavaScript) を参照してください
  • PHP サーバー側コードを実行するには、PHP の組み込み開発サーバーを起動してください。

    bash

    cd path/to/your/php/code
    php -S localhost:8000