什麼是 URL?
本文將討論統一資源定位符 (URL),解釋它們是什麼以及它們的結構。
| 預備知識 | 您需要先了解 網際網路是如何工作的,Web 伺服器是什麼 以及 Web 上鍊接背後的概念。 |
|---|---|
| 目標 | 您將瞭解 URL 是什麼以及它在 Web 上是如何工作的。 |
總結
URL (Uniform Resource Locator,統一資源定位符) 是網際網路上唯一資源的地址。它是 瀏覽器 用於檢索已釋出資源(如 HTML 頁面、CSS 文件、影像等)的關鍵機制之一。
理論上,每個有效的 URL 都指向一個唯一的資源。實際上,有一些例外,最常見的是 URL 指向一個已不存在或已移動的資源。由於 URL 所代表的資源和 URL 本身由 Web 伺服器處理,因此由 Web 伺服器所有者負責仔細管理該資源及其關聯的 URL。
基礎:URL 的組成部分
以下是一些 URL 示例
https://mdn.club.tw https://mdn.club.tw/en-US/docs/Learn_web_development/ https://mdn.club.tw/en-US/search?q=URL
您可以在瀏覽器的位址列中輸入以上任意一個 URL,以告訴瀏覽器載入相應的資源,這三個示例都是 Web 頁面。
URL 由不同的部分組成,有些是必需的,有些是可選的。最重要的部分已在下面的 URL 中高亮顯示(詳細資訊將在後續章節中提供)

注意:您可以將 URL 想象成一個普通的郵政地址:協議 代表您要使用的郵政服務,域名 是城市或鄉鎮,埠 類似於郵政編碼;路徑 代表您的郵件應送達的建築物;引數 代表額外資訊,例如建築物內的公寓號;最後,錨點 代表您要郵寄的實際收件人。
注意:URL 有一些額外的部分和一些額外的規則,但它們對於普通使用者或 Web 開發者來說並不重要。不用擔心,您無需瞭解它們即可構建和使用功能完整的 URL。
協議

URL 的第一部分是協議,它指示瀏覽器必須使用哪個協議來請求資源(協議是圍繞計算機網路交換或傳輸資料的規定方法)。通常對於網站,協議是 HTTPS 或 HTTP(其不安全版本)。定址網頁需要這兩個協議之一,但瀏覽器也知道如何處理其他協議,例如 mailto:(用於開啟郵件客戶端),因此如果您看到其他協議也不足為奇。
許可權

接下來是許可權,它由 :// 字元模式與協議分隔。如果存在,許可權將同時包含域(例如,www.example.com)和埠(80),並用冒號分隔
- 域指示正在請求哪個 Web 伺服器。通常這是一個 域名,但也可以使用 IP 地址(但這很少見,因為不方便得多)。
- 埠指示用於訪問 Web 伺服器上資源的“技術門”。如果 Web 伺服器使用 HTTP 協議的標準埠(HTTP 為 80,HTTPS 為 443)來授予對其資源的訪問許可權,則通常會省略它。否則,它是強制性的。
注意:協議和許可權之間的分隔符是 ://。冒號將協議與 URL 的下一部分分隔開,而 // 表示 URL 的下一部分是許可權。
一個不使用許可權的 URL 示例是郵件客戶端(mailto:foobar)。它包含協議但未使用許可權元件。因此,冒號後面沒有兩個斜槓,僅作為協議和郵件地址之間的分隔符。
資源路徑

/path/to/myfile.html 是 Web 伺服器上資源的路徑。在 Web 的早期,這樣的路徑表示 Web 伺服器上的物理檔案位置。如今,它主要是 Web 伺服器處理的一種抽象,沒有實際的物理實體。
引數

?key1=value1&key2=value2 是提供給 Web 伺服器的額外引數。這些引數是由 & 符號分隔的鍵/值對列表。Web 伺服器可以使用這些引數在返回資源之前執行額外的操作。每個 Web 伺服器對引數都有自己的規則,要了解特定 Web 伺服器是否處理引數的唯一可靠方法是詢問 Web 伺服器所有者。
錨點

