播放问题HTML5音频多次在Safari

HTML：

<div id="audio-files" style="display: none;"> 
    <audio id="click-sound"> 
     <source src="/assets/click.mp3" type="audio/mpeg"> 
     <source src="/assets/click.wav" type="audio/wav"> 
    </audio> 
</div>

的JavaScript：

play: function() { 
    var audio = $('#audio-files').find('audio#click-sound'); 
    if (audio.length) { 
    audio[0].play(); 
    } 
}

期望的行为：
当我调用播放（）声音应该播放一次。应该只有1个请求到服务器 - 页面加载。 play（）的多个呼叫不应触发多个请求。

实际行为：
- Firefox（19.0.2），Chrome（26.0.1410.43）和Opera（12.15）按预期工作。
- Safari（6.0.3）只播放一次所需的声音，然后在要求时拒绝播放它或任何其他声音。

我试着在audio[0].play()之前加入audio[0].load()，但这会导致浏览器在每次播放音频时都会发出请求，这是完全不希望的。

小提琴：http://jsfiddle.net/Tpvfm/

来源

2013-04-08 George Atsev

Safari浏览器有一些有趣的音频问题。我注意到的一件事是，如果没有用户输入以编程方式触发，音频将无法启动。实质上，如果您的声音在用户点击或执行操作时被触发，Safari很可能会拒绝播放它。 audio [i] .play（）如何被调用？ – akamaozu 2013-04-10 18:16:08

在示例jsfiddle中，它通过用户单击进行调用。在我们的代码中，它是以编程方式触发的......您是否有任何关于该主题的文档/文章的链接？ – 2013-04-11 08:36:42

我觉得这是你的榜样MP3文件的问题。我刚刚从你的小提琴中删除它（mp3），它可以在OSX上的Safari中使用。

<div id="audio-files" style="display: none;"> 
    <audio id="click-sound"> 
    <source src="/assets/click.wav" type="audio/wav"> 
    </audio> 
</div>

小提琴：73GCX

来源

2013-04-12 14:44:11 danilopopeye

嗯......这很奇怪。你是对的，当我只离开wav源时，它工作正常。但为什么？在Safari中应该支持作为源的Mp3格式。 btw我在我的生产环境中使用不同的文件，这个文件只是我在互联网上随机发现的东西。然而，这个问题和我们的2个生产.mp3文件都被重现了。请给出一个合理的解释，我会给你你的奖励。谢谢！ – 2013-04-12 15:19:29

@GeorgeAcev你错过了Content-Range标题。请参阅[Apple Developer]（https://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/CreatingVideoforSafarioniPhone/CreatingVideoforSafarioniPhone.html#//apple_ref/doc/uid/TP40006514-SW1）和[html5 -audio-猎装现场直播-VS-没有（http://stackoverflow.com/questions/1995589/html5-audio-safari-live-broadcast-vs-not） – danilopopeye 2013-04-12 21:40:51

播放问题HTML5音频多次在Safari

回答

相关问题