Microsoft Edge 的側邊欄是一個位於瀏覽器側邊的持久窗格,與瀏覽器的主要內容共存。 側邊欄讓使用者能輕鬆存取熱門網站和工具,並搭配瀏覽器分頁。 側邊欄的內容透過並排瀏覽並減少在瀏覽器分頁間切換情境的需求,來輔助使用者的主要任務。 透過使用 Microsoft Edge 的側邊欄,使用者可以在保持工作流程的同時存取所需的生產力工具。
作為開發者,你可以用側邊欄來展示自己的體驗,有兩種方式:
- 透過將現有的漸進式網頁應用 (PWA) 調整到側邊欄執行。
- 利用你 Microsoft Edge 擴充中的側邊欄 API。
選擇正確的方法
側邊欄的兩種不同利用方式,是為了滿足不同開發者的需求而設計。 以下是側邊欄應用程式與側邊欄擴充功能的主要差異:
| 方面 | 側邊欄應用程式 | 側欄延伸 |
|---|---|---|
| 術語定義 | 一個 (PWA) 的漸進式網頁應用程式,運行在側邊欄。 | 一個 Microsoft Edge 擴充功能,會在側邊欄顯示內容。 |
| 分布 | 就像網站一樣,應用程式託管在應用程式的網頁伺服器上。 | 該擴充套件可於 Microsoft Edge Add-ons 發行。 |
| 功能 | 該應用程式能利用所有網頁 API 與功能,以及 PWA 功能,如離線支援、推送或檔案系統存取。 | 擴充功能可利用強大的擴充 API,例如讀取或修改目前頁面。 |
| 上下文 | 應用程式在獨立的網頁環境中運行,與主分頁分開。 | 擴充功能可透過擴充功能的內容腳本存取當前網頁並修改網頁。 |
| 安裝 | 使用者在造訪應用程式網站時,透過側邊欄互動來安裝應用程式。 | 該擴充功能由 Microsoft Edge 附加元件的使用者安裝。 |
| 使用者體驗 | 這個應用程式在側邊欄有自己的圖示。 點擊圖示會開啟側邊欄(如果是關閉的),並顯示應用程式內容。 | 使用者體驗取決於擴充功能。 擴充功能會根據使用者在瀏覽器中造訪的網站開啟側邊欄。 |
| 運用的技術 | 網頁開發與 PWA。 請參閱進步Web Apps (PWA概述) 。 | 延伸開發。 請參閱 Microsoft Edge 擴充功能的概述。 |
側邊欄應用程式
側邊欄應用程式讓你能將現有的 Progressive Web App (PWA) 調整,安全地與其他瀏覽器分頁並行運行,實現並排共瀏覽的體驗。 這種方式非常適合想要提供伴隨體驗的網頁開發者,包括社交、訊息或媒體應用程式,且不需要進階擴充功能。
側邊欄應用程式的基礎架構幫助使用者在瀏覽網頁時發現並安裝側邊欄應用程式,只需簡單更改網頁應用程式清單檔案,即可大幅提升應用程式的可搜尋性。 如果你想在 Microsoft Edge 的側邊欄重用現有網頁應用程式,並充分利用 PWA 可用的網頁功能,側邊欄應用程式是個很好的選擇。
欲了解更多關於 PWA 及其建立方式,請參閱 Progressive Web Apps (PWA 概述) 。 想了解如何將現有 PWA 調整到 Microsoft Edge 的側邊欄,請參考 Microsoft Edge 側邊欄的「建置 PWA」。
側欄延伸
Microsoft Edge 擴充功能可選擇性地使用側邊欄 API,在 Microsoft Edge 側邊欄中顯示自訂使用者介面。 這是擴充功能在其他出現的地方之外的補充,例如在 Microsoft Edge 工具列或彈出視窗中。
如果你的應用程式體驗依賴強大的擴充 API,例如閱讀或修改當前頁面,那麼側邊欄擴充功能就能提供這些功能。 使用者可以在 Microsoft Edge 附加元件中找到並安裝這些擴充功能。
Microsoft Edge 團隊持續演進這些側欄擴充模型,並歡迎您的回饋。 若要留下回饋,可以在倉庫 中建立新議題 ,或 搜尋現有議題 並加入現有的討論。
想了解更多關於 Microsoft Edge 擴充功能及其建立方法,請參閱 Microsoft Edge 擴充功能概覽。
想了解更多關於在擴充功能中使用側邊欄 API 的資訊,請參考 Microsoft Edge 側邊欄的「開發擴充功能」。