URL を構成する要素

Sam Dutton

「ドメインを購入した」や「画像は別のサイトでホストされている」といった発言は、厳密には正しくなくても、ほとんどの場合問題ありません。ただし、状況によっては、より正確な情報が必要になることがあります。たとえば、Cookie を扱う場合は、サイトとオリジンの違いを理解する必要があります。

URL 部分の名前は標準で指定され、JavaScript API も定義されています。

  • URL 標準では、エンジニアが相互運用可能なウェブブラウザを構築できるように、URL と関連するコンセプトを定義しています。
  • 標準の URL API コンポーネントは、スキームやオリジンなどの URL 文字列の一部にアクセスするためのメソッドを定義します。

このドキュメントでは、HTTP または HTTPS の URL 文字列で使用されるさまざまな用語について説明します。ファイル URL やデータ URL などの他の種類の URL は対象外です。host や origin などの用語の正確な定義は本質的に複雑であるため、このドキュメントでは完全な説明を試みるのではなく、例と URL 標準へのリンクを提供します。

JavaScript を使用して、URL API で定義された URL コンポーネントの名前を取得できます。次に例を示します。

let url = new URL('https://foo.com.au:1234/bar/foo.html#bar');
console.log(url);

URL アナライザ

以下の URL を編集して、URL 文字列の各部分の名前を確認してください。https://chrome.dev/url-parts/ で別のタブで開くこともできます。

URL 部分の名前を以下にアルファベット順で示します。

国別コード トップレベル ドメイン（ccTLD）

ISO 3166-1 国コードのリストで定義されているトップレベル ドメイン。

  • https://example.org.au の場合、ccTLD は au です。
  • https://example.io の場合、ccTLD は io です。

ドメイン名

HTTP または HTTPS の URL のうち、ドットで区切られた部分。スキームの後、パスまたはポート（指定されている場合）の前までの部分。ドメイン名の各部分はラベルと呼ばれます。

URL ドメイン名
https://example.github.io/path example.github.io
https://support.example.org.au:443 support.example.org.au

有効なトップレベル ドメイン（eTLD）

公開サフィックス リストのエントリ。TLD と（複数の部分を持つ eTLD の場合）その下の追加ドメイン（セカンドレベル、サードレベルなど）が含まれます。

  • 例: com、com.au、github.io、sa.edu.au、schools.nsw.edu.au。

「パブリック サフィックス」とは、ドメインを登録できる名前です。たとえば、Public Suffix List は、既知のすべての公開サフィックスのリストであり、頻繁に更新されます。Chromium や Firefox などのブラウザは、ビルドでこのリストを使用しています。

eTLD+1

登録可能なドメインをご覧ください。

eTLD と、その前のサブドメイン。

  • 例: example.com、example.org.au、example.github.io、example.sa.edu.au、example.schools.nsw.edu.au。

ファイル名

URL 標準で定義されておらず、URL API の一部でもありませんが、URL がディレクトリ構造に直接マッピングされるという（多くの場合、誤った）前提に基づいて、URL のパス以外の最終部分を参照するために一般的に使用されます。

たとえば、https://example.com/dir/file.html では、file.html がファイル名として参照されることがあります。

ファイル名の値は、アセットがダウンロードされた場合にブラウザがアセットに名前を付けるためにも使用されます。たとえば、https://example.com/images/image.jpg は通常、image.jpg にローカル保存されます。

Fragment

URL の末尾にある # 文字の後に続く文字列。フラグメント識別子を提供します。

  • たとえば、URL https://example.com/cats#tabby のフラグメント識別子の値は tabby です。

# を含む部分は、ハッシュまたはアンカーと呼ばれます。テキスト フラグメントにリンクしてハイライト表示することもできます。

ハッシュは、フラグメントではなく URL API によって返されます。

完全修飾ドメイン名（FQDN）

ウェブサイトまたはサーバーの完全なアドレス。IP アドレスにマッピングされます。

URL FQDN
https://example.com:1234/cats example.com
https://api.example.github.io api.example.github.io

デフォルト以外のポートが使用されている場合でも、URL の FQDN にはポートは含まれません。

ハッシュ（またはアンカー）

URL の末尾にある # 文字の後に続く文字列。フラグメント識別子を提供します。（状況によっては、これを「アンカー」と呼ぶこともあります）。

# を除く部分は、フラグメントと呼ばれます。テキスト フラグメントにリンクしてハイライト表示することもできます。

ハッシュは、フラグメントではなく URL API によって返されます。

