Safari iOS13 iPad 上的全屏 PWA 具有带阅读器和“完成”按钮的 URL 栏，无法隐藏

Posted 2023-02-23

【中文标题】Safari iOS13 iPad 上的全屏 PWA 具有带阅读器和“完成”按钮的 URL 栏，无法隐藏

【英文标题】：Fullscreen PWA on Safari iOS13 iPad has URL bar with reader and "Done" button, unable to hide

【发布时间】：2020-01-03 21:47:20

【问题描述】：

我有一个网络应用程序，已作为 PWA 添加到 iPad 的主屏幕中。在 ios13 更新之前一切都很好，现在顶部有一个小的 URL 工具栏，左侧有“完成”（刷新/重新加载页面到初始启动 URL）和阅读器/设置“Aa”按钮对。

URL 栏仅在用户登录时出现，其中他们的会话数据被加密并添加到 URL 的末尾，因此它从“https://mysite/Home/”变为“https://mysite/Home/encryptedsessionurl”。据我所知，我的清单（如下）中的范围为“https://mysite/Home/”应该会提醒 Safari 这是同一个站点，但事实并非如此。

我已经阅读了多篇试图弄清楚这一点的帖子——我检查了我的元标记，并创建了一个 manifest.json 文件，如下所示：

  "name": "My App Name",
  "short_name": "My App",
  "lang": "en-US",
  "display": "standalone",
  "orientation": "landscape",
  "start_url": "https://mysite/Home/",
  "scope": "https://mysite/Home/",
  "permissions": [ 
    "unlimitedStorage",
    "fullscreen"
   ]

我的元标记看起来像这样，之前运行良好：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-status-bar-style" content="black" />

正如另一篇文章所建议的那样，我已经尝试删除元标记并仅使用清单，甚至尝试将清单中的 display: "standalone" 更改为 "fullscreen" ，但这也不起作用。

我只是不确定这里出了什么问题，任何其他建议将不胜感激。

【问题讨论】：

您是否注意到"scope": "https://mysite/Home/" 末尾缺少逗号？

@LucaNeri 感谢您的发现——我已修复它，但没有任何变化，并且该栏仍然出现。

【参考方案1】：

也许是一个愚蠢的错误，但希望它也能对其他人有所帮助——我没有意识到每次更新清单时我都必须为网站创建一个新的 PWA。

当我创建一个新的 PWA（通过“添加到主屏幕”快捷方式）时，它开始完美运行。

【讨论】：

@noIdeaAtAll 不幸的是，自从我开始工作以来，我还没有更新到最新版本。