Android 可以使用缓存清单离线缓存 HTML5 视频吗?

发布于 2025-01-03 20:19:42 字数 747 浏览 3 评论 0原文

我有一个例子,它在 Chrome 上缓存良好,并在离线时显示视频。

当我使用 android 3.2 和 4.x 平板电脑尝试此示例时,视频将仅在线播放,而不能离线播放 - 尽管 HTML 文件和背景等其他元素离线显示。

<!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>

缓存清单 example.appcache 看起来像:

CACHE MANIFEST

index.html
railer.mp4
background.jpg

NETWORK:
*

有没有人设法通过缓存清单为 Android 浏览器提供离线视频缓存?

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?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

开始看清了 2025-01-10 20:19:42

我曾尝试使用默认浏览器以及 Chrome 27.0 在 Android 4.1.2 上缓存视频(mp4 格式)和音频(mp3 格式)文件,但正如您在帖子中提到的,虽然它缓存了这些元素,但它没有播放离线模式下的视频和音频。

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.

复古式 2025-01-10 20:19:42

问题是 HTML5 离线规范各种 帖子 互联网上显示了离线存储的不同配额限制。

在 StackOverflow 上也存在很多关于缓存最大值的问题。文件大小:

  • HTML5 清单有大小限制吗?
  • < a href="https://stackoverflow.com/questions/9111795/how-can-i-store-a-50mb-video-in-html5s-app-cache">我如何存储HTML5 的应用程序缓存中有 50MB 视频?

我认为可以肯定地说,可用的最大配额在很大程度上取决于浏览器和平台 - 有时甚至取决于可用空间。

有一个可用的工具http://demo.agektmr.com/storage/(在此<一个 href="http://www.html5rocks.com/en/tutorials/offline/quota-research/" rel="nofollow noreferrer">文章),允许检查您的设备上可用的最大配额。也许当您检查时您会发现您要缓存的视频的文件大小对于您的设备来说太大了。

TL;DR 提到的来源让我得到以下答案:(有时)可以将视频存储到有限的文件大小,具体取决于浏览器、平台和运行环境。但不能保证它会被正确缓存(至少如果它不够小)。

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).

忆沫 2025-01-10 20:19:42

我已经包含了一个简单的骨头 示例 (src)了解如何在使用应用程序缓存或 Service Worker 时缓存 HTML5 视频以供离线使用。

要存储视频以供离线使用,

  1. 请以数组缓冲区的形式获取视频 将
  2. 数组缓冲区存储在 IndexedDb 中
  3. 将数组缓冲区转换为 blob
  4. 将 blob 分配给视频源
  5. 离线时,从 IndexedDB 获取视频源

您可以从以下位置获取视频源如果您愿意的话,在线时也可以使用 IndexedDB。

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

  1. fetch the video as an Array Buffer
  2. store the Array Buffer in IndexedDb
  3. convert the Array Buffer into a blob
  4. Assign the blob to the video's source
  5. 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.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文