Search code examples
vue.jshtml5-audioservice-workeroffline-caching

Cache MP3 Audio Files for Offline Access

I have built a Single Page Application in Vue, but now I get a request for an offline version, where you can listen to a mp3 file offline, e.g. in the Plane or in areas with no signal.

Is it possible with Vue, a local storage or the service-worker to add a audio file to the local storage (download for offline listening), and have some kind of expiration date, almost like you have on a native app, e.g. Spotify?

Solution

  • Consider using IndexDB, which can store binary data as blobs without explicit base64 encoding:

    Jake A wrote a nice library to interface with IndexDB more cleanly:

    https://github.com/jakearchibald/idb