egret 篇——关于ios环境下微信浏览器的音频自动播放问题

前段时间公司突然想用egret（白鹭引擎）做一个金币游戏，大半个月边看文档边写吭哧吭哧也总算是弄完了。期间遇到一个问题，那就是ios环境下微信浏览器的音频自动播放问题。

个人感觉吧，egret自己封装的audio还是不太健壮。群里，社区呼声一片，相信前端的很多人都碰到过这个问题。而网上随便search一下答案很快就出来了。这里就先copy一份答案吧。

   <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

// 方法1: 微信JS-SDK, 不推荐使用"野生"方式, 因为不知道什么时候就可以不能用了!
    // http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
    // 通过config接口注入权限验证配置后, 在 ready 中 play 一下 audio
    function autoPlayAudio1() {
        wx.config({
            // 配置信息, 即使不正确也能使用 wx.ready
            debug: false,
            appId: '',
            timestamp: 1,
            nonceStr: '',
            signature: '',
            jsApiList: []
        });
        wx.ready(function() {
            document.getElementById('bgmusic').play();
        });
    }
    // 方法2: "野生"方法, 借用原来老的 WeixinJSBridge
    function autoPlayAudio2() {
        window.onload = function() {
            // alert(typeof WeixinJSBridge);
            WeixinJSBridge.invoke('getNetworkType', {}, function(e) {
                // 在这里拿到 e.err_msg, 这里面就包含了所有的网络类型
                // alert(e.err_msg);
                document.getElementById('bgmusic').play();
            });
        };
    }
    // 大家或多或少都知道 iOS Safari 不允许自动播放 audio, 可能已经被坑过了,
    // 但微信内嵌的浏览器应该是做了一些定制化, 允许自动播放 audio.
    // 测试了以下机型在微信内嵌浏览器中仅需设置 audio autoplay 即可自动播放(audio)音乐, 无需特殊处理.
    // * iPhone5     iOS 7.0.6 WeChat 6.2
    // * iPhone5s    iOS 8.1.2 WeChat 6.3.7
    // * iPhone6Plus iOS 8.1.3 WeChat 6.3.7
    // * MI1S    Android 4.1.2 WeChat 6.3.7
    // 
    // 但是当手机是 iPhone6s iOS 9.1 WeChat 6.3.7 时, 必须做如下特殊处理才能在微信中自动播放(audio)音乐,
    // 我可以推测是 iOS 9 的兼容性问题么?
    // 
    autoPlayAudio1(); // 推荐使用方法1
    // autoPlayAudio2(); // 也可以试一试方法2

那么在egret 中怎么比较好的去实现打包h5之后，ios微信浏览器自动播放呢？这里就参考了一下前端的方法，还是贴代码比较好解释吧。
    1：在html模板中的body标签前面添加一段js,注意是body前面；

       原谅代码的缩进有些恶心，粘贴过来的就这样了。接下来，我们怎么在ts中调用呢？

class SoundMenager {
public constructor() {

//加载资源
this.loadMusic();
if (SoundMenager.getIsSound()) {
//静音引导后播放可以控制的背景音乐

setTimeout(() => {this.nullAudio.addEventListener(egret.Event.COMPLETE, function loadOver(event:egret.Event) {window["playsound"](this.nullAudio, false)}, this);}}, 800);
setTimeout(()=>{this._bgm.addEventListener(egret.Event.COMPLETE, function loadOver(event:egret.Event) {this.PlayBgMusic();}, this);},1000);
}
}

public PlayBgMusic(){
this._bgm_channel=this._bgm.play(0, -1);
}
//背景音乐开关
public StopBgmusic() {
this._bgm_channel.stop();
}

//播放音乐
public PlayMusic(audio: egret.Sound, loop: Boolean = false, callback?: any) {
let betGoldChannel: egret.SoundChannel;
if (SoundMenager.getIsSound()) {
betGoldChannel =audio.play(0,1);
if (callback) {
betGoldChannel.addEventListener(egret.Event.SOUND_COMPLETE, () => { callback(); }, this);
}
}else{
if(callback){
callback();
}
}
}....

        首先在实例化SoundMenager的时候要先加载音乐。等待加载完毕后会先通过我们前面在window环境在添加的一个方法window["playsound"]去播放一段静音去触发音频播放。
        为什么不直接播放bgm呢，我发现在window["playsound"]中return出的一个egret.SoundChannel对象不可用,ts这边是undefined。所以就先通过静音触发，再播放可以控制的背景音乐。