ホスト

URL 標準で定義されているように、ホストはドメイン名、IP v4 アドレス、IPv6 アドレス、不透明なホスト、または空のホストにできます。

  • URL 標準の host の定義には、ポートは含まれていません。
  • URL.host には、ポートがスキームのデフォルトでない限り、ポートが含まれます。
  • URL.hostname にはポートは含まれません。
URL URL.host
https://www.example.com:443/cat www.example.com
// 443 is the default port for the scheme
https://www.example.com:1234/cat www.example.com:1234
https://cat.example.github.io cat.example.github.io

ホスト名

ホスト名は JavaScript URL API で定義されますが、URL 標準では定義されません。詳しくは、ホストの表現をご覧ください。

URL.hostname は、ポートなしでホストを返します。

URL URL.hostname
https://www.example.com:443/cat www.example.com
https://www.example.com:1234/cat www.example.com
https://cat.example.github.io cat.example.github.io

出発地

URL 標準は origin を定義し、背景については HTML 標準へのリンクを提供します。

HTTP または HTTPS の URL の場合、URL.origin は、スキーム、ホスト、ポート（ポートがスキームのデフォルトでない場合）を返します。

URL URL.origin
https://www.example.com:443/cat https://www.example.com
https://www.example.com:1234/cat https://www.example.com:1234
https://cat.example.github.io https://cat.example.github.io

パラメータ

検索パラメータをご覧ください。

パスワード

ユーザー名をご覧ください。

パス名

HTTP または HTTPS の URL の場合、ドメインとポート（定義されている場合）の後の部分。filename（定義されている場合）は含まれますが、検索文字列やハッシュは含まれません。

URL URL.pathname
https://example.com [empty string]
https://example.com:8000/search?q=tabby /search
https://example.github.io/cat/pattern#tabby /cat/pattern
https://example.github.io/README.md /README.md

「パス」は、ファイル名を含まないパス名を指す場合もあります。たとえば、URL https://example.com/cat/pattern/tabby.html の場合、「パス」は /cat/pattern です。

ポート

ネットワーク ポートを識別する URL の : の後の数値。たとえば、URL https://example.com:1234/tabby のポート番号は 1234 です。

ポート番号は 16 ビットの符号なし整数にする必要があります。つまり、0 ～ 65535 の整数にする必要があります。

HTTP URL のデフォルト ポートは 80、HTTPS のデフォルト ポートは 443 です。デフォルト以外のポートを使用する場合を除き、URL でポート番号を指定する必要はありません。

ポートがスキームのデフォルトの場合、API は空の文字列を返します。

URL URL.port
https://example.com // empty string
https://example.com:443/foo // empty string: port is default for scheme
https://www.example.com:1234/foo 1234

プロトコル

スキームの後に :（http: や https: など）が続きます。

protocol は URL API から取得できますが、scheme は取得できません。

クエリ（または「クエリ文字列」）

URL の search 部分（先頭の ? を除く）。

登録可能なドメイン

  • com や org などの単一の eTLD を含む URL（TLD に対応する eTLD）の場合、ドメインとその前のセカンドレベル ドメイン（example.com や example.org など）。
  • 第 3 レベルの登録のみが許可されている 2 つの部分からなる eTLD を含む URL（Public Suffix List の com.au や github.io などのエントリ）の場合、2 つの部分からなるトップレベル ドメイン（「パブリック サフィックス」）とその直前の第 3 レベルのドメイン名。たとえば、example.org.au や example.github.io です。
  • 3 つ以上の部分からなる eTLD の場合は、eTLD とその前のドメイン。

Scheme

URL にリクエストが行われたときに、ネットワーク プロトコル（またはユーザー エージェントが実行するアクション）を定義する URL の一部（:// の前）。たとえば、https スキームの URL へのリクエストは、HTTPS プロトコルを使用して行う必要があります。file、mailto、git などのネットワーク プロトコルに対応しないスキームを含む URL へのリクエストの場合、動作はユーザー エージェントによって異なります。たとえば、ユーザーが mailto リンクをクリックすると、ほとんどのブラウザはリンクの href URL の値を使用して、デフォルトのメール アプリケーションを開きます。

pathnameの後に指定される、パラメータとその値を表す一連の Key-Value ペアが続く疑問符。

URL URL.search
https://example.com/cats?pattern=tabby&mood=bonkers ?pattern=tabby&mood=bonkers
https://example.com/cats:443?pattern=tabby ?pattern=tabby

