在iPad上播放音频

Tim*_* S. 15 audio html5 ipad

我正在建立一个与客户聊天的网站,但是,我们在iPad(iOS 5)中遇到了音频问题.

目标实际上是支持IE7的iPad是首选.

我尝试过这些方法:

HTML5

<audio id="notification" preload="auto">
    <source src="audio/notification.ogg" type="audio/ogg" />
    <source src="audio/notification.mp3" type="audio/mpeg" />
</audio>
Run Code Online (Sandbox Code Playgroud)

用一些JavaScript

var el = document.getElementById('notification');
el.play();
Run Code Online (Sandbox Code Playgroud)

一些javascript函数我偷了某个地方,实际上是一个函数中的两个不同的方法.请注意脚本位于子目录中,因此路径正确.

function notify() {
    var url = '../audio/notification.mp3';
    var a = document.createElement('audio');

    if(!!(a.canPlayType && a.canPlayType('audio/mpeg').replace(/no/, ''))) {
        var sound = new Audio(url);
        sound.load();
        sound.play();
    } else {
        $('#notification').remove();
        var sound = $('<embed id="notification" type="audio/mpeg" src="'+url+'" loop="false" hidden="true" autostart="true" />');
        $(body).append(sound);
    }
}
Run Code Online (Sandbox Code Playgroud)

这两种方法似乎都不起作用.难道我做错了什么?

Tim*_* S. 25

嗯,答案有点明显.

花了很多时间做研究等,我在Safari的官方文档中发现了一篇文章:

在iOS上的Safari(适用于所有设备,包括iPad)中,用户可能位于蜂窝网络上并按数据单元收费,因此禁用预加载和自动播放.在用户启动数据之前不会加载任何数据.这意味着JavaScript play()和load()方法在用户启动回放之前也处于非活动状态,除非用户操作触发play()或load()方法.换句话说,用户启动的播放按钮有效,但onLoad ="play()"事件不起作用.

所以,基本上,如果没有用户首先触发它,你就无法发出声音.作为解决方案,我创建了一个默认关闭的静音按钮,因此您必须单击它以播放通知声音.之后我可以使用Javascript播放声音而无需用户交互.

感谢Safari的这个美好未来.非常感谢.

  • Gah,来到Apple,用户操作正在加载网页,因此需要*两个*用户操作(加载页面,然后做其他事情).尝试触发本机键盘时遇到同样的问题. (4认同)

Jer*_*son 6

随着iOS 6 for iPad的发布,onLoad期间的音频播放仍然不支持iPad.

对于iOS 6的iPhone,只有在iPhone上的音频插孔中插入耳机时,才会在html网站的onLoad中播放音频.


Hen*_*rik 5

如果用户未事先单击它,Apple iPad不允许播放声音。

解决方案:添加一个播放/暂停按钮。

App.toggle_audio = function(elem) {
  var icon = elem.find("i");
  var playing = _.include(icon.attr('class').split(" "), "icon-pause")
  if (playing) {
    elem.html("<i class='icon-play'></i> " + App.translate_play_audio);
    App.play_audio_toggle = false;
  } else {
    App.audio_file.load();
    elem.html("<i class='icon-pause'></i> " + App.translate_pause_audio);
    App.play_audio_toggle = true;
  }
}
Run Code Online (Sandbox Code Playgroud)

一旦用户单击按钮,音频就会被加载。然后,您可以通过Javascript播放它。

  if (App.play_audio_toggle) {
    App.audio_file.play();
  }
Run Code Online (Sandbox Code Playgroud)

  • 我偶然发现了这个问题,并找到了解决之道。然后决定发布我用来帮助他人的代码。 (7认同)