Как использовать ajax данные ответа в serviceWorker для автономного использования - PullRequest
Новая
       5

Как использовать ajax данные ответа в serviceWorker для автономного использования

0 голосов
/ 10 апреля 2020

На моей странице html я вызываю данные на стороне сервера, чтобы использовать их в автономном режиме. Ajax запрос работает нормально и получает ответные данные в виде набора массивов. Мой вопрос заключается в том, как использовать эти данные ответа для автономного режима с помощью serviceWorker. Любая другая техника или предложение также полезны для меня.

вот вызов ajax: 

<script type="text/javascript">
               $(document).ready(function(){
                    $.ajax({
                       type : "POST",
                       url: //some url,
                       cache: true,
                       success: function( data, textStatus, jqXHR ) {
                        alert('working');
                         var resData = JSON.stringify(data);
                         console.log(resData);
                      },
                       error : function( jqXHR, textStatus, errorThrown ){
                          alert("An issue occured while calling this.");
                      }
                   });
              });
</script>

Эти данные ответа выглядят так: ["item1","item2",....] заполняется в консоли. Нет, мой работник также отлично работает. Кэширует все активы правильно. Но я не уверен, как кэшировать эти данные ответа служащим. вот код serviceWorker: 

    'use strict';

const precacheVersion = 1;
const precacheName = 'precache-v' + precacheVersion;

const offlinePage =['index.html',
'css/common.css',
'css/fader.png',
'css/Save.gif'
];

self.addEventListener('install', (e) => {
    console.log('[ServiceWorker] Installed');
    self.skipWaiting();

    e.waitUntil(
        caches.open(precacheName).then((cache) => {
            console.log('[ServiceWorker] Precaching files');
            return cache.addAll(offlinePage);
        }) 
    ); 
});

self.addEventListener('activate', (e) => {
    console.log('[ServiceWorker] Activated');

    e.waitUntil(
        caches.keys().then((cacheNames) => {
            return Promise.all(cacheNames.map((thisCacheName) => {

                if (thisCacheName.includes("precache") && thisCacheName !== precacheName) {
                    console.log('[ServiceWorker] Removing cached files from old cache - ', thisCacheName);
                    return caches.delete(thisCacheName);
                }

            }));
        }) 
    );
});

self.addEventListener('fetch', (event) => {

  if (event.request.mode === 'navigate') {
    event.respondWith((async () => {
      try {
        const preloadResponse = await event.preloadResponse;
        if (preloadResponse) {
          return preloadResponse;
        }

        const networkResponse = await fetch(event.request);
        return networkResponse;
      } catch (error) {
        console.log('Fetch failed; returning offline page instead.', error);

        const cache = await caches.open(currentCache.offline);
        const cachedResponse = await cache.match(offlinePage);
        return cachedResponse;
      }
    })());
  }
});

Теперь, в моем индексе. html Я регистрирую сервис-работника. Все мероприятия успешны. Я хочу сохранить его в браузере или кэшировать, чтобы использовать его в автономном режиме. Мне нужна помощь с этой стороны.

...