有没有一种方法可以针对每个设备的缓存中的某些资源。
我正在开发一个离线的html5音频播放器。显然,我必须根据HTML5规范指定文件类型,如用于webkit的Mp3和用于firefox的Vorbis等。然而,对于在iPhone等移动设备上使用,我只想获得在这种情况下播放Mp3所需的文件。我有没有办法告诉浏览器缓存特定的文件,或者他们无论如何都必须添加所有资源。这样就消除了用户必须缓存更多所需文件并超出限制的负担(我知道在移动safari中只能缓存10MB。)
这是我的清单。
CACHE MANIFEST
CACHE:
index.html
master.js
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js
style.css
buttons.png
coldplay.jpg
/player/tunes/waterfall-audio.m4a
/player/tunes/waterfall-audio.oga
很明显,在firefox中,我只需要缓存oga和webkit的mp3。任何见解都会很棒!
使用怎么样
/player/tunes/getDeviceAudio.php/waterfall-audio.audio
而不是
/player/tunes/waterfall-audio.m4a
和PHP代码(你可以用另一种语言实现)
<?php
// replace the name
$filename = preg_replace('/.audio$/iu', '', $_SERVER['PATH_INFO']); // waterfall-audio
$ext = '';
switch ($_SERVER['HTTP_USER_AGENT']) {
default:
case 'a user agent string': $ext = '.oga'; break;
case 'another user agent string': $ext = '.m4a'; break;
}
$filepath = "/path/to/audio/" . $filename.$ext;
echo file_get_contents($filepath);
浏览器会认为,这是一个要缓存的文件,并将为确切的设备进行缓存。每个设备都将缓存其userAgent支持的正确文件。
或者动态生成清单并根据解析的用户代理更改内容。