微信と支付宝の下でのオーディオの自動再生

くだらないことは言わないで、直接コードをつけます.

//   、     Hack  
; void function (win, doc, undefined) {
    //   ：                       
    //                      
    Audio.prototype._play = Audio.prototype.play;
    HTMLAudioElement.prototype._play = HTMLAudioElement.prototype.play;

    function wxPlay(audio) {
        /// 

        ///     Hack
        /// 
        ///     

        WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
            audio._play();
        });
    }

    function alipayPlay(audio) {
        /// 

        ///      Hack
        /// 
        ///     

        AlipayJSBridge.call('getNetworkType', function (result) {
            audio._play();
        });
    }

    function play() {
        var self = this;

        self._play();

        try {
            wxPlay(self);
        } catch (ex) {
            document.addEventListener("WeixinJSBridgeReady", function evt() {
                wxPlay(self);
                document.removeEventListener("WeixinJSBridgeReady", evt, false);
            }, false);
        }

        try {
            alipayPlay(self);
        } catch (ex) {
            document.addEventListener('AlipayJSBridgeReady', function evt() {
                alipayPlay(self);
                document.removeEventListener("AlipayJSBridgeReady", evt, false);
            }, false);
        }
    }

    Audio.prototype.play = play;
    HTMLAudioElement.prototype.play = play;
}(window, document);

起因:
IOSやAndroidではオーディオを自動的に再生することはできません(トラフィックやユーザー体験のため、JSで直接プレイを呼び出すのは無効です).
しかし、製品犬たちはページを開けて音を再生しなければならないと要求し、多くの人を倒すことができなかった.
では、まずplay関数を呼び出すのが有効で、いつ無効なのかを知る必要があります.

var audio = new Audio("xxx.mp3");

audio.play(); //   

document.body.onclick = function(){
    audio.play(); //   
};

上記のコードから分かるように、ユーザイベントでplay関数をトリガしてこそ有効である.
ユーザーイベントとは?clickイベント、touchイベント、mouseイベント、keyboardイベントなど、ユーザーが手動でトリガーする必要があるイベントはユーザーイベントです.
解決策:
ユーザーイベントがトリガーされる以上、ユーザーイベントをシミュレートする方法はありますか?
答えは肯定的で、微信、支付宝には拡張APIがあり、このようなAPIは直接Jsに埋め込まれているため、Jsはこれらの内容をユーザーが手動でトリガーした内容と見なしている.
だから私たちはこれを利用して効果を達成することができます.
まずオリジナルのプレイ関数を保存し、AudioおよびHTML AudioElementプロトタイプのプレイ関数を書き換えます.
次に、影響を及ぼさないアプリケーション拡張関数を呼び出し、コールバック関数でplayをトリガーします.
微信や支付宝のインタフェースをよく見ると、ネットワーク情報を取得するインタフェースが最も合っていることがわかります.失敗してもコールバックを呼び出し、悪影響はありません.
まとめ:
時には問題を解決する方法がたくさんありますが、問題を解決できる方法さえあればいい方法です.