フルスタックエンジニアのノウハウ
2020.02.07    2020.04.29

URLの基礎(初心者向けにわかりやすく解説)

URLの基礎(初心者向けにわかりやすく解説)

こんにちは、徳田 啓です。
Webプログラマー歴20年、【フルスタックエンジニア マスター講座】を運営しています。(生徒数1,800名突破)

今回は「URL」についてご説明します。

Webプログラマーは、「サービスをどのようなURLで公開するか」ということを設計するために、URLの仕組みを理解しておく必要があります。

ここでしっかりURLの仕組みを理解しておきましょう。


この記事の動画版はこちら

チャンネル登録お願いします!



URLとは何か?


URLとは、Webページの場所を示す「アドレス(住所)」のことです。

すべてのページに固有のURLが付けられています。

URLをブラウザのアドレス欄に入力すると、そのページが表示されます。


もし、URLが間違っていたり、Webページ自体が削除されていて見つからない場合は、以下のようなエラーが表示されます。(404 Not Foundエラー)


URLの形式


URLの正しい形式は以下のようになっています。



普段よく見るURLよりもなんだかごちゃごちゃしていますね。
これは、色々と省略出来る部分があるからなんです。

  • 例)GoogleのトップページはこのようなURLになっています。
    https://www.google.co.jp/

URLは、文字や数字の羅列のように見えますが、上記のようにそれぞれの区分に意味があります。

区分ごとに詳しく見てみましょう。


【情報①】どのサーバーにあるのか?



まずこの部分は、Webページが「どのサーバーの中にあるのか」を示しています。

ドメインの配下には、以下のように複数のサーバーが属していますので、ドメイン名だけでは「どのサーバーにあるのか」が特定出来ません。

  • サーバーのことを「ホスト」といいます。

そこで「ホスト名(サーバー名)」+「ドメイン名」で、Webページが置かれているサーバーコンピューターを特定しています。

ちなみに、サーバー1台1台にはそれぞれ「IPアドレス」という番号が割り当てられています。これはサーバーの住所のようなもので、同じ番号が割り当てられることはありません。

例えば、GoogleのサーバーのIPアドレスは、記事執筆現時点では「172.217.175.35」となっており、これをそのままブラウザに打ち込んでも同じようにGoogleのページが表示されます。

でも、URLを入力する際、このような数字形式だととても覚えづらいですよね?

  • そこで、上記のように「ホスト名+ドメイン名」を割り当てて、覚えやすい名前でアクセス出来る仕組みになっているという訳です。


なお、自分でWebサービスを作る際にも、ドメイン名は好きな名前を付けることが出来ますが、同じドメイン名は世界に1つしか存在出来ないため、すでに取られているドメイン名を付けることは出来ません(ドメイン名は早い者勝ちです)

これを管理しているのが「レジストラ」という会社で、「お名前.com」などが有名ですね。自分のドメインを取りたい場合はこういったレジストラから購入します。


【情報②】サーバーとの通信手段


先頭の部分は、サーバーとの通信手段を指定します。


通信手段には、通信が暗号化されない「http」と、暗号化通信の「https」というものがあります。(実際は他にもありますが、とりあえずこれを覚えておけばOK)

  • httpsを使うには「SSL証明書」というものをサーバーに設置する必要があります。

以前は、通常のWebページは「http」、注文ページやクレジット決済ページなどを「https」とすることが一般的でしたが、最近では通信が暗号化されないhttpは推奨されないようになっており、ブラウザで表示エラーとなる場合もあります。

  • 自分のWebサービスを作る際は、基本的にhttpsに対応させることを考えておきましょう。



末尾の数字は、サーバーと通信を行う際の「ポート番号」の指定です。

通常は「80番ポート(http通信の場合)」「443番ポート(https通信の場合)」を使う決まりになっており、それを使う場合はポート番号の指定を省略出来ます。

  • GoogleのURLにポート番号の指定が無いのは、443番ポート(https通信)を使っているということですね。例)https://www.google.co.jp/

ポート番号は、開発用サーバーなどで特別なポート番号を使う場合のみ指定します。
例えば、ローカルの開発環境では「8080番」という特別なポート番号を使う場合があります。


【情報③】サーバーの中のどのフォルダにあるのか?


以降の部分は「サーバーの中のどのフォルダにあるのか」を示しています。


サーバーには「ドキュメントルート」という指定されたフォルダがあり、そのフォルダが「最上位の階層」になります。

例えば、ドキュメントルートフォルダの中に直接「test.html」というファイルを置いた場合、URLは以下のようになります。

  • https://www.example.com/test.html



また、ドキュメントルートの下にさらにフォルダを作った場合は、URLにも反映されます。

例えば、ドキュメントルートフォルダの中に、さらに「project1」という名前のフォルダを作り、その中にtest.htmlというファイルを置いた場合、URLは以下のようになります。

  • https://www.example.com/project1/test.html




ちなみに、ファイル名が「index.html」または「index.php」の場合は、ファイル名の指定を省略出来ます。

例えば、ドキュメントルートに「index.html」というファイルを置いた場合は、
  • https://www.example.com/index.html
または
  • https://www.example.com/

のどちらでもアクセス出来ます。


アップロード先とURLの関係性を理解しておこう!


以上が、URLの基本的な構造になります。

実際のHTMLファイルが置かれている場所と、URLの関係性が分かりましたでしょうか?

  • 作ったプログラムを、どのフォルダにアップロードすると、どういったURLでアクセス出来るのか?ということをしっかりイメージ出来るようにしておきましょう!



なお、ドメインの取得方法については、以下の記事で詳しく説明しています。

関連記事

自分のWebサイト/サービスを作るなら、独自ドメインを取ろう!



おすすめ記事
無料メルマガ配信中