#SomewhereInTheDocument 是指向資源本身另一部分的錨點。錨點代表資源內的某種“書籤”,為瀏覽器提供了顯示位於該“書籤”位置的內容的指示。例如,在 HTML 文件中,瀏覽器將滾動到定義錨點的位置;在影片或音訊文件中,瀏覽器將嘗試轉到錨點表示的時間。值得注意的是,# 之後的這部分,也稱為片段識別符號,在請求中永遠不會發送到伺服器。
如何使用 URL
任何 URL 都可以直接在瀏覽器的位址列中鍵入以訪問其背後的資源。但這只是冰山一角!
HTML 語言(請參閱 HTML 結構化內容)廣泛使用 URL
- 透過
<a>元素建立到其他文件的連結; - 透過
<link>或<script>等各種元素將文件與其相關資源連結起來; - 顯示媒體,例如影像(使用
<img>元素)、影片(使用<video>元素)、聲音和音樂(使用<audio>元素)等; - 透過
<iframe>元素顯示其他 HTML 文件。
注意:在指定 URL 以載入頁面的一部分資源時(例如使用 <script>、<audio>、<img>、<video> 等),您通常應只使用 HTTP 和 HTTPS URL,有極少數例外(一個值得注意的例外是 data:;請參閱 Data URLs)。例如,使用 FTP 不安全,並且不再受現代瀏覽器支援。
其他技術,例如 CSS 或 JavaScript,也廣泛使用 URL,而這些確實是 Web 的核心。
絕對 URL 與相對 URL
我們上面看到的稱為絕對 URL,但還有一個稱為相對 URL 的概念。 URL 標準定義了兩者 — 儘管它使用術語 絕對 URL 字串 和 相對 URL 字串,以區別於 URL 物件(它們是 URL 的記憶體表示)。
讓我們在 URL 的上下文中檢查一下絕對和相對之間的區別意味著什麼。
URL 的必需部分在很大程度上取決於 URL 使用的上下文。在瀏覽器的位址列中,URL 沒有上下文,因此您必須提供一個完整(或絕對)的 URL,就像我們上面看到的那些。您不需要包含協議(瀏覽器預設使用 HTTP)或埠(只有在目標 Web 伺服器使用非標準埠時才需要),但 URL 的所有其他部分都是必需的。
當 URL 在文件中使用時(例如在 HTML 頁面中),情況略有不同。由於瀏覽器已經擁有文件本身的 URL,它可以利用此資訊來填充該文件中任何 URL 的缺失部分。我們可以透過只檢視 URL 的路徑部分來區分絕對 URL 和相對 URL。如果 URL 的路徑部分以 / 字元開頭,瀏覽器將從伺服器的頂層根目錄獲取該資源,而無需參考當前文件提供的上下文。
讓我們看一些例子來進一步說明。假設 URL 是從以下 URL 定位的文件中定義的:https://mdn.club.tw/en-US/docs/Learn_web_development。
https://mdn.club.tw/en-US/docs/Learn_web_development 本身是一個絕對 URL。它具有定位其指向資源所需的所有必要部分。
以下所有 URL 都是相對 URL
- 協議相對 URL:
//mdn.club.tw/en-US/docs/Learn_web_development— 只缺少協議。瀏覽器將使用與載入託管該 URL 的文件相同的協議。 - 域名相對 URL:
/en-US/docs/Learn_web_development— 協議和域名都已丟失。瀏覽器將使用與載入託管該 URL 的文件相同的協議和相同的域名。 - 子資源:
Howto/Web_mechanics/What_is_a_URL— 協議和域名丟失,路徑不以/開頭。瀏覽器將嘗試在當前資源所在的子目錄中查詢文件。在這種情況下,我們真正想訪問的 URL 是:https://mdn.club.tw/en-US/docs/Learn_web_development/Howto/Web_mechanics/What_is_a_URL。 - 返回目錄樹:
../CSS/display— 協議和域名丟失,路徑以..開頭。這繼承自 UNIX 檔案系統 — 告訴瀏覽器我們想向上移動一級。在這裡,我們想訪問的 URL 是:https://mdn.club.tw/en-US/docs/Learn_web_development/../Web/CSS/display,可以簡化為:https://mdn.club.tw/en-US/docs/Web/CSS/display。 - 僅錨點:
#semantic_urls- 除錨點外,所有部分都已丟失。瀏覽器將使用當前文件的 URL 並替換或新增錨點部分。當您想連結到當前文件的特定部分時,這很有用。
URL 使用者名稱和密碼
上面討論的 URL 部分不如下面描述的常見,您可能會在 URL 中看到包含使用者名稱和密碼。
例如
https://username:password@www.example.com:80/
如果包含,使用者名稱和密碼會放在 :// 字元和許可權之間,兩個之間用冒號分隔,末尾用 at 符號 (@)。
當訪問使用 HTTP 身份驗證安全機制的網站時,可以在 URL 中包含使用者名稱和密碼,以立即登入網站並繞過否則會出現的使用者名稱/密碼對話方塊以輸入您的憑據。
儘管您可能仍會看到此機制在實際中使用,但由於安全問題,它已被棄用,並且現代網站傾向於使用其他身份驗證機制。有關更多詳細資訊,請參閱 透過 URL 中的憑據訪問。
語義化 URL
儘管 URL 具有非常技術性的味道,但它們代表了網站的可讀入口點。它們可以被記住,任何人都可以將它們輸入到瀏覽器的位址列中。人是 Web 的核心,因此構建所謂的 語義化 URL 被認為是最佳實踐。語義化 URL 使用具有固有含義的單詞,這些單詞可以被任何人理解,無論其技術知識如何。
語言語義對計算機來說當然是無關緊要的。您可能經常看到看起來像隨機字元組合的 URL。但是,建立人類可讀的 URL 有許多優點
- 對您來說更容易操作它們。
- 它向用戶清楚地說明了他們在 Web 上的位置、正在做什麼、正在閱讀或與之互動的內容。
- 一些搜尋引擎可以利用這些語義來改進相關頁面的分類。
另見
Data URLs:以 data: 協議為字首的 URL,允許內容建立者將小檔案嵌入到文件中。