部分設備在微信內無法播放audio的解決方案

臨時接到一個緊急的需求，一個活動頁面，在某台iPhone 5S設備上無法播放音頻，其它設備均正常。我接到這個任務時，也是一臉懵逼，試過在audio標簽上添加controls屬性來顯示audio，結果發現在界面觸發事情里，無計怎么調用audio對象的play方法都沒有用，但是一旦激活audio標簽后，就可以調用play、pause方法 - -

 

最后搜索了一下，找到一個解決方案：

function audioAutoPlay(id){
    var audio = document.getElementById(id);

    var play = function() {
        document.removeEventListener("WeixinJSBridgeReady", play);
        document.removeEventListener("YixinJSBridgeReady", play);

        audio.play();
        audio.pause();
        // document.removeEventListener("touchstart", play, false);
    };
    
    audio.play();
    audio.pause();

    //weixin
    document.addEventListener("WeixinJSBridgeReady", play, false);
    //yixin
    document.addEventListener('YixinJSBridgeReady', play, false);

    // document.addEventListener("touchstart", play, false);
}
audioAutoPlay('audio1');

 

有需要的同學自取吧，我嘗試過，必須要在WeixinJSBridgeReady的回調中調用play方法才會激活audio對象，否則之后再調用play無效。搞前端就是這么蛋疼，后端就沒有這么蛋疼的事兒了… 

 

參考：解決ios下的微信打開的頁面背景音樂無法自動播放