ServiceWorker doesn't load Images

Question

I working on implementing the [Service Worker technology] into a site.

Everything works as expected except for Images.

Images aren't loaded at all.

I wonder if this is expected behaviour, or if images are supposed to load.

To reproduce this error, I made a fresh installation of the Polymer Starter Kit and just added one line into the first view my-view1.html

<img src="../images/cat.png" alt="">

I added the image to the according directory.

If you proceed and disable your wifi, you'll see that the page is still loading as expected. Only the cat image will not load.

I am using:

• Polymer-CLI v0.17.0
• Ubuntu v16.04
• node v4.2.6
• npm v3.5.2

Question

Are Images supposed to load with Service Worker? And if yes, what am I doing wrong?

Answer 1

In sw-precache-config.js, just add the files you want to cache:

module.exports = {
  staticFileGlobs: [
    '/index.html',
    '/manifest.json',
    '/bower_components/webcomponentsjs/webcomponents-lite.min.js',
  ],
  navigateFallback: 'index.html',
};

Currently, only index.html, manifest.json, and webcomponents-lite.min.js are registered to get cached by the service worker.

module.exports = {
  staticFileGlobs: [
    '/index.html',
    '/manifest.json',
    '/images/mycat.png',
    '/bower_components/webcomponentsjs/webcomponents-lite.min.js',
  ],
  navigateFallback: 'index.html',
};