iOS:添加到主屏幕的 Web 应用在离线模式下无法运行

iOS: Web app added to home screen not working in offline mode

This question 类似,但答案没有帮助。

目标是将单个网页缓存到主屏幕,即使在离线模式下也能成功启动该网页。

有网络时从主屏幕启动网页成功,但在离线模式下失败,因为 Safari 抱怨没有连接到服务器。

该网页包含此 meta 标记:

  <meta name="apple-mobile-web-app-capable" content="yes"  />

iOS 上的 Web 应用程序可以做到这一点吗?

apple-mobile-web-app-capable 意味着,

If content is set to yes, the web application runs in full-screen mode; otherwise, it does not. The default behavior is to use Safari to display web content. You can determine whether a webpage is displayed in full-screen mode using the window.navigator.standalone read-only Boolean JavaScript property.

Doc

如果你想要缓存,你可以试试渐进式网络应用程序,我认为 iOS 不支持它。

下面是在iOS上使用离线缓存的说明:

https://developer.apple.com/library/content/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/OfflineApplicationCache/OfflineApplicationCache.html

我们通过支持具有 manifest 属性的应用缓存版本来修复此问题,如下所示:

<!DOCTYPE HTML>
<html manifest="/cache.manifest">
....
</html>

cache.manifest 文件:

CACHE MANIFEST

# Version 0.0.2

NETWORK: *

CACHE:
ShareIconTutorial.png
HomeScreenIcon.png

FALLBACK:

由于 PWA,有关此主题的文档已过时,希望这对以后的人有所帮助!