localhost、ポート、そして「私の環境では動くのに」

自分のパソコンでサーバーを動かし、なぜ他の人にはそれが見えないのかを理解しましょう。

7 分 · 3 問

サイトを作っている最中に、修正のたびにインターネットへ公開するわけにはいきません。自分のパソコンの中でサーバーを動かし、それを自分のブラウザで見に行きます。この機械、つまりあなたのパソコンには、localhostという予約された名前が付いています。文字どおり「ローカルのホスト」という意味です。予約されたIPアドレス 127.0.0.1 も持っていて、これは世界中のどのマシンでも必ず「自分自身」を意味します。

ところで、1台のパソコンは同時にいくつものサーバーを動かせます。では、どれに話しかけているのかをどうやって区別するのでしょうか。ポートです。IPアドレスが建物の住所だとすれば、ポートは部屋番号にあたります。応答すべきプログラムを指す、1から65535までの数字です。慣習で決まっているものもあります。http はポート80、https は443です。開発中は3000、5173、8000あたりをよく使います。ポートは名前の後ろに、コロンで区切って書きます。http://localhost:8000 のように。

cd my-site
python3 -m http.server 8000

Serving HTTP on 0.0.0.0 port 8000 (http://0.0.0.0:8000/) ...

そのターミナルのウィンドウは開いたままにしておきましょう。コマンドが動いているあいだ、サーバーは応答し続けます。では、ブラウザで http://localhost:8000 を開いてみてください。my-site フォルダーの中のファイルが見えるはずです。サーバーを止めるには、ターミナルに戻ってCtrl + Cを押します。

index.html をダブルクリックしてもページは開くのに、なぜわざわざこんな手間をかけるのでしょうか。ダブルクリックで開いた場合、アドレスは http:// ではなく file:///C:/Users/... になるからです。そして、Webのいくつかの機能は http プロトコルの外ではきっぱり動作を拒否します。サーバーへのリクエスト、JavaScriptのモジュール、一部のフォントなどです。わけのわからないエラーに悩まされることになりますが、localhost 経由にしたとたん、魔法のように消えてなくなります。

lsof -i :8000

COMMAND   PID   USER   FD   TYPE  NODE NAME
python3  4821  sarah    3u  IPv4   TCP *:8000 (LISTEN)

理解度チェック

このレッスンの要点をしっかり覚えているか確認しましょう。

1. localhostという名前は何を指しますか？
   • 契約しているホスティング会社のサーバー
   • あなた自身のパソコン
   • 接続しているWi-Fiネットワーク
2. 同僚が http://localhost:3000 を開いても、あなたのサイトが見えないのはなぜですか？
   • 相手のマシンではポート番号が間違っているから
   • localhostは相手自身のマシンを指すのであって、あなたのマシンではないから
   • httpsを使うべきだから
3. http://localhost:8000 のポート番号は何のためのものですか？
   • マシンのどのプログラムが応答すべきかを示すため
   • 通信を暗号化するため
   • サイトのページに番号を振るため