この記事を書く目的
この記事の目的は３つあります。
- URLとは何か知る
- URLの構成を学ぶ
- この記事をきっかけに、URLに含まれる各要素に対する自身の学習のとっかかりを作る
URLって何だろう？
URLとはコンピュータネットワーク上にある資源のありかを示す文字列です。それと同時に、リソースに対してどの方法でアクセスするか も定義しています。
具体的には、https://www.example.com のような文字列のことを指します。
Uniform Resource Locatorsの略で、単語の頭文字をとってURLです。単語を１つずつ見ていきます
Uniform
「一貫した」「一律の」という意味があります。
リソースの位置を表現する方法が統一されていることを意味します。
RFCで、そのルールが統一されています。
Resource
「資源」の意です。
過去の私の記事 で、広義のネットワークについて考えました。コンピューターに限らず、ネットワークとは何らかの資産や資源をやり取りできる状態を指すと学びました。
Resourceは、まさにその資源を指していることに気づきました。
Locators
辞書で調べると「位置探査装置」や「探知機」という単語が出てきました。
探知機を調べるとこんな画像が出てきました。
引用 : Amazon.co.jp
ブラウザの検索フォームにある🔍マークをずっと虫眼鏡だと思ってきたのですが、もしかしたらこれは虫眼鏡ではなく探知機なのかもしれません。
URLがあると何が嬉しいのだろう？
クライアントはURLを指定することで、インターネット上にある膨大な資源の中から欲しい情報にアクセスすることができます。後述しますが、URLを構成するパスやクエリパラメーターは、Web上のリソースの検索条件を絞り込むフィルターとして機能し、フラグメントは本の栞や付箋のように目印になります。欲しい情報を詳細に指定できるのはとても便利です。
しかし上記の用法は、URLの使い方のうちの
「氷山の一角にすぎない」
「HTML言語ではURLを幅広く使用する」とmdn web docsに記載があります。
HTMLでハイパーリンクを生成する際にURLを使いますが、
<a href="https://google.com">これはgoogleへのハイパーリンクです！</a>
このハイパーリンクこそがWebをWebたらしめる要素であることを考えると、URLの価値が感じられます。
URLは、世界中の人と情報を繋げるために欠かせない技術のうちの１つです。
だからこそセキュリティの面でURLに載せる情報には配慮する必要があることがわかります。URLの扱いについては、HTTPプロトコルのリクエストメソッドと関連があることを知りました。言語化する機会を別で作りたいと思っています。
URLを現実世界に置き換える
後ほどURLの構成要素をみていきますが、URLはスキームから始まり、ドメイン・ポート番号・パス・パラメーター・フラグメントによって成り立っています。
そんなURLが表現するものを現実世界に置き換えて考えてみました。
URLは、
- リソースが保管されている建物の住所(世界中)
- どの建物の何階のどの部屋にあるのか
- どの棚のどのファイルボックスの中に保管されているか
- ファイルに貼られた付箋の位置まで
表現する。
現実世界に置き換えると親しみを感じます。
画像:ChatGPT
URLの利便性について、この例に沿ってもう一度考えてみます。
URLの良さを感じるには、整理整頓された部屋を思い浮かべると良いと思いました。
１つ１つの物の収納場所が決まっている部屋で過ごすなら、探し物に使う時間はグッと減ります。その部屋を共同で使う場合、ルールを共有できていれば、円滑にコミュニケーションが取れそうです。
「あの書類、どこにあるっけ？」
「あの棚の中にあるファイルボックスのラベルを見ればわかるよ！」
ではURLの構成についてみていきます。
URLの構成
スキーム
リソースに対して、どの方法でアクセスしているかを表しています。
一番よく目にするのは、ブラウザの上に表示されているhttp(あるいはhttps)ですが、
その他
- ftp
- mailto
- telnet
- file
等があるそうです。
ドメイン
ドメインとは、IPアドレスに紐付けられた文字列のことです。
ドメインはさらに、ホストやTLDなどに分割できます。
詳しくは別記事を書きたいと思います。
ポート番号
ポート番号はURL上では省略されていますが、http通信の場合:80、httpsの場合:443をドメインの後ろに付与しても、全く同じサイトにアクセスすることが確認できます。
例
http://www.example.com:80
https://www.example.co.jp:443
詳しくは別記事を書きたいと思います。
パス
パスは、サーバー内のファイルのありかを示します。
私のQiitaを例に見てみると、iamgamiフォルダの中にitemsフォルダがあり、その中に過去に書いた記事のhtmlファイルが保管されていることがわかります。URL末尾に拡張子.htmlを付与してもアクセスできます。(記事には知らず知らずのうちに数字と文字のIDが付与されていました。)
itemsと同じ階層にはlike(いいねした記事)や、questions(投稿した質問)などがあるようです。
階層構造は以下のようになっています。
パラメーター
パラメーターは、リソースに追加情報を付与するための文字列です。
?で開始し、キーと値のペアで表現されます。
複数のパラメーターを指定する場合は&で繋げて、以下のように表現されます
?key1=value&key2=value&key3=value
パラメーターの役割
- 検索の絞り込みフィルターとして使う
- サーバーに対して追加の情報を与える
サーバーは、与えられたパラメーターの情報をもとにして処理を行う場合があります。
なぜ「クエスチョンマーク」が使われるのだろう?
パラメーターは別名クエリ文字列と表現されます。
データーベースを操作するための言語としてのSQL(Structured Query Language)のQもクエリです。
クエリは辞書で引くと「質問、疑問、問い」といった意味があります。
広辞苑では、IT分野に絞った狭義のクエリが掲載されていました。
(「問合せ」の意)データベース用のプログラム言語で表現された、データベースに対する検索の要求。
クエリとクエスチョン「クエ」の部分が共通していますが、クエスチョンマーク「？」を使う意味がなんとなくわかってきました。
「この情報の処理をお願いできますか？」と追加情報を与えたり、検索結果を問い合わせるイメージを持ちました。
パラメーターの具体例
googleで適当に検索キーワードをかけると、
https://www.google.com/search?q=
の後ろにたくさんのパラメーターを見ることができます。
Youtubeを例にすると、「動画の途中を知人にシェアしたい！」と思った時に使う「共有」ボタンからパラメーター付きのURLを生成することができます。
例えば動画開始から120秒たったところでシェアボタンを押した場合、
t=120
というパラメーターが生成されます。
tというキーに対して時間の値を秒数で与えることでリンクを実現していることがわかります。
フラグメント
フラグメントは、URLの最後に#から始まる文字列の箇所です。リソースの特定の部分を識別するために使用されます。
現実世界で例えるなら本の栞や付箋です。フラグメントのことをアンカー⚓️と紹介している資料や本もありました。
フラグメントの具体例
フラグメントの具体例はRFC文書がわかりやすいです。
上記のリンクでは、Webページの頭ではなくsection-1に飛びます。記事内の青字の見出しリンクをクリックするたび、異なるフラグメントが付与されるのがわかります。
Qiitaの記事の見出し部分をコピーした際にも、フラグメント付きのURLを生成することができます。
今後
ここまで読んでくださりありがとうございました。
URLに含まれる各要素は、ネットワークを理解する重要な概念が含まれていることがわかりました。
今後、この記事が１つの目次として機能するように、理解が追いつくたびに記事URL(!)のリンクを付与していきたいと思っています。
参考資料