创建可在每个客户端上安装和运行的渐进式 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
  • 第一版