添加到主屏幕
我们已经编写了一个非常简单的示例网站(观看我们的在线演示,并查看源代码),该网站虽然功能不多,但是实现 A2HS 所必须的代码都有包含,Service Worker 也使其可以脱机使用。这个示例展示了一系列的狐狸图片。
如果您有适用于 Android 的 Firefox,使用它打开我们的示例:https://mdn.github.io/pwa-examples/a2hs/。你将会看到狐狸图片,但更重要的是,你将会看到一个带有加号(+)的“主页”图标——这是为具有必要功能的任何站点显示的“添加到主屏幕”图标。
点击此按钮将显示一个确认横幅,按下大大的“添加到主屏幕”按钮即可将应用添加到主屏幕。(注意:在 Android 8 及更高版本中,将首先显示系统级的“添加到主屏幕”权限对话框。)
使用 Mobile Chrome 的体验则略有不同;加载我们的网站后,您会看到一个弹出安装横幅,询问您是否要将此应用添加到主屏幕。
备注: 您可以在“Web App 安装横幅”一文中找到有关 Chrome 安装横幅的