解決APP嵌套H5頁面時audio標籤不能自動播放問題

應公司需求，微信公衆號中寫了一個節日推廣活動，需求就相似於一個微場景統計，某年某月某日與用戶發生了點什麼....emmmmmm。

其中爲了使氛圍獲得恰如其分的烘托，加入了音樂需求。

而且爲了節約app開發工程師的開發資源，他們須要嵌套我這個H5頁面。

那麼問題來了~~這個頁面在微信瀏覽器、安卓app中都可以自動播放音樂，可是在蘋果app中就不可以自動播放。

 

So....看我如何解決，直接上代碼~~~~~

 1 musicAutoplayIos () {
 2     wx.config({  // 微信配置信息
 3            debug: false,
 4            appId: "",
 5            timestamp: 1,
 6            nonceStr: "",
 7            signature: "",
 8            jsApiList: []
 9     })
10     wx.ready(function() {  
11            document.getElementById("audio").play();
12     });
13 }

聲明完這個方法後，那麼接下來咱們就是去調用它

1 const oAudio = document.getElementById("audio"); // 必須原生獲取
2 this.musicAutoplayIos(); // 兼容ios手機，微信瀏覽器寫法
3 oAudio.play(); // 兼容安卓手機，微信瀏覽器寫法

 

至此~~以上代碼便可以兼容IOS手機，從而使audio標籤在蘋果app中也可以實現自動播放音樂的功能啦