Angular PWA 错误站点无法安装 : no matching service worker detected

Question

我有一个网站(Angular 9.0.1)，我添加了 @angular/pwa 包以将其转换为 PWA，但它不起作用。

该网站在生产网站上，但现在在 https://new.indomablestore.com 上有测试数据

我已经检查了所需的文件( manifest.webmanifest 、 ngsw.json 、 ngsw-worker.js )是否位于根文件夹中。
我已检查 index.html 文件是否正确指向 list ，并显示在 Chrome Devtools Application 选项卡上。

但是在 Installability 部分它说:没有检测到匹配的服务 worker 。您可能需要重新加载页面，或者检查当前页面的 service worker 是否还控制 list 中的起始 URL。

我还检查了 app.module.ts 文件是否包含以下行:
ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production })
我没有修改任何 PWA 文件，我让 Angular CLI 构建它们。

任何帮助将不胜感激，因为该网站即将上线，这是我名单上的最后一件事:)

谢谢!

更新: list 如下所示:

  "name": "Indomable",
  "short_name": "Indomable",
  "theme_color": "#1976d2",
  "background_color": "#fafafa",
  "display": "standalone",
  "scope": "/",
  "start_url": "/",
  "icons": [
    ...
  ]
}

Service Worker 在 app.module 上注册如下:

@NgModule({
  declarations: [
    AppComponent,
    ...PAGES,
    ...COMPONENTS,
    ...PIPES
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    FormsModule,
    routing,
    NgxPayPalModule,
    ServiceWorkerModule.register('./ngsw-worker.js', { enabled: environment.production, scope: './' })
  ],
  ...

无论如何，感谢您的快速回答:)

Answer 1

我找到了答案。 Angular 会等到应用程序“稳定”后再注册服务 worker 。该应用程序在启动时有一个 AJAX 调用，它会检查服务器是否有新产品、照片……显然这让 Angular 认为它不稳定，因此它甚至不调用服务 worker 注册。

正如 this Stack Overflow answer 所指出的，注册有一个名为“registrationStrategy”的选项，我可以将其设置为“registerImmediately”。

ServiceWorkerModule.register('ngsw-worker.js', 
    { 
       enabled: environment.production,
       registrationStrategy: 'registerImmediately'
    }
)

它刚刚开始工作:)

无论如何，感谢您的帮助和快速答复。