Can Android cache HTML5 video with cache manifest offline?

Question

I have example which is cached fine on chrome and displays video while offline.

When i try this example with android 3.2 and 4.x tablet, video will play only online, but not offline - although other elements like HTML file and background are present offline.

<!DOCTYPE html>
<html manifest="example.appcache">
    <head>
        <title>Hello Video!</title>
        <style>
        body{ background: url('background.jpg');}
        </style>
    </head>
    <body>
        <video width="855" height="480" controls="">
            <source src="railer.mp4"/>
        </video>
    </body>
</html>

And cache manifest example.appcache looks like:

CACHE MANIFEST

index.html
railer.mp4
background.jpg

NETWORK:
*

Has anybody managed to get offline video caching working for android browsers via cache-manifest?

@ alarmatwork, please view: http://stackoverflow.com/a/42379075/1911755 — Raphael Rafatpanah, Feb 21 '17 at 22:21

score 2 · Answer 1 · answered May 30 '13 at 17:22

I have tried to cache video (mp4 format) as well audio (mp3 format) files on Android 4.1.2 using its default browser as well as Chrome 27.0 but as you have mentioned in your post though it cached these elements it did not played the video and audio in the offline mode.

score 0 · Answer 2 · edited May 23 '17 at 11:53

The problem is the AppCache maximum size is not specified in the HTML5 offline spec. Various posts on the internet show different quota limits for the offline storage.

On StackOverflow also a lot of questions exist regarding the question of the cache's max. filesize:

I think all that is safe to say is, that the maximum quota useable heavily depends on the browser and platform - and sometimes even on the free space available.

There's a tool available http://demo.agektmr.com/storage/ (found in this article) that allows to check the maximum quota useable on your device. Maybe when you check it out you will find out that the filesize of the video you want to cache is too big for your device.

TL;DR The sources mentioned lead me to the following answer: It is (sometimes) possible to store a video up to a limited filesize, dependent on browser, platform and running environment. But there's no guarantee that it will be cached properly (at least if it is not small enough).

In my case, I have confirmed that the video files have been stored by the browser (and my video files are only between 1mb and 3mb in any case), but they are still not playing when the browser is offline. — rdans, Sep 24 '14 at 12:05
Oh - you got the browser to have the video cached (i.e. saved to storage) but it won't load the cached file? Well, sounds more like a browser bug to me than a limitation of the appcache feature. — Briareos386, Sep 24 '14 at 13:19

score 0 · Answer 3 · answered Feb 21 '17 at 22:20

I've included a bare bones example (src) on how to cache an HTML5 video for use offline when using Application Cache or Service Worker.

To store the video for offline use

fetch the video as an Array Buffer
store the Array Buffer in IndexedDb
convert the Array Buffer into a blob
Assign the blob to the video's source
When offline, grab the video's source from IndexedDB

You can grab the video's source from IndexedDB when online as well, if you would like.

Can Android cache HTML5 video with cache manifest offline?

3 Answers3