創建可在每個用戶端上安裝和運行的漸進式 Web 應用

更新頁 :
頁面創建日期 :

環境

Visual Studio
  • Visual Studio 2019
.NET
  • .NET 5.0

什麼是漸進式 Web 應用 (PWA) ?

簡而言之,Web 應用程式可以安裝在每個設備上,如 Windows PC、iPhone 和 Android。

由於 Blazor WebAssembly 的實際情況是標準化的 Web 助手本身,因此可以實現上述實現。 它基本上基於 Web 應用程式,但也可以使用本機功能,如推送通知。

使用者只需訪問目標頁面並按下安裝按鈕即可安裝,這非常簡單。

創建布拉澤爾 Web 代理 PWA 專案

這基本上與創建混合 Web 助理專案的方式相同。

只需按照常規步驟創建專案,然後在下面的「附加資訊」螢幕上選中「漸進式 Web 應用程式」 即可。

除了 PWA 特定功能外,Blazor WebAssembly 的開發基本上與沒有 PWA 的模式相同。

與非 PWA 項目的差異

在 PWA 中建立專案時,某些檔正在增長。

此外,在index.html 打開 時添加了一些引用這些文件的代碼。

試用 PWA

調試並運行專案。

運行範例與沒有 PWA 的模式完全相同,但使用 PWA 執行時,您將看到安裝按鈕已添加到 Web 瀏覽器中。

按兩下以確認要安裝,然後嘗試安裝。

這將打開另一個視窗,以便 Blazor 應用可以在其中移動。 由於它充當用戶端應用,而不是 Web 瀏覽器,因此您可以進行與作業系統相關的設置,如圖所示。

因為它已經安裝,它註冊到開始功能表,並可以啟動它像這樣。

但是,由於內容只是 Web 應用,因此如果沒有伺服器可以下載內容,則無法使用它。 例如,如果在調試運行中安裝,則在調試時未啟動 IIS Express 才能使用已安裝的應用。 另請注意,PWA 必須通過 HTTPs 連接才能安裝。

卸載

卸載過程與常規安裝應用相同。 操作方法取決於您安裝的平臺。

更新歷史記錄

2022/7/13
  • 說明安裝 PWA 需要 HTTPs。
2022/3/30
  • 第一版