Сервисный воркер Angular 10. Как настроить ngsw-config.json

Я много боролся с моим файлом ngsw-config.json, особенно с разделом dataGroups, где ответы на запросы никогда не кэшируются. Я пробовал тысячу разных способов с более или менее одинаковым результатом, получая много несоответствий в данных и нескольких сервисных работников, зарегистрированных одновременно или говоря, что они избыточны.

Когда дело доходит до локальных транспилированных файлов, даже если они кажутся кешированными, всякий раз, когда я отключаюсь от самого веб-инспектора, я даже не могу обновиться, не получив ошибки 504. Я явно что-то упускаю.

      {
  "$schema": "./node_modules/@angular/service-worker/config/schema.json",
  "index": "/index.html",
  "assetGroups": [
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/favicon.ico",
          "/index.html",
          "/manifest.webmanifest",
          "/*.css",
          "/*.js"
        ]
      }
    },
    {
      "name": "assets",
      "installMode": "prefetch",
      "updateMode": "lazy",
      "resources": {
        "files": [
          "/assets/**",
          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
        ]
      }
    }
  ],
  "dataGroups": [
    {
      "name": "apis",
      "urls": [
        "!https://api:3001/orders/",
        "!https://api:3001/health/",
        "!https://api:3001/reports/",
        "!https://api:3001/orders/**",
        "!https://api:3001/health/**",
        "!https://api:3001/reports/**",
        "https://api:3001/companies",
        "https://api:3001/commerces",
        "https://api:3001/categories",
        "https://api:3001/products",
        "https://api:3001/paymentTypes",
        "https://api:3001/modifierGroups",
        "https://api:3001/users",
        "https://api:3001/modifierGroupProducts",
        "https://api:3001/profiles",
        "https://api:3001/cities",
        "https://api:3001/companies/**",
        "https://api:3001/commerces/**",
        "https://api:3001/categories/**",
        "https://api:3001/products/**",
        "https://api:3001/paymentTypes/**",
        "https://api:3001/modifierGroups/**",
        "https://api:3001/users/**",
        "https://api:3001/modifierGroupProducts/**",
        "https://api:3001/profiles/**",
        "https://api:3001/cities/**"
      ],
      "cacheConfig": {
        "maxAge": "2d",
        "maxSize": 100,
        "timeout": "5s",
        "strategy": "freshness"
      }
    }
  ]
}

Конечные точки были явно изменены для демонстрационных целей, правильные конечные точки помещены в тот же формат

Другое дело, каков правильный подход, чтобы не влиять на пользователей при изменении ngsw или развертывании новой версии приложения? Я изо всех сил пытался проверить это из-за необходимости удалить ВСЕ данные из вкладки приложения, а также отменить регистрацию SW в некоторых случаях, что приводило в некоторых сценариях к некоторым ошибкам, с которыми я столкнулся.

Любая помощь будет ОЧЕНЬ признательна, это сводит меня с ума.

0 ответов

Другие вопросы по тегам