Использование сервисного работника для получения списка файлов для кэширования с сервера - PullRequest
Новая
       6

Использование сервисного работника для получения списка файлов для кэширования с сервера

0 голосов
/ 08 ноября 2018

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

Вот что у меня есть:

Контроллер: 

    public ActionResult GetFilesToCache()
    {
        string[] filePaths = Directory.GetFiles(Server.MapPath(@"~\Content"), "*", SearchOption.AllDirectories);
        string[] cuttedFiles = new string[filePaths.Length];
        int i = 0;

        foreach (var path in filePaths)
        {
            cuttedFiles[i] = path.Substring(path.IndexOf("Content"));
            i++;
        }

        return Json(new { filesToCache = cuttedFiles }, JsonRequestBehavior.AllowGet);
    }

Это дает мне строковый массив с такими записями, как "Content \ image1.png" и т. Д.

Обслуживающий работник: 

    self.addEventListener('install', function(e) {
  console.log('[ServiceWorker] Install');
    e.waitUntil(
            caches.open(cacheName).then(function (cache) {
            console.log('[ServiceWorker] Caching app shell');

            return fetch('Home/GetFilesToCache').then(function (response) {
                return response;
            }).then(function (files) {
                return cache.addAll(files);
            });      
    })
  );
});

Я получаю ошибку: 

Uncaught (in promise) TypeError: Failed to execute 'addAll' on 'Cache': Iterator getter is not callable.

Вызов действия работает просто отлично, данные принимаются работником службы, но не добавляются в кэш.

Ответы [ 3 ]

0 голосов
/ 12 ноября 2018

Получил работу с этим кодом: 

    self.addEventListener('install', function(e) {
  console.log('[ServiceWorker] Install');
    e.waitUntil(
        caches.open(cacheName).then(function (cache) {
            console.log('[ServiceWorker] Caching app shell');

            return fetch('Home/GetFilesToCache').then(function (response) {
                return response.json();
            }).then(function (files) {
                var array = files.filesToCache;
                return cache.addAll(array);
            });      
    })
      );
    });

Примечание: Chrome перечисляет только часть файлов, хранящихся в кеше, поэтому вам просто нужно нажать на эту маленькую стрелку, чтобы показать следующую страницу:

enter image description here

0 голосов
/ 28 февраля 2019 
return fetch('Home/GetFilesToCache').then(function(response) {
    return response.json();
}).then(function(files) {
    return cache.addAll(files);
});

Возвращенный файл имеет свойство «filesToCache» для «files», а также использует «add» вместо «addAll».

Так что вам нужно написать следующим образом. 

return fetch('Home/GetFilesToCache').then(function(response) {
    return response.json();
}).then(function(files) {
    return cache.add(files.filesToCache);
});
0 голосов
/ 08 ноября 2018

В следующем коде: 

return fetch('Home/GetFilesToCache').then(function (response) {
    return response;
}).then(function (files) {
    return cache.addAll(files);
});

значение параметра files будет Response объектом. Вы хотите, чтобы это была JSON десериализация тела Response объекта. Вы можете получить это, изменив return response на return response.json(), что приведет к: 

return fetch('Home/GetFilesToCache').then(function(response) {
    return response.json();
}).then(function(files) {
    return cache.addAll(files);
});
...