audioはios微信ブラウザで自動再生の問題をサポートしていません

最近、微信の公衆番号H 5ページを開発した際、audioタグはiosシステム上で自動再生ができず、ajaxコールバックではPlayが呼び出せないことに気づき、多くの資料を探してやっと解決しました.
まずhtmlに次のコードを追加します.

html
<audio id="bg-music" src="s.wav" preload="auto">
             audio   。
audio>

私の最初のjsコード:

js
//             
function changeStatus(PostObj) {
    $.ajax({
        url:  PostObj.url,
        type:'post',
        datatype: 'json',
        data:PostObj,
        success: function(data){
            if(data.rel == 1){
                var audio = document.getElementById("bg-music");
                audio.play(); 
                msg(data.msg,function () {
                    window.location.href= window.location.href+'?time='+((new Date()).getTime());
                });
            }else{
                msg(data.msg);
            }
        }
    });
}

iOSシステムの微信ブラウザでは機能しないことがわかり、資料を探して最初の解決策を得ました.

<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js">script> 
<script> 
 //     ，          ，      iPhone     
  var audio = document.getElementById("bg-music");
  audio.play(); 
 //      Weixin JSAPI WeixinJSBridgeReady     
 document.addEventListener("WeixinJSBridgeReady", function () { 
        audio.play(); 
 }, false); 
script>

上のコードをコールバック関数に入れると、まだ機能していないことがわかり、次のような場合に有効になることがわかりますが、res.rel==1に戻るように要求した場合、音楽を再生する必要があります.そのため、自分のニーズを満たしていません.

function changeStatus(PostObj) {
     var audio = document.getElementById("bg-music");
     audio.play();
     document.addEventListener("WeixinJSBridgeReady", function () {
       audio.play();
     }, false);

    $.ajax({
        url:  PostObj.url,
        type:'post',
        datatype: 'json',
        data:PostObj，
        success: function(data){
            if(data.rel == 1){
              msg(data.msg,function () {
                    window.location.href= window.location.href+'?time='+((new Date()).getTime());
                });
            }else{
                msg(data.msg);
            }
        }
    });
}

だから私は問題がどこにあるか知っています.ajaxコールバックでaudioラベルがトリガーされないので、資料を探して次の言葉を得ました.
トラフィックの浪費を避けるために、ios携帯電話のブラウザはデフォルトでメディアファイルが自動的にロードされて再生されないことを規定しています.ロード再生のコード文は、clickイベントなどのユーザーが直接操作するイベントで実行する必要があります.XHRのloadイベントでa.play()を実行することは許されません.
ajaxを同期方式に変更するソリューションが得られた.clickイベントをずっと終わらせない.

function changeStatus(PostObj) {
    $.ajax({
        url:  PostObj.url,
        type:'post',
        datatype: 'json',
        data:PostObj,
        async: false,//      
        success: function(data){
            if(data.rel == 1){
               var audio = document.getElementById("bg-music");
                audio.play();
                document.addEventListener("WeixinJSBridgeReady", function () {
                    audio.play();
                }, false);
                msg(data.msg,function () {
                    window.location.href= window.location.href+'?time='+((new Date()).getTime());
                });
            }else{
                msg(data.msg);
            }
        }
    });
}

これでバグが解決するには、まだいくつかの細部の問題に注意していないかもしれませんが、ゆっくりと改善しなければなりません.