Angular PWA не работает на локальном IIS в автономном режиме - PullRequest
Новая
       19

Angular PWA не работает на локальном IIS в автономном режиме

0 голосов
/ 07 марта 2019

Я пытаюсь добиться следующего.

Угловой pwa с угловыми версиями 6 и 7 прекрасно работает, когда я следую онлайн-инструкциям. Я создаю новое приложение ng, будь то 6 или 7. Затем я выполняю ng build --prod, затем иду в папку dist и запускаю команду http-server -o. И все работает, как и обещано.

Но когда я создаю локальное приложение IIS (с сертификатом, который принимает браузер Google), поместив его в папку ng dist, и я выбираю https://localhost/test/pwatest, проект работает нормально, моя манифестная работа json и работника ngsw зарегистрирован. Но когда я выхожу из сети, появляется Tyrex. Ничего не получено. Я действительно много гуглю и видел много людей, имеющих эту проблему, но эта проблема сохраняется.

manifest.json 

{
    "name": "pwatest",
    "short_name": "pwatest",
    "theme_color": "#1976d2",
    "background_color": "#fafafa",
    "display": "standalone",
    "scope": "/",
    "start_url": "/",
    "icons": [{
        "src": "assets/icons/icon-72x72.png",
        "sizes": "72x72",
        "type": "image/png"
    }, {
        "src": "assets/icons/icon-96x96.png",
        "sizes": "96x96",
        "type": "image/png"
    }, {
        "src": "assets/icons/icon-128x128.png",
        "sizes": "128x128",
        "type": "image/png"
    }, {
        "src": "assets/icons/icon-144x144.png",
        "sizes": "144x144",
        "type": "image/png"
    }, {
        "src": "assets/icons/icon-152x152.png",
        "sizes": "152x152",
        "type": "image/png"
    }, {
        "src": "assets/icons/icon-192x192.png",
        "sizes": "192x192",
        "type": "image/png"
    }, {
        "src": "assets/icons/icon-384x384.png",
        "sizes": "384x384",
        "type": "image/png"
    }, {
        "src": "assets/icons/icon-512x512.png",
        "sizes": "512x512",
        "type": "image/png"
    }]
}

ngsw-config.json 

{
    "index": "/index.html",
    "assetGroups": [{
        "name": "app",
        "installMode": "prefetch",
        "resources": {
            "files": ["/favicon.ico", "/index.html", "/*.css", "/*.js"]
        }
    }, {
        "name": "assets",
        "installMode": "lazy",
        "updateMode": "prefetch",
        "resources": {
            "files": ["/assets/**", "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"]
        }
    }]
}

Между прочим, когда я выполняю аудит, это показывает Сбои: Сервисный работник не успешно обслуживает манифест start_url, Превышено время ожидания для извлеченного start_url.

1 Ответ

0 голосов
/ 10 июля 2019

Вам необходимо добавить массив « групп данных » в файл ngsw-config.json .

При этом необходимо упомянуть URL-адреса конечных точек API, который вы хотите кэшировать данные ответа.

sample ngsw-config.json Файл: 

{
  "index": "/index.html",
  "assetGroups": [{
    "name": "app",
    "installMode": "prefetch",
    "resources": {
      "files": [
        "/favicon.ico",
        "/index.html",
        "/*.css",
        "/*.js"
      ]
    }
  }, {
    "name": "assets",
    "installMode": "lazy",
    "updateMode": "prefetch",
    "resources": {
      "files": [
        "/assets/**"
      ]
    }
  }],
  "dataGroups": [{
    "name": "get-apis",
    "urls": [
      "https://jsonplaceholder.typicode.com/posts",
      "https://jsonplaceholder.typicode.com/comments",
    ],
    "cacheConfig": {
      "strategy" : "performance",
      "maxAge" : "1d",
      "maxSize" : 100
    }
  }
  ]
}

Он будет кешировать данные из обоих адресов API и обслуживатьданные, когда вы в автономном режиме.

Надеюсь, это поможет ...

...