部分設備在微信內無法播放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下的微信打開的頁面背景音樂無法自動播放

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章