可以缓存使用清单或Web存储在iOS的web应用程序的声音文件？

当我加我嘟嘟23.mp3文件缓存清单，声音效果不再适用于或离线。这是一个错误，还是我做错了什么？可以缓存使用清单或Web存储在iOS的web应用程序的声音文件？

音频是一个html文件中：

function playBEEP() { if (navigator.platform == "iPad" || navigator.platform == "iPhone" || navigator.platform == "iPod") { Beep.play(); } } 
if (navigator.platform == "iPad" || navigator.platform == "iPhone" || navigator.platform == "iPod") { 
    var Beep = document.createElement('audio'); 
    Beep.setAttribute('src', 'beep-23.mp3'); 
}

通过下列方式访问：

$("#mybutton,#anotherbutton").each(function() { 
    $(this).bind("touchstart",function(e){ 
      playBEEP(); 
    }); 
});

<html manifest='index.manifest'>使声音停止上市哔23.mp3时工作......

UPDATE：能Web Storage被用来代替缓存清单来存储音频？

来源

2012-02-13 shaun5

您是否检查清单的内容是否实际下载？也许这只是一个错字... – andreapier 2012-02-19 21:26:41

不知道更多关于你在做什么，真的很难说它是否是你的代码。 – livingtech 2012-02-21 16:30:47

添加示例代码。 – shaun5 2012-02-22 05:14:21

更新的iOS 6：

这一切都是在固定的iOS 6，您可以缓存的音频文件，并通过JavaScript播放而无需用户输入。
shaun5 11月7日在'12 0:58

即使它应该工作，没有规范（W3C，苹果），它说，它不应该，我测试了一些场景似乎iOS上的Safari只是拒绝缓存声音文件。

Safari浏览器加载音频文件（但不是的index.html）每次我重新加载页面的时间，所以缓存显然没有工作的文件大小的正确regardlessly。

经过一番研究：它看起来像它不可能缓存的音频文件。所以，你可以在文件苹果bugtracker的错误。

这里是我的代码，以证明我的结果：

的index.html：

<!DOCTYPE HTML> 
    <html lang="en-US" manifest="audio.appcache"> 
    <head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0"> 
    <meta name="apple-mobile-web-app-capable" content="yes" /> 
    <meta name="apple-mobile-web-app-status-bar-style" content="black" /> 
    <title>Cached audio</title> 
    </head> 
    <body> 
    <h1>Cached audio</h1> 
    <audio controls autobuffer> 
     <source src="sample.mp3" type="audio/mpeg" /> 
    </audio> 
    </body> 
</html>

audio.appcache：

CACHE MANIFEST 
# 2012-02-23:v1 

# explicitly cached 
CACHE: 
index.html 
sample.mp3

的.htaccess：

AddType text/cache-manifest .appcache 
AddType audio/mpeg .mp3

编辑

我也使用数据URI尝试，但，Safari浏览器一直拒绝音频数据。因此，我认为这是不可能的缓存音频...

<?php 
    function data_uri($file) { 
    $contents = file_get_contents($file); 
    $base64 = base64_encode($contents); 
    return ('data:audio/mpeg;base64,'.$base64); 
    } 
?> 
... 
<audio controls autobuffer> 
    <source src="<?php echo data_uri('sample.mp3'); ?>" type="audio/mpeg" /> 
</audio> 
...

EDIT 2

好主意，但它看起来像它不工作... Safari浏览器为OS X - >确定;适用于iOS的Safari - >仍然是我们之前遇到的相同问题。

<?php 
    function base_64_string($file) { 
    $contents = file_get_contents($file); 
    return base64_encode($contents); 
    } 
?> 
... 
<audio controls autobuffer> 
    <source id="sound-src" src="sample.mp3" type="audio/mpeg" /> 
</audio> 
... 
<script> 
    (function(){ 
    var sound; 
    if (localStorage.getItem('cachedSound')) { 
     sound = localStorage.getItem('cachedSound'); 
    } 
    else { 
     sound = "<?php echo base_64_string('sample.mp3'); ?>"; 
     localStorage.setItem('cachedSound',sound); 
    } 
    document.getElementById("sound-src").src='data:audio/mpeg;base64,' + sound; 
    })(); 
</script>

来源

2012-02-23 09:39:04 dom

您的回答让我想到了一个可能的解决方案，请参阅我的更新问题。 – shaun5 2012-02-23 11:00:34

@ shaun5看看新的编辑... – dom 2012-02-23 11:37:59

我想你必须等待用户在移动Safari下载文件之前播放文件，所以我认为你将不得不等待将它保存到本地存储。 – shaun5 2012-02-23 12:00:24

如果你还没有，你必须确保URL路径是绝对或相对.manifest的，而不是实际的网页。

您尝试缓存的实际组件的大小也有4MB的限制。

总缓存限制为5MB。

我也很肯定你不能缓存音频和视频文件。

来源

2012-02-23 12:10:16

所有三个文件（html，mp3，manifest）都在同一个目录中。总的和单个文件大小都在限制之下。你有任何经验或文件来支持你'非常确定'吗？ – shaun5 2012-02-23 12:35:04

@ shaun5我在苹果开发者网站上做了大量的阅读，没有什么可说的。我也尝试过自己做这件事，除了视频以外，所有内容都被缓存了。虽然我没有音频文件。通过消除的过程，我不得不假设你不能。 – 2012-02-23 15:02:12

-3

Apple不支持通过Safari浏览器播放音频，这是为了防止用户使用在线域名存储音乐而无需支付费用并使用iPod/iPhone播放音乐。这是试图让你为音乐付费的苹果方式。对不起大家。

来源

2012-08-30 06:08:41 Finchmeister

这个答案似乎直接矛盾的问题和其他答案。 – 2012-08-30 10:52:19

这是不正确的。 – 2012-10-03 00:44:16

可以缓存使用清单或Web存储在iOS的web应用程序的声音文件？

回答

相关问题