PWA 可以使用“display_override”属性来处理特殊的显示模式。
Thomas Steiner
Web 应用清单是一个 JSON 文件，用于告知浏览器您的渐进式
Web 应用，以及在用户桌面设备或移动设备上安装该应用时应如何运行。
通过 display 属性，您可以自定义在启动应用时显示的浏览器界面。例如，您可以隐藏地址栏和浏览器界面。游戏甚至可以设置为全屏启动。
简而言之，以下是撰写本文时指定的显示模式。
| 属性 | 用途 |
|---|---|
fullscreen |
打开 Web 应用时不会显示任何浏览器界面，并且会占用整个可用显示区域。 |
standalone |
打开 Web 应用时，其外观和体验与独立 应用类似。该应用会在自己的窗口中运行，与浏览器分开，并 隐藏标准浏览器界面元素（例如网址栏）。 |
minimal-ui |
此模式与 standalone 类似，但会为用户提供一组最少的界面元素，用于控制导航（例如返回和重新加载）。 |
browser |
标准浏览器体验。 |
这些显示模式遵循明确定义的回退链
("fullscreen" → "standalone" → "minimal-ui" → "browser")。如果浏览器不支持给定的
模式，则会回退到链中的下一个显示模式。
display 属性的缺点
这种硬编码后备广告链方法的问题有三个方面：
- 如果给定浏览器不支持
"minimal-ui"，开发者无法请求"minimal-ui"，否则会被强制回退到"browser"显示模式。 - 开发者无法处理跨浏览器差异，例如浏览器是否在
"standalone"模式的窗口中包含 返回按钮。 - 当前行为使得无法以向后兼容的方式引入新的显示模式，因为标签页式应用模式等探索在后备广告链中没有自然的位置。
display_override 属性
这些问题由 display_override 属性解决，浏览器会在考虑 display 属性之前
考虑该属性。其值是按顺序考虑的字符串序列，并应用第一个受支持的显示模式。如果都不受支持，浏览器会回退到评估 display 字段。
在下面的示例中，显示模式回退链如下所示。
（本文不讨论 "window-controls-overlay" 的详细信息。）
"window-controls-overlay"（首先，查看display_override。）"minimal-ui""standalone"（当display_override用完后，评估display。）"minimal-ui"（最后，使用display后备广告链。）"browser"
{
"display_override": ["window-controls-overlay", "minimal-ui"],
"display": "standalone",
}
为了保持向后兼容性，任何未来的显示模式都只能作为
display_override的值，而不能作为display的值。
不支持 display_override 的浏览器会回退到 display 属性，并将
display_override 视为未知的 Web 应用清单属性而忽略。
实用链接
致谢
display_override 属性由
Daniel Murphy 正式确定。