Iphone 您可以使用清单或web存储在iOS web应用程序中缓存声音文件吗？

当我将我的beep-23.mp3文件添加到缓存清单中时，音效不再在联机或脱机状态下工作。这是一个错误，还是我做错了什么

音频位于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();
    });
});

在列出beep-23.mp3时使音频停止工作

---

更新：可以代替缓存清单来存储音频？？？

iOS 6的更新：

这在iOS 6中都是固定的。您可以缓存音频文件并通过javascript播放，无需用户输入。
shaun52012年11月7日0:58

---

尽管它应该可以工作，而且没有任何规范（W3C、Apple）说它不应该工作，但我测试了一些场景，似乎iOS上的Safari只是拒绝缓存声音文件

每次我重新加载页面时，Safari都会加载音频文件（但不是index.html），因此无论文件大小如何，缓存显然都无法正常工作

经过一些研究：似乎无法缓存音频文件。因此，您可以在苹果公司提交一个bug

以下是我的代码来证明我的结果：

index.html：

.htaccess：

编辑

我也尝试过使用数据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>
...

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

您当前试图缓存的实际组件的大小也有一个限制，即4MB

总缓存限制为5MB

我也很确定你不能缓存音频和视频文件。
苹果不支持通过safari播放音频，这是为了防止人们使用在线域名存储你的音乐而不付费，也不使用你的iPod/iPhone播放它们。这是一种让你为音乐付费的方式。对不起，伙计们。
你们检查过清单的内容是否已经下载了吗？也许这只是一个输入错误…如果不知道你在做什么，很难说这是不是你的代码。你的回答让我想到了一个可能的解决方案，请参阅我的更新问题。我认为你必须等待用户播放该文件，然后Mobile Safari才会下载该文件，因此，我认为您必须等待将其保存到本地存储。@shaun5我使用console.log进行了调试，并在呈现页面后立即加载数据。所以这不可能是问题…音频在移动Safari中播放吗？根据我的经验，一旦音频列在缓存清单上，它就不会在线或离线播放。这在iOS 6中都是固定的。您可以缓存音频文件并通过javascript播放，无需用户输入。所有三个文件（html、mp3、manifest）都位于同一目录中。总文件大小和单个文件大小均在限制范围内。你是否有任何经验或文档来支持你的“非常确定”？@shaun5我在苹果开发者网站上读了很多书，没有什么可以说的。我自己也试过这么做，除了视频以外，所有的东西都被缓存了。不过我没有音频文件。通过排除的过程，我不得不假设你不能。这个答案似乎直接与问题和其他答案相矛盾。
CACHE MANIFEST
# 2012-02-23:v1

# explicitly cached
CACHE:
index.html
sample.mp3

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

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

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