Item cached in the cache storage under relative paths

Question

I am trying to add some static pages to cache using standard technique in the install event of the service worker:

self.addEventListener('install',function(event) {
    event.waitUntil(
        caches.open(static_cache).then(function(cache){
            return cache.addAll([
             '/', 
             'index.html',
             'css/styles.css',
             'js/dbhelper.js',
             'js/main.js',
             'js/restaurant_info.js'
            ])
        })
    )
})

but when I look into cached items - I see they're cached under relative paths:

So of course when fetch event comes for the full path - there will be no match in cache. Any idea why this is happening?

score 2 · Accepted Answer · answered Jun 29 '18 at 20:05

2

I may be mistaken but I think the Dev Tools cache interface just displays the relative paths. But I believe they are cached with the full path.

If you log the cache content you should see the full path.

For example my cache interfaces shows "/", but both of these:

caches.match('https://offline-data-driven-pwa.firebaseapp.com/')
  .then(res => console.log(res)) 

caches.match('/')
  .then(res => console.log(res))

log the https://offline-data-driven-pwa.firebaseapp.com/ resource

answered Jun 29 '18 at 20:05

David

2,846
3
22
34

1

Thank you, that indeed seems to be the case. What confused me I watched a training course on workers/cache and in that video relative paths were cached, but full paths were shown in cache in dev tools. Could be a different/earlier version of Chrome. In any case my caching is working fine now, though I still have no idea why `cache.match` wasn't finding the match before. – Yuriy Galanter Jun 29 '18 at 20:14
1

@YuriyGalanter no worries. I believe that earlier Chrome did in fact show full paths – David Jun 29 '18 at 20:39
@David How about this situation, https://stackoverflow.com/questions/76915595/clarification-needed-about-using-relative-file-paths-with-the-cache-api-compar – HolyResistance Aug 17 '23 at 15:14

Item cached in the cache storage under relative paths

1 Answers1