iPhone上安装的PWA打开进入Safari是否为正常行为？

这不属于正常行为，苹果Safari从iOS 11.3开始就支持PWA的standalone（独立应用）模式，出现这个问题通常是你的PWA配置未满足苹果的要求，需要检查以下几个关键点：

• Web App Manifest配置：

  • 必须包含display: standalone字段，不能设置为browser或minimal-ui
  • 需提供符合尺寸要求的图标：至少要有180x180px的PNG格式图标（苹果推荐的主屏幕图标尺寸），尽量避免使用带透明背景的图标（部分场景下会导致识别异常）
  • 必须设置name或short_name字段，不能为空

• HTTPS环境要求：

  • PWA必须部署在HTTPS环境下（本地开发使用localhost除外），苹果对PWA的运行环境有严格的安全校验

• 启动图与起始路径配置：

  • 建议添加符合设备尺寸的启动图，通过manifest的start_url确保路径正确，且start_url尽量不要带哈希（#）路径（部分场景下哈希路径会导致独立模式失效）

• 苹果专属Meta标签补充：

  • 除了manifest配置，还需要在HTML头部添加以下meta标签：

    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="apple-mobile-web-app-title" content="你的应用名称">
    

如果以上配置都修正完毕，删除iPhone上已添加的PWA，重新从Safari添加到主屏幕，一般就能正常进入standalone模式了。

内容的提问来源于stack exchange，提问作者Shaun