chrome中pwa安装无反应，主因是manifest.json缺失name、short_name、start_url、display等字段或icons尺寸不符；需https、正确content-type、head中link标签且路径可访问；service worker注册须在load后、同源、scope正确、返回200和application/javascript；start_url须被sw缓存且为相对或绝对路径；仅chromium系浏览器支持完整桌面图标安装。
Chrome 里点“安装”按钮没反应？检查 manifest.json 是否合规
很多网页加了 PWA 支持，但用户点地址栏的 + 或右上角“安装”图标却没反应——大概率是 manifest.json 缺关键字段或路径不对。
-
manifest.json必须包含name、short_name、start_url、display（推荐"standalone"或"minimal-ui"），且icons至少提供一个192x192和一个512x512的 PNG - 文件必须通过 HTTPS 提供，且响应头含
Content-Type: application/manifest+json（部分 Nginx/Apache 配置会漏掉） -
link标签要写在 HTML 的里：<link rel="manifest" href="/manifest.json">，路径必须可访问（打开https://yoursite.com/manifest.json能直接看到 JSON 内容） - Chrome 不会为 localhost 以外的 HTTP 站点触发安装提示，开发时用
localhost或127.0.0.1没问题，但http://mydev.local不行
Service Worker 注册失败：常见报错和修复路径
Uncaught DOMException: Failed to register a ServiceWorker 这类错误基本锁定在注册时机或作用域问题。
- 确保
navigator.serviceWorker.register()在页面加载完成之后调用（比如放在window.addEventListener('load', ...)里），不能在 DOM 尚未就绪时执行 - Service Worker 文件（如
sw.js）必须与页面同源，且路径在scope范围内；默认作用域是sw.js所在目录，若想控制整个站点，注册时显式传参：navigator.serviceWorker.register('/sw.js', { scope: '/' }) - 如果服务器返回 404、403 或非 JS MIME 类型（如
text/plain），注册会静默失败；用 DevTools 的 Network 面板确认sw.js返回状态码 200 且Content-Type是application/javascript - 避免在
sw.js里写同步阻塞操作（如localStorage、alert），它不支持这些 API，会直接终止注册
安装后打不开或白屏：start_url 和缓存策略不匹配
点击桌面图标启动应用却卡白屏，通常是 start_url 没被 Service Worker 缓存，或者跳转逻辑依赖未离线可用的资源。
-
start_url必须是相对路径（如"./index.html"）或绝对路径（如"/"），不能是外部 URL；它指向的页面必须能被 SW 拦截并返回缓存内容 - 在
sw.js的install或activate事件中，明确缓存start_url对应的 HTML 及其依赖的 JS/CSS/图片，否则首次离线启动必然失败 - 不要在
start_url页面里用window.location.replace()或路由重定向跳到未缓存的路径；PWA 启动时只保证start_url可用，其余路径需自行缓存 - 调试技巧：在 Application → Manifest 面板看
start_url解析是否正确；在 Network 面板勾选 “Offline”，手动访问该 URL 看是否 200
Windows/macOS 桌面图标不出现？不是所有浏览器都支持“添加到桌面”
Chrome 和 Edge（Chromium 内核）支持完整 PWA 安装流程，生成原生桌面图标；Firefox 和 Safari 当前仅支持部分 PWA 特性，不提供“添加到桌面”入口。
立即学习“前端免费学习笔记（深入）”；
- Chrome（Win/macOS）：安装成功后自动在开始菜单/应用程序文件夹生成图标，并可固定到任务栏或 Dock
- macOS 用户若没看到图标，检查是否禁用了“允许网站将 PWA 安装为应用”（设置 → 隐私与安全 → 网站设置 → 更多内容设置 → PWA 安装）
- Windows 上图标可能延迟出现，重启 Chrome 或运行
chrome://apps查看已安装 PWA 列表 - 注意：即使安装成功，某些企业环境或组策略会禁用 PWA 安装功能，此时界面无提示，但实际无法创建桌面快捷方式
真正麻烦的是跨浏览器兼容性——Safari 的 web-app-capable 元标签只能模拟全屏，不触发安装流程；而 Firefox 目前不实现 navigator.getInstalledRelatedApps() 和安装 UI。别指望一套配置全平台生效。
