sapper
sapper copied to clipboard
Service worker does not respect (no-)cache header
Describe the bug The service worker that ships with sapper attempts to cache all static files, even if they are served with a header like Cache-Control: no-cache
Note: The issue does not affect every fetch request, but when it starts happening, it doesn't stop. I first noticed it today, after everything worked for the past month.
Logs Until I fixed the issue, the network tab of my browser's devtools showed the headers/contents of the initial/cached fetch request on every repeated fetch request. It even cached the Cache-Control: no-cache header...
To Reproduce (somewhat theoretical)
- Serve a static file like /a_file with Cache-Control set to no-cache
- In the client, fetch("/a_file")
- Modify the file in the filesystem and make sure the server is serving the updated copy
- Reload the client (maybe optional)
- fetch("/a_file") again
Expected behavior If the service worker requests a file and that file is served with a Cache-Control header, it should not attempt to cache the file. Therefore, the second fetch should return the new version.
Information about your Sapper Installation:
npx: installed 1 in 0.726s
System: OS: Linux 5.4 Ubuntu 20.04.1 LTS (Focal Fossa) CPU: (8) x64 Intel(R) Core(TM) i7-7700K CPU @ 4.20GHz Memory: 12.89 GB / 31.31 GB Container: Yes Shell: 5.0.17 - /bin/bash Binaries: Node: 14.13.0 - ~/.nvm/versions/node/v14.13.0/bin/node npm: 6.14.8 - ~/.nvm/versions/node/v14.13.0/bin/npm Browsers: Firefox: 81.0 npmPackages: rollup: ^2.3.4 => 2.33.1 sapper: ^0.28.0 => 0.28.10 svelte: ^3.17.3 => 3.29.4
- AWS S3 (file marked with metadata Cache-Control = no-cache)
- npm run export (not dynamic)
Severity I found a workaround (see below) after about an hour.
Additional context
Filtering the to_cache list to only include .css files instantly fixed the issue (the no-cache header was applied to a different file type)
The main benefit of service workers is that the app can work offline, so I am wondering if there is really a alternative of not caching everything. Instead of avoiding caching file with (no) cache header an other way would be to deliver from cache only if the user is offline. The normal browser cache will otherwise take care of doing the right thing. That way the service work could also load newer versions of files if it is online and stale data if the user is offline. Service worker implementation could be made configurable so that the app developer could decide if this or other workflows should be used at all.
FWIW I find that the service worker gets in they way of my static website apps, either by caching too much (meaning that my website loads out of date css/js) or too little (like in this case). I would appreciate a way to disable it.