ios PWA支持有限但需满足特定规则:必须声明apple-mobile-web-app-capable等meta标签、单独定义apple-touch-icon,且依赖用户手动“添加到主屏幕”;Lighthouse满分不等于真实可用,须手动测试离线加载、SW激活状态及安装流程。

核心判断很简单:能装进手机桌面、能离线打开、有独立窗口、不显示地址栏,这四点都做到,才算真正意义上的 PWA。
manifest.json 配置必须存在且合法
这是 PWA 的“身份证”。没有它,iOS 和部分 Android 浏览器根本不会显示「添加到主屏幕」提示。
-
short_name和name都要填,且short_name不能超过 12 字符(iOS 截断严格) -
icons至少提供192x192和512x512两档 PNG,路径必须可访问(推荐用绝对路径,如/icons/icon-192.png) -
start_url必须是相对根路径的可访问 URL,比如/或/app/,不能是./index.html -
display推荐设为"standalone"(隐藏浏览器 UI)或"minimal-ui"(仅留返回按钮),"browser"就不算 PWA
{ "short_name": "MyApp", "name": "My Awesome Progressive Web App", "icons": [ { "src": "/icons/icon-192.png", "sizes": "192x192", "type": "image/png" }, { "src": "/icons/icon-512.png", "sizes": "512x512", "type": "image/png" } ], "start_url": "/", "display": "standalone", "theme_color": "#4285f4", "background_color": "#ffffff" }
必须注册一个有效的 Service Worker
Service Worker 是 PWA 离线能力的核心。它是个 js 脚本,但必须通过 HTTPS(或 localhost)加载,否则注册会静默失败。
- 注册代码必须放在页面顶层作用域(不能在模块里、不能被
async延迟),常见位置是写在