什麼是宣告式連結擷取?
點按網路上的連結有時會帶來驚喜。舉例來說,在行動裝置上點選 YouTube 網頁連結,就會開啟 YouTube iOS 或 Android 應用程式 (如果已安裝的話)。不過,在電腦上安裝 YouTube PWA 後,點選連結後,就會在瀏覽器分頁中開啟。
但變得更加複雜如果這個連結不在任何網站上,而是透過 Google 任一即時通訊應用程式收到的即時通訊訊息,該怎麼辦?在電腦作業系統上,哪些應用程式視窗沒有個別的應用程式視窗,如果應用程式已開啟,應該為每個連結點擊建立新視窗或分頁?仔細思考後,您可以透過多種方式擷取連結和導覽,包括但不限於:
- 從其他網頁點選的連結。
- 網址從作業系統中的平台專屬應用程式啟動。
- 源自 App Shortcuts API 的導覽。
- 透過網址通訊協定處理常式連結的連結。
- 由檔案處理常式造成的瀏覽。
- Share Target API 造成的導覽。
- ...等等。
「宣告式連結擷取」是名為 "capture_links"
的網頁應用程式資訊清單屬性提案,可讓開發人員透過宣告方式,判斷瀏覽器應從導覽範圍外的情境前往瀏覽器前往網址時,應採取什麼動作。如果使用者位於導覽範圍內 (例如使用者在範圍中開啟瀏覽器分頁,然後點按內部連結),則不適用此提案。
有些特殊條件 (例如點按連結 (或按一下滑鼠右鍵,然後「在新分頁中開啟」)) 通常不會觸發連結擷取行為。無論連結是 target=_self
還是 target=_blank
,在瀏覽器視窗中點選的連結 (或不同 PWA 視窗) 是否會造成在相同分頁中開啟,仍會在 PWA 中開啟。
建議用途
可能使用此 API 的網站範例包括:
- 這類 PWA 會在使用者點選連結時開啟視窗,而非瀏覽器分頁。在電腦環境中,通常會一次開啟多個應用程式視窗。
- 單視窗 PWA,其開發人員希望隨時只開啟一個應用程式執行個體,並以新的導覽功能聚焦在現有執行個體上。子用途包括:
- 適合僅執行一個執行個體 (例如音樂播放器、遊戲) 的應用程式。
- 在單一執行個體中使用多文件管理功能的應用程式 (例如 HTML 實作的分頁列)。
透過 about://flags 啟用
如要在沒有來源試用權杖的情況下,在本機測試宣告式連結擷取功能,請在 about://flags
中啟用 #enable-desktop-pwas-link-capturing
標記。
如何使用宣告式連結擷取功能?
開發人員可以利用額外的網頁應用程式資訊清單欄位 "capture_links"
,以宣告的方式決定擷取連結的方式。這會接受字串或字串陣列做為其值。如果指定了字串陣列,使用者代理程式便會選擇清單中第一個支援的項目,並預設為 "none"
。支援下列值:
"none"
(預設):未擷取連結;點選連結後會導向這個 PWA 範圍,無須開啟 PWA 視窗,即可照常瀏覽。"new-client"
:每次點擊連結都會在該網址開啟新的 PWA 視窗。"existing-client-navigate"
:點選的連結會在現有的 PWA 視窗中開啟 (如有),或者會在新視窗中開啟。如果有多個 PWA 視窗,瀏覽器可能會任意選擇一個視窗。如果目前沒有開啟任何視窗,這個做法與"new-client"
類似。🚨? 注意!這個選項可能會導致資料遺失,因為系統可以任意離開頁面,網站應先選擇此選項,以告知他們自己選擇採用這類行為。這個選項最適合未在記憶體中保留使用者資料的「唯讀」網站 (例如音樂播放器)。如果使用者離開的網頁有beforeunload
事件,系統會在導覽完成前顯示提示。
操作示範
「宣告連結擷取」示範實際上包含兩個互相互動的示範:
下方的螢幕側錄會顯示這兩項功能的互動方式。表示 "new-client"
和 "existing-client-navigate"
這兩種不同的行為。請務必以不同的狀態測試應用程式、在分頁中執行,或以已安裝的 PWA 的形式執行,以便瞭解行為的差異。
安全性和權限
Chromium 團隊根據「控管強大的網路平台功能存取權」中所述的核心原則 (包括使用者控制項、資訊公開和人體工學) 設計及執行宣告式連結擷取作業,這個 API 允許網站新增額外的控制項選項。首先,能夠自動在視窗中開啟安裝的應用程式。這會使用現有的 UI,但可讓網站自動觸發 UI。其次,能夠聚焦於自身網域的現有視窗,並觸發包含點擊網址的事件。這麼做可讓網站將現有視窗導覽至新的網頁,覆寫預設的 HTML 導覽流程。
遷移至啟動處理常式 API
Chromium 97 以下版本的宣告式連結擷取 API 來源試用 已於 2022 年 3 月 30 日到期。並且將由 Chromium 98 以上版本中的一組新功能和 API 取代,其中包含已啟用使用者啟用的連結擷取功能,以及 Launch Handler API。
連結擷取
在 Chromium 98 中,自動連結擷取功能現在是使用者選擇加入的行為,而非在安裝時授予網頁應用程式。如要啟用連結擷取功能,使用者必須在瀏覽器中透過「選擇開啟工具」並選擇「記住我的選擇」,然後在瀏覽器中啟動已安裝的應用程式。
或者,使用者可以在應用程式管理設定頁面中,開啟或關閉特定網頁應用程式的連結擷取功能。
連結擷取功能目前僅適用於 ChromeOS,我們正在開發對 Windows、macOS 和 Linux 的支援。
啟動處理常式 API
傳入導覽的控制項已遷移至 Launch Handler API,可讓網頁應用程式決定網頁應用程式在不同情況下 (例如擷取連結、分享目標或檔案處理等) 的啟動方式。如要從宣告式連結擷取 API 遷移至 Launch Handler API:
- 註冊您的網站以啟動處理常式來源試用,並將來源試用金鑰放入您的網頁應用程式中。
在網站的資訊清單中新增
"launch_handler"
項目。- 如要使用
"capture_links": "new-client"
,請新增"launch_handler": { "route_to": "new-client" }
。 - 如要使用
"capture_links": "existing-client-navigate"
,請新增"launch_handler": { "route_to": "existing-client-navigate" }
。 - 如要使用
"capture_links": "existing-client-event"
(在宣告式連結擷取來源試用中從未實作),請新增"launch_handler": { "route_to": "existing-client-retain" }
。採用這個選項後,系統擷取連結導覽功能時,應用程式範圍內的頁面不會再自動瀏覽。您必須呼叫window.launchQueue.setConsumer()
來啟用導覽功能,以處理 JavaScript 中的LaunchParams
。
- 如要使用
capture_links
欄位和宣告連結 - 擷取來源試用註冊作業的有效期限為 2022 年 3 月 30 日。這可確保 Chromium 97 以下版本的使用者仍可在擷取的連結上啟動網頁應用程式。
詳情請參閱「控管應用程式的啟動方式」。
意見回饋:
Chromium 團隊想瞭解你透過「宣告連結擷取」功能的使用體驗。
告訴我們 API 設計
有什麼 API 功能不如您預期嗎?或者您需要實作提案的方法或屬性嗎?對於安全性模型有任何疑問或意見嗎?在對應的 GitHub 存放區上提交規格問題,或是將您的想法新增至現有問題中。
回報導入問題
你在 Chromium 的實作方式中發現錯誤嗎?或者,實作項目是否與規格不同?
請前往 new.crbug.com 回報錯誤。請務必盡可能提供詳細的細節、重現簡易操作說明,並在「元件」方塊中輸入 UI>Browser>WebAppInstalls
。Glitch 適合用來快速分享簡單快速的提案,
展現對 API 的支援
您打算使用宣告式連結擷取功能嗎?您的公開支援可協助 Chromium 團隊決定功能的優先順序,以及向其他瀏覽器廠商說明這項功能有多重要。
請使用主題標記 #DeclarativeLinkCapturing
將 Tweet 訊息傳送至 @ChromiumDev,告訴我們您的使用地點和方式。
實用連結
特別銘謝
宣告式連結擷取由 Matt Giuca 指定,並由 Alan Cutter 和 Dominick Ng 提供。API 是由 Alan Cutter 實作。本文由 Joe Medley、Matt Giuca、Alan Cutter 和 Shunya Shishido 審核。Zulmaury Saavedra 在 Unsplash 上提供的主頁橫幅。