iosの下の微信ページのバックミュージックが自動的に再生できない問題を解決します

前言
様々なHTML 5シーンページを作成する際には、バックミュージックを挿入するのが一般的なニーズです.iOSの下のsafariは音楽を自動的に再生できないことを知っていて、iOSはメディアリソースを自動的に再生できないという認識を形成してきました.微信が爆発するまで、iOSの微信の中で開いているページが自動再生できることに気づいた.このような状況は以前の認識を覆した.でも、でも...最近のプロジェクトで、また頭が痛い問題を発見しました.一部のiOS微信は、バックミュージックを自動的に再生するページを開いて音がしません!一番頭が痛いのは、この問題が同じマシン、同じiOSシステム、同じ微信バージョンになっていることです.そう、フロントエンドはいつもこのように振り回されて、同じ問題で、最終的な解決策を見つけたと思っていますが、いろいろなブラウザの更新が速くて、昨日は大丈夫で、今日は問題があるかもしれません.幸いなことに、この問題は一時的に原因と解決策を見つけました.詳細は以下を参照してください.
ソリューション
まず、普段audioタグを使ってバックミュージックを挿入するコードを見てみましょう.

コードはこの一部のユーザーを解決する方法がありますか?どのように解決しますか?
答えの鍵は微信のWeixinJsBridgeReady事件だ.これは微信が独自に提供したイベントで、テストによると、上記の一部の機子微信は微信readyを作って再生すれば、コードで自動再生機能を実現できることが分かった.具体的なコードは以下を参照してください.

function audioAutoPlay(id){
	var audio = document.getElementById(id);
	audio.play();
    document.addEventListener("WeixinJSBridgeReady", function () {
            audio.play();
    }, false);
    document.addEventListener('YixinJSBridgeReady', function() {
    	audio.play();
    }, false);
}
audioAutoPlay('Jaudio');

声が聞こえたのかな?!!解決策はこのように簡単です.
後語
まとめてみましょう.音楽の自動再生については、3つに分けることができます.
1-audioをサポートするautoplay、ほとんどのアンドロイドマシンのブラウザと微信、大部分のIOS微信(特別な解決は必要ありません)
2-audioのautoplay、一部のIOS微信(本明細書で提供するソリューション)をサポートしない
3-audioのautoplayはサポートされていません.一部のアンドロイドのブラウザ(例えば小米、safariの真似を始めた)とすべてのios safari(ユーザーが画面に触れるだけで再生がトリガーされます)
では、既知の3つのケースについて、バックミュージックを自動的に再生する問題について、総合的なソリューションコードをまとめましょう.

function audioAutoPlay(id){
	var audio = document.getElementById(id),
		play = function(){
			audio.play();
			document.removeEventListener("touchstart",play, false);
		};
	audio.play();
    document.addEventListener("WeixinJSBridgeReady", function () {
        play();
    }, false);
    document.addEventListener('YixinJSBridgeReady', function() {
    	play();
    }, false);
    document.addEventListener("touchstart",play, false);
}
audioAutoPlay('Jaudio');