移动网络应用和离线访问音频文件

Question

是否可以使用HTML5缓存清单在移动Web应用程序中缓存音频文件以进行离线访问？ 我也不明白尺寸限制的工作原理。 （我读iOS的5MB限制） 我找不到那些或最佳实践的资源。

感谢您的帮助

Answer 1

是的 - 浏览器会缓存AppCache中列出的所有文件，无论它们是HTML文件，JavaScript还是音频文件。只要它们在CACHE部分中明确提及，它们就可以脱机使用。

要获得一个好的AppCache教程，请查看http://www.html5rocks.com/en/tutorials/appcache/beginner/，它会引导您完成所需的一切。

大小限制可防止您在用户计算机上存储过多内容。在大多数情况下，如果您只是存储HTML，CSS，JavaScript和一些图像，这不是问题，但在您的情况下，如果您要存储音乐，您可能会很快达到这个限制。大多数浏览器限制您存储最多5兆（对于所有内容），因此您需要注意这一点。

Chrome提供了一系列用于调试appcache的工具，因为您正在开发网站，打开开发人员工具并观看控制台以查看会发生什么。

Answer 2

通过缓存清单文件缓存音频文件仍然无法在最高版本为5.1的Android手机上运行。我不能说Android 6或iPhone，iPad，因为我没有这样的设备。但是我尝试在Android 5.1和Android 3上使用尺寸仅为2 Kb的mp3文件并且它们没有缓存在这些手机上，而缓存了200 Kb js文件。

目前的解决方案似乎是用base 64编码mp3文件并将其放入可以缓存的js文件中。可以在http://grinninggecko.com/2011/04/09/html5-offline-audio/找到一个很好的描述。