Making Media Heavy Mobile App Work Fully Offline

Really interest in migrating a web app along with sibling iOS/Android apps that connect to the web’s APIs into a unified Meteor app if possible. However, our mobile apps need to be able to work fully offline while still allowing a user to access all the media content that the app is composed of.

My understanding is that web based storage/caching strategies are too limited for this task currently when needing to be store up to a gig of files for offline access.

Does anyone know if Meteor offers or allows access to a tool that would make this possible? Maybe something like this cordova-plugin-file module?

It would be most appreciated!

1 Like

I’ve done something similar - it’s not easy, there are a LOT of edge cases. Web on desktop + chrome is easy enough, you can use a service worker. However in IOS and Android, you need to use the file plugin, but you also need to be cautious of file name length - for that reason it’s advisable to hash the file name (constant length) however, you need to keep the file extension. If your media includes media files, you also need to serve them from a custom device based web server (because the media player of mobile devices exists outside an app).

2 Likes

Hey, thanks for sharing your mostly encouraging experience. Can you expand on what you meant by ‘you also need to serve them [media] from a custom device based web server’. Not really clear what is meant by ‘custom device based web server’? And the Cordova file plugin works smoothly with Meteor otherwise though?

Appreciate the feedback!

“smoothly” is a little subjective - it doesn’t really interact with Meteor, it’s entirely manual (e.g., when you’re offline you have to switch to using your offline URLs).

Regarding the media - I’m talking audio/video files. When I was working on this (about a year ago) they would not reliably work offline in both ios and android devices when served from a cordova file URL, nor from the URL issued by the file plugin. Instead, I had to spin up a web server on the device (Meteor already does this on iOS, but it serves the meteor content, so you need a second one on a different port). Then your content is served by a “real” web server, that any application (including the regular browser) on the device can hit. This is what enables the system media player to access the files.

2 Likes

I see, interesting, thank you for the info! Too bad it is not as simple as it could be. Can you describe a bit how your went about setting up the separate server and if there is any good tool available to facilitate that process at least?

Maybe something like spa-http-server?

Honestly, it was a huge pain in the ass, as I said - all edge cases, and undocumented limitations, some of them device specific (like the file name length). We used cordova-plugin-httpd for the server, and we just randomly select a port (well, we have a preferred port, then we randomly choose if it isn’t available). Using the package to setup the server is trivial (apart from the port number conflict) - more tricky is generating the URLs, handling storage limits, toggling between offline and online content, these will all likely be specific to your use cases (e.g., when running out of space, do you delete “expired” content, or just fail silently, or warn the user?)