Angular Ошибка PWA Сайт не может быть установлен: не найден соответствующий сервисный работник - PullRequest
Новая
       34

Angular Ошибка PWA Сайт не может быть установлен: не найден соответствующий сервисный работник

2 голосов
/ 15 февраля 2020

У меня есть веб-сайт (Angular 9.0.1), я добавил пакет @angular/pwa, чтобы превратить его в PWA, и он не работает.

Веб-сайт находится на рабочей площадке, но с тестовыми данными сейчас https://new.indomablestore.com

Я проверил, что необходимые файлы (manifest.webmanifest, ngsw.json, ngsw-worker.js) находятся в папке root. Я проверил, что файл index. html правильно указывает на манифест, и он отображается на вкладке Chrome Devtools Application.

Но в разделе Installability указано: «Служба соответствия отсутствует» рабочий обнаружен. Вам может потребоваться перезагрузить страницу или проверить, что работник службы для текущей страницы также контролирует начальный URL из манифеста.

Я также проверил, что файл app.module.ts имеет следующую строку:

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

И я не модифицировал ни один из файлов PWA, я позволил Angular CLI создавать их.

Любая помощь будет оценена, так как сайт собирается go живите скоро, и это последнее, что в моем списке:)

Спасибо!

ОБНОВЛЕНИЕ: Манифест выглядит так: 

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

И Служба Работник зарегистрирован в app.module следующим образом: 

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

Спасибо за быстрые ответы в любом случае:)

Ответы [ 2 ]

6 голосов
/ 15 февраля 2020

Я нашел ответ. Angular ждет, пока приложение не станет "стабильным", прежде чем оно зарегистрирует работника службы. При запуске приложения вызывается AJAX, который проверяет наличие новых продуктов, фотографий на сервере ... и, очевидно, это заставляет Angular думать, что оно нестабильно, поэтому даже не вызывает регистрацию работника сервиса.

Как указано в в этом ответе переполнения стека регистрация имеет опцию с именем "registrationStrategy", и я могу установить для нее значение "registerImmediately". 

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

И это просто начал работать:)

В любом случае, спасибо за помощь и быстрые ответы.

1 голос
/ 15 февраля 2020

Вы можете попытаться установить scop (/) как в манифесте приложения: 

"scope": "/",
"start_url": "/",

, так и при регистрации работника службы: 

    ServiceWorkerModule.register('./ngsw-worker.js', {
      scope: './',
    }),

, но я думаю, что проблема заключается в том, что ваш веб-сервер должен добавить завершающий sla sh. То есть, когда пользователь посещает ваш сайт, он должен быть перенаправлен на new.indomablestore.com/, что соответствует области вашего приложения и базовому пути в вашем индексе.

...