Flutter pwa 应用程序未检测到服务人员

Question

我知道 flutter supports PWA, but I can't enable it in my flutter web app. My web app meet all the requirements 支持 PWA。但是 chrome 和 edge 都不显示安装提示。如果我检查页面，我会发现以下消息：“未检测到匹配的服务人员。您可能需要重新加载页面，或检查当前页面的服务人员范围是否包含范围并从 URL 开始清单”。我没有网络编程经验。

这是我的清单：

{
    "name": "Converter NOW",
    "short_name": "Converter NOW",
    "start_url": ".",
    "display": "minimal-ui",
    "background_color": "#0175C2",
    "theme_color": "#0175C2",
    "description": "A Unit and Currencies Converter. Converter NOW is immediate, fast and easy to use!",
    "orientation": "portrait-primary",
    "prefer_related_applications": false,
    "icons": [
        {
            "src": "icons/Icon-192.png",
            "sizes": "192x192",
            "type": "image/png"
        },
        {
            "src": "icons/Icon-512.png",
            "sizes": "512x512",
            "type": "image/png"
        }
    ]
}

Answer 1

感谢@MarianoZorrilla 和 this issue on Github I figured out what is the problem. Github pages and flutter PWA are not close friends. If you deploy to any other web server probably you will not find any kind of problem, just meet the PWA requirements。但是如果你想在 ghpages 上部署你的 PWA flutter 应用程序，你必须执行以下操作：

认识 PWA requirements
在 <head> 标记后添加 <base href="/projectName/">，如图所示 here
在 flutter_service_worker.js 文件中注释 "/", 大约在第 50 行，如图所示 here

您需要执行此操作，因为 PWA 未存储在根目录 (/)，而是存储在 /projectName/

Flutter pwa 应用程序未检测到服务人员

Flutter pwa app no service worker detected

flutter

progressive-web-apps

flutter-web