query または「クエリ文字列」は、先頭の ? を含まない search を指します。

検索パラメータもご覧ください。

検索パラメータ

検索文字列（または「クエリ文字列」）で渡されるデータ項目を参照します。

  • たとえば、https://example.com/cats?pattern=tabby&mood=bonkers の場合、検索文字列には pattern=tabby と mood=bonkers の 2 つのパラメータがあります。

第 2 レベルのドメイン

トップレベル ドメインの前のドメイン。

  • URL https://www.example.com の場合、セカンドレベル ドメインは example.com で、トップレベル ドメイン com のサブドメインです。

  • https://example.org.au の場合、トップレベル ドメインは au、セカンドレベル ドメインは org、サードレベル ドメインは example です。この例では、org.au は au のサブドメインで、example.org.au は org.au のサブドメインです。

サイト

サイトは、same-site（スキームを含む）と schemeless same-site とともに HTML 標準で定義されています。

サイトは URL 標準または JavaScript URL API で定義されていません。

このコンテキストでは:

  • https://example.com などの単一パーツの eTLD を含む HTTP または HTTPS URL の場合、サイトは scheme、eTLD、その前のラベルで構成されます。たとえば、URL https://www.example.com/cat の場合、サイトは https://example.com です。（この URL の場合、eTLD はトップレベル ドメインと同じです）。
  • co.uk、github.io、sa.edu.au などのマルチパート eTLD の場合、「サイト」は scheme、eTLD、その前のラベルで構成されます。たとえば、URL https://cat.example.co.uk/tabby のサイトは https://example.co.uk で、https://www.education.sa.gov.au のサイトは https://education.sa.gov.au です。
URL サイト（スキームと eTLD+1 を含む）
https://cat.example.com/tabby ("https", "example.com")
https://cat.example.co.uk/tabby ("https", "example.co.uk")

オリジンとは異なり、サイトにはポートは含まれません。

サブドメイン

上位レベルのドメイン内のドメイン。

com や org などの 1 つのパートで構成されるトップレベル ドメインを持つサイトの場合、トップレベル ドメインの前のパート（それぞれがドットで区切られています）。

  • www.example.com は example.com のサブドメインです。
  • support.api.example.org は api.example.org のサブドメインであり、api.example.org は example.org のサブドメインです。

サードレベルの登録のみが許可されている 2 部構成の eTLD（Public Suffix List のエントリ（co.uk や github.io など））の場合、サブドメインはそれより前のドメイン名の部分です。

  • 例: cat.example.co.uk は example.co.uk のサブドメインです。

テキスト フラグメント

ページ内のテキスト範囲にリンクしてハイライト表示できるようにするフラグメントの一種。ユーザーがテキスト フラグメントを含むリンクをたどると、ブラウザはページ内のテキストを検索し、そのテキストまでスクロールしてハイライト表示しようとします。

テキスト フラグメントは :~:text= で始まり、その後に検索語句が続きます。

たとえば、このページの「フラグメント」というテキストの最初の出現箇所にリンクするには、URL https://web.dev/articles/url-parts#:~:text=fragment を使用します。

詳しくは、テキスト フラグメントをご覧ください。

トップレベル ドメイン（TLD）

ルートゾーン データベースに記載されているドメイン名（com や org など）。一部のトップレベル ドメインは、uk や tv などの国別コード トップレベル ドメインです。

HTTP または HTTPS URL の部分を説明する場合、TLD は最後のドットの後に続くドメイン名です。

  • https://example.org の場合、URL のトップレベル ドメインは org です。
  • https://example.org.au の場合、URL のトップレベル ドメインは au で、org はセカンドレベル ドメインです（org もトップレベル ドメインですが）。org.au は 2 つの部分からなる eTLD です。

eTLD のパブリック サフィックス リストには、1 つ、2 つ以上の部分を含むドメインが含まれているため、TLD も eTLD になる可能性があります。次に例を示します。

  • https://example.com の場合、URL の eTLD は com で、これは TLD でもあります。

ユーザー名

URL の先頭にユーザー名とパスワードを指定することもできますが、セキュリティ上の理由から非推奨となっており、多くの場合無視されます。

たとえば、https://user123:password1@example.com の場合、ユーザー名は user123 になります。ユーザー名（とパスワード）は暗号化されず、プレーン テキストで表示されます。ユーザー名に : または @ 記号が含まれている場合は、それぞれ %3A と %40 に URL エンコードする必要があります。

詳細