🔗

URLの構成を理解しよう - Web開発の基礎知識

に公開

普段何気なく使ってるURL、実際どんな構成になってるか知ってますか?
今回は、URLの基本的な構成について、実際の例を使いながらサクッと解説していきます。Web開発初心者の方はもちろん、「あれ、これってどうだっけ?」って思った方にも役立つはず。

URLって何?

※厳密にはURIと記載すべきかもですが、ここではURIをURLに置き換えて記載してます

URLってのは、リソースを統一的に識別するIDのことです。Web上のすべてのリソースを一意に示すことができて、これさえあればどんなリソースにも簡単にアクセスできちゃうんです。

URLの構成を見てみよう

では実際に、URLの構成について見ていきましょう。RFC2396RFC3986などの仕様がありますが、今回は現行のRFC3986を参考に解説します。

シンプルな例から始めよう

まずはシンプルな例から見てみましょう:

http://hoge.example.jp/blog/1

このURLは、以下のパーツで構成されています:

  • URLスキーム: http
  • ホスト名: hoge.example.jp
  • パス: /blog/1

URLはURLスキームから始まります。URLスキームは、そのURLが使用するプロトコルを示すのが一般的です。

次にホスト名が出てきて、ここにはDNSで名前解決できるドメイン名かIPアドレスが入ります。これは、インターネット上で必ず一意になります。

そしてパスは、そのホスト上のリソースを一意に示してくれます。

ちなみに、example.jpってのは日本レジストリサービスが例示用に予約してるドメインです。こういう学習や実装のテストで使う場合は、こうした例示用のものを使うのがマナーですね。適当に打ち込んだURLが誰かに使われてるものだったりしますからね。メールアドレスも同じです。

少し複雑な例

次は、もう少し複雑なURLを見ていきます:

http://taro:pass@hoge.example.jp:8000/search?q=test&debug=true#n10

このURLは、以下のような構成になっています:

  • URLスキーム: http
  • ユーザー情報: taro:pass
  • ホスト名: hoge.example.jp
  • ポート番号: 8000
  • パス: /search
  • クエリパラメータ: q=test&debug=true
  • URLフラグメント: #n10

先ほどの例になかったものを説明しますね。

ユーザー情報は、リソースにアクセスする際に使うユーザー名とパスワードが:区切りで書かれてます。ユーザー情報のあとには@を区切り文字としてホスト名が続きます。

ポート番号は、このホストにアクセスする際のプロトコルで使うTCPのポートを示してます。指定がなかった場合は、使用するプロトコルのデフォルトが使われます(httpの場合は80番)。

クエリパラメータは、パスのあとに?を区切り文字として配置されます。上記の例では、q=testdebug=trueそれぞれがクエリになってて、複数ある場合は&で連結します。これは検索機能でキーワードを渡す際など、クライアントから動的にURLを生成するときによく使われますね。

URLフラグメントは、リソースの内部でさらに細かい箇所を指定する際に使います。例えば、目次から特定の場所にジャンプする際なんかに使われてます。

まとめ

URLの構成を理解しておくと、Web開発の色々な場面で役立ちます。特に、動的なURL生成やルーティングの実装、SEO対策なんかを考える際には、この知識が重要になってきますね。

最初は「うわっ、複雑...」って思うかもしれませんが、一度覚えちゃえば、Webアプリケーションの設計やデバッグがぐっと楽になるはずです。実際に手を動かしながら、色々なURLパターンを試してみるのがおすすめです。

URLの構成について、何か疑問点があれば気軽にコメントで質問してくださいね!

参考文献や関連記事

Uniform Resource Identifier (URI): 一般的構文
Webを支える技術 | 技術評論社
email@example.com はドキュメントに使っていいのか?
wa3.i-3-i.info/word11843.html

Discussion