Angular PWA - кэширование удаленных изображений - PullRequest
Новая
       30

Angular PWA - кэширование удаленных изображений

0 голосов
/ 08 мая 2019

Я пытаюсь кэшировать изображения с помощью приложения Angular 7 PWA (созданного с помощью ng add @angular/pwa).Все отлично работает, кроме изображений.Вот как выглядит файл ngsw-config.json (по крайней мере, соответствующий раздел): 

{
      "name": "assets",
      "installMode": "lazy",
      "updateMode": "prefetch",
      "resources": {
        "files": [
          "/assets/**"
        ],
        "urls": [
          "https://fonts.googleapis.com/**",
          "https://fonts.gstatic.com/**",
          "https://res.cloudinary.com/**"
        ]
      }
    }

Странно то, что когда я смотрю на кеш с помощью DevTools, я вижу изображения там (вместе сшрифты).Но когда я отключаю приложение, только изображения не работают - они в основном возвращаются с ошибкой 504:

Error: Response not Ok (fetchAndCacheOnce): request for https://res.cloudinary.com/[removed]/image/upload/[removed].png returned response 504 Gateway Timeout (я удалил части URL)

Шрифты, однако, возвращают HTTP 200 (от Service Worker).

Я весьма озадачен этим, почему изображения не будут обслуживаться в автономном режиме?Я что-то здесь упускаю?

1 Ответ

0 голосов
/ 09 мая 2019

Я понял это - оказывается, что при использовании изображений Cloudinary с флагом f_auto Cloudinary возвращает HTTP-заголовок Vary, что вызывает некоторые проблемы. На данный момент я не нашел способа установить параметр ingoreVary для Cache API через ngsw. Больше информации здесь: https://github.com/angular/angular/issues/28443#issuecomment-490765336

...