iOS下Audio自动播放(Autoplay)音乐
前幾天做了一個H5活動頁面，產(chǎn)品要求初始化播放音樂，因曉得H5 Audio標(biāo)簽支持Autoplay就沒在意。 完了在手機(jī)上測試，發(fā)現(xiàn)手機(jī)上打開頁面死活就是不會自動播放，點擊播放按鈕才可以播放，很是糾結(jié)。 然后網(wǎng)上查了下發(fā)現(xiàn)iOS上禁止了Audio的Autoplay屬性，原因如下：
User Control of Downloads Over Cellular Networks
In Safari on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, preload and autoplay are disabled. No data is loaded until the user initiates it. This means the JavaScript play() and load() methods are also inactive until the user initiates playback, unless the play() or load() method is triggered by user action. In other words, a user-initiated Play button works, but an onLoad="play()" event does not.
This plays the movie: <input type="button" value="Play" onclick="document.myMovie.play()">
This does nothing on iOS: <body onload="document.myMovie.play()">
詳細(xì)查看Safari HTML5 Audio and Video Guide
借助Google翻譯了解到：蘋果為了用戶著想，禁止了Autoplay和JS "onload" 加載播放。
官方禁用，和產(chǎn)品溝通了下，產(chǎn)品發(fā)了"友站"網(wǎng)頁給我說是可以讓我參考下，確實可以，但代碼太多，棄之。
還是去http://search.yahoo.com找答案了，在IBM開發(fā)者找到了答案：
// run on page load
var audio = document.getElementById('audio');
jQuery.ajax({
url: 'ajax.js',
async: false,
success: function() {
audio.play(); // audio will play in iOS before 4.2.1
}
});
詳細(xì)查看IBM開發(fā)者
但iOS4.2.1以后就失效了，現(xiàn)在都iOS8了，真是無語了，但也沒找到其它方法，就死馬當(dāng)活馬醫(yī)試一下，結(jié)果，神奇的一幕出現(xiàn)了，打開竟然自動播放音樂了，哈哈哈...
不是說失效了么，這是為何呢？哦，剛才只是在微信里打開的，我再用Safari打開就不會自動播放音樂了，還好，我們H5活動僅限微信里面打開。
好了，不過Bug馬上又來了，測試發(fā)現(xiàn)一臺安卓機(jī)在微信里打開也不能自動播放，我拿來試了下，確實如此，然后打開"友站"的發(fā)現(xiàn)也是不能自動播放，產(chǎn)品確認(rèn)了下，讓參考"友站"的優(yōu)化一下，就是觸摸一下就會自動播放。
document.addEventListener('touchstart', function(){
audio.play();
}, false);
這次是真的好了，除了那臺Android5.x系統(tǒng)的手機(jī)，其它在微信打開都可以自動播放了。
總結(jié)一下吧：
移動端Audio Autoplay
蘋果認(rèn)為這是種不友好的行為
安卓同上
我同上
國內(nèi)流量很貴的，哎喲我的錢啊。 我們通過"投機(jī)"繞過系統(tǒng)限制而達(dá)到了目的，這樣真的好嗎？
這樣對用戶的體驗真的好嗎？
我們真的值得這樣做么？
總結(jié)
以上是生活随笔為你收集整理的iOS下Audio自动播放(Autoplay)音乐的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 战神4二周目有必要吗
- 下一篇： 代理ip 测试