Strona PWA i wczytywanie JSON'a z URL.

0

Cześć,
Ostatnio zacząłem bawić się ze stronami PWA. Dzisiaj chciałem stworzyć stronę PWA, w której wczytuję JSON'a z url, ale totalnie nie mogę rozgryźć, jak zrobić cache'owanie takiego JSON'a. Nie mam pojęcia w jaki sposób miałbym to zrobić. Czytałem trochę o tym w Internecie i niestety nie udało mi się w dalszym ciągu rozgryźć. Może ktoś z Was próbował robić coś takiego i udało mu się to?
Tutaj mój kod js do wczytania JSON'a z URL:

fetch('https://www.json-generator.com/api/json/get/cfTRolENrC?indent=2')
.then(res => res.json())
.then(data => obj = data)
.then(() =>{
  var x = document.getElementById("ad");
console.log(obj);
x.innerHTML = obj[0].name;     
      });

A tutaj mój sw.js :

self.addEventListener("install", e =>{
    e.waitUntil(
        caches.open("static").then(cache => {
            return cache.addAll(["./","./src/master.css","./images/icon.png"]);
        })
    );
});
self.addEventListener("fetch", e =>{
    e.respondWith(
        caches.match(e.request).then(response => {
            return response || fetch(e.request);
        })
    );
});
1

A mógłbyś opisać, to ty tutaj właściwie robisz/próbujesz robić w poszczególnych punktach i co ci tutaj nie działa?

0

Tutaj wszystko działa tak jak trzeba. Tylko nie mam pojęcia w jaki sposób teraz tego JSON'a, którego wczytuje online, zapisać za pomocą sw.js (chyba?) tak, by w trybie offline również go mi wczytało. Inaczej mówiąc w jaki sposób zrobić cache'owanie na tym JSON'ie, którego wczytuje z innej strony. Potrzebuję porady w jaki sposób to zrobić :)

0

Chciałbym ogarnąć cache'owanie typowe dla PWA, czyli za pomocą pliku manifest i service worker. Miałem nadzieję, że może ktoś na forum coś w tym robił ;/
Udało mi się to rozwiązać. Wystarczy dodać do naszych static linków URL JSON'a, którego wczytujemy. Czyli w tym przypadku wyglądałoby to tak:

self.addEventListener("install", e =>{
    e.waitUntil(
        caches.open("static").then(cache => {
            return cache.addAll(["./","./src/master.css","./images/icon.png",
                                            https://www.json-generator.com/api/json/get/cfTRolENrC?indent=2]);
        })
    );
});
self.addEventListener("fetch", e =>{
    e.respondWith(
        caches.match(e.request).then(response => {
            return response || fetch(e.request);
        })
    );
});

1 użytkowników online, w tym zalogowanych: 0, gości